Das Erstellen einer benutzerdefinierten Spendenseite oder einer Kampagnenübersicht erfordert oft komplexe Codes oder Tools von Drittanbietern, die nicht zum Design Ihrer Website passen.
Charitable löst dies mit nativer Integration für Divi und bietet vier speziell entwickelte Module, mit denen Sie Fundraising-Elemente per Drag & Drop direkt in Ihre Layouts einfügen können.
Mit diesen Widgets können Sie eine einfache Spenden-Schaltfläche hinzufügen oder eine voll funktionsfähige Kampagnen-Landingpage erstellen.
In dieser Anleitung zeigen wir Ihnen, wie Sie die Charitable Divi Module verwenden, um Ihre Fundraising-Website ohne Programmierkenntnisse anzupassen.
Hinweis: Die Divi Module sind ein Premium-Feature, das in Charitable Pro verfügbar ist.
Haben Sie Charitable noch nicht? Sie müssen es zuerst installieren. Das Divi Widgets Feature ist im Charitable Pro Plugin verfügbar.
Noch kein Charitable Pro-Benutzer? Melden Sie sich noch heute an und erhalten Sie bis zu 50 % Rabatt auf Ihren Plan. Wir sind zuversichtlich, dass Sie es lieben werden, mit Charitable Spenden zu sammeln. Wenn Charitable aus irgendeinem Grund nicht das Richtige für Sie ist, erstatten wir Ihnen den Kaufbetrag im Rahmen unserer 14-tägigen Geld-zurück-Garantie zurück. Holen Sie sich jetzt Charitable Pro »
Inhaltsverzeichnis
Voraussetzungen
Bevor Sie die Divi Module von Charitable verwenden können, müssen einige Dinge vorhanden sein, um sicherzustellen, dass alles korrekt funktioniert.
- Divi Theme oder Divi Builder Plugin installiert und aktiv
- Charitable (kostenlos) oder Charitable Pro installiert und aktiv
- Mindestens eine Kampagne in Charitable erstellt
Die Charitable Module finden
Charitable Module sind in ihrer eigenen spezifischen Kategorie im Divi Builder gruppiert, was sie sehr einfach zugänglich macht.
Öffnen Sie zuerst eine beliebige Seite oder einen Beitrag, auf dem Sie Fundraising-Elemente mit dem Divi Visual Builder hinzufügen möchten.
- Klicken Sie auf das graue Plus-Symbol, um ein neues Modul hinzuzufügen
- Suchen Sie nach der Kategorie Charitable im Modul-Selektor
- Alle vier Charitable Module werden dort aufgelistet
- Charitable Kampagne: Zeigt eine einzelne Kampagne an.
- Charitable Kampagnen: Zeigt ein Raster oder eine Liste mehrerer Kampagnen an.
- Charitable Spendenformular: Bettet ein Spendenformular ein.
- Charitable Spenden-Schaltfläche: Fügt eine Call-to-Action-Schaltfläche hinzu.

Lassen Sie uns nun untersuchen, wie Sie jedes dieser Module effektiv nutzen können.
Charitable Kampagnen Modul
Das Kampagnenmodul ist dafür konzipiert, eine einzelne, spezifische Kampagne auf Ihrer Seite anzuzeigen. Es zieht automatisch wichtige Details wie den Kampagnentitel, die Beschreibung, die Fortschrittsleiste und aktuelle Spendenstatistiken.

Wann Sie dieses Modul verwenden sollten
- Eine bestimmte Kampagne hervorheben: Wenn Sie eine wichtige Spendenaktion durchführen, können Sie dieses Modul auf Ihrer Homepage platzieren, um ihm maximale Sichtbarkeit zu verleihen.
- Eine Landingpage erstellen: Es ist perfekt für den Aufbau einer speziellen Landingpage für einen bestimmten Zweck, sodass Sie die Kampagnendetails an Ihr Branding anpassen können.
- Eine Initiative hervorheben: Nutzen Sie es, um die Aufmerksamkeit auf Ihr wichtigstes Fundraising-Ziel des Monats zu lenken.
Charitable Kampagnen Modul

Wenn Sie mehr als eine Spendenaktion gleichzeitig anzeigen möchten, ist das Kampagnenmodul die richtige Wahl.
Dieses Modul zeigt ein Raster oder eine Liste mehrerer Kampagnen an, sodass Besucher Ihre aktiven Initiativen durchsuchen können.
Sie können die gewünschte Option auswählen, indem Sie einfach darauf klicken. Ein blauer „JA“-Button wird angezeigt.

Wann Sie dieses Modul verwenden sollten
- Abschnitt „Aktuelle Kampagnen“: Erstellen Sie einen Abschnitt auf Ihrer Homepage, der alle Ihre aktiven Spendenaktionen präsentiert.
- Kampagnenarchive: Erstellen Sie eine spezielle Seite, auf der Spender alle vergangenen und gegenwärtigen Anliegen einsehen können.
- Seitenleisten- oder Fußzeilenanzeige: Sie können dies verwenden, um ausgewählte Kampagnen in kleineren Bereichen wie einer Fußzeile oder Seitenleiste anzuzeigen.
Charitable Spendenformular Modul
Das Spendenformularmodul ermöglicht es Ihnen, ein vollständiges Spendenformular für eine bestimmte Kampagne direkt in jedes Seitenlayout einzubetten.
Hinweis: Wenn Sie dieses Modul im visuellen Builder verwenden, sehen Sie ein Platzhalterbild. Das tatsächliche interaktive Spendenformular wird im Live-Frontend Ihrer Website angezeigt.

Wann Sie dieses Modul verwenden sollten
- Kampagnen-Landingpages: Fügen Sie das Spendenformular direkt zu einer Kampagnenseite hinzu, um die Hürden für Spender zu verringern.
- Eigenständige Spendenseite: Erstellen Sie eine spezielle Seite, die ausschließlich der Annahme von Spenden ohne Ablenkungen dient.
- Einbettungsfunktion: Sie können problemlos Spendenfunktionen zu jedem Blogbeitrag oder Seitenlayout hinzufügen.
Charitable Spenden-Schaltfläche Modul
Das Spenden-Button-Modul erstellt einen Call-to-Action (CTA)-Button oder Link, der Besucher zu einer bestimmten Kampagne leitet, um eine Spende zu tätigen.

Wann Sie dieses Modul verwenden sollten
- Call-to-Actions (CTAs): Platzieren Sie Spenden-Buttons im gesamten Website-Inhalt, um zum Spenden anzuregen.
- Header und Hero-Bereiche: Präzise „Jetzt spenden“-Buttons in Ihrem Website-Header oder in Hero-Bildbereichen für hohe Sichtbarkeit.
- Inhaltslinks: Fügen Sie Spendenlinks in Ihre Blogbeiträge oder Fallstudien ein.
Die Divi Widgets anpassen
Wenn Sie ein Modul zu Ihrer Seite hinzufügen, wie z. B. das Kampagnen-Modul, erscheint ein Einstellungsfenster mit einer Taskleiste auf der linken Seite.
Divi unterteilt diese Einstellungen in drei Registerkarten: Inhalt, Design und Erweitert. Hier erfahren Sie, wie Sie sie zur Anpassung Ihrer Fundraising-Elemente verwenden können.
1. Registerkarte „Inhalt“
Die Optionen in diesem Tab variieren leicht, je nachdem, welches spezifische Modul Sie ausgewählt haben. Für das Modul Kampagnen finden Sie normalerweise:
- Filter: Ermöglicht Ihnen die Steuerung, welche Kampagnen im Raster angezeigt werden.
- Feedback: Senden Sie Feedback-Notizen und Vorschläge an Charitable
- Hintergrund: Sie können den Hintergrund des Moduls vollständig anpassen. Sie können eine Volltonfarbe hinzufügen, ein Bild oder Video hochladen und sogar Muster oder Masken für einen modernen Look anwenden.
- Admin-Label: Dies ermöglicht Ihnen, das Modul zu benennen, damit Sie es in der Backend-Builder-Ansicht leicht identifizieren können.

2. Design-Tab
Der Design-Tab ist der Ort, an dem Sie den visuellen Stil Ihres Spendenbereichs steuern. Sie haben die volle Kontrolle über:
- Text: Passen Sie Schriftarten, Größen und Farben an Ihr Thema an.
- Layout: Passen Sie an, wie die Kampagnen angeordnet sind.
- Größe & Abstände: Verwalten Sie Breite, Höhe, Ränder und Innenabstände.
- Rahmen & Schatten: Fügen Sie Rahmen, abgerundete Ecken und Schatten für Tiefe hinzu.
- Effekte: Sie können sogar Filter, Transformationen und Animationen hinzufügen, um Ihre Kampagnen hervorzuheben.

3. Erweiterter Tab
Für Entwickler oder diejenigen, die präzise Kontrolle benötigen, bietet der Erweiterte Tab Optionen zum:
- Benutzerdefiniertes CSS: Fügen Sie Ihr eigenes CSS zu bestimmten Elementen des Moduls hinzu.
- Attribute: Verwalten Sie HTML-Attribute.
- Bedingungen: Legen Sie bedingte Logik fest, wann das Modul angezeigt werden soll.
Sie können auch Sichtbarkeit, Übergänge, Positionen und Scroll-Effekte steuern.

Benutzerdefiniertes CSS
Jedes Charitable-Modul enthält einen Abschnitt für benutzerdefiniertes CSS im Erweiterten Tab, mit dem Sie bestimmte Elemente ansprechen können:
Häufige CSS-Ziele umfassen:
- Kampagnentitel
- Fortschrittsbalken
- Spenden-Buttons
- Formularfelder
- Kampagnenkarten (in der Rasteransicht)
Tipps für beste Ergebnisse
Um das Beste aus den Charitable Divi-Modulen herauszuholen, finden Sie hier ein paar schnelle Tipps, die Sie beim Erstellen Ihrer Seiten beachten sollten.
- Vorschau des visuellen Builders: Die Module „Kampagne“ und „Kampagnen“ zeigen Live-Vorschauen direkt im Builder an. Das Modul „Spendenformular“ zeigt jedoch während der Bearbeitung ein Platzhalterbild an. Keine Sorge, das eigentliche Formular wird im Frontend korrekt angezeigt.
- Konsistenz der Gestaltung: Für ein professionelles Aussehen verwenden Sie die globalen Texteinstellungen im Design-Tab, um Ihre Schriftarten mit Ihrem Divi-Theme abzugleichen.
- Mobile Optimierung: Überprüfen Sie Ihr Design immer in der mobilen Ansicht. Möglicherweise möchten Sie die Anzahl der Spalten im Kampagnenraster für Tablet- und Telefonbenutzer reduzieren, um sicherzustellen, dass der Text lesbar bleibt.
- Leistung: Die Dropdown-Optionen für Kampagnen werden zwischengespeichert, um die Leistung zu verbessern. Wenn Sie gerade eine Kampagne erstellt haben und sie nicht in der Liste sehen, speichern Sie Ihr Layout als Entwurf und aktualisieren Sie den Builder.
Häufige Probleme beheben
Wenn Sie Probleme bei der Einrichtung Ihrer Module haben, finden Sie hier die häufigsten Lösungen:
- Module werden nicht angezeigt? Stellen Sie sicher, dass sowohl das Charitable-Plugin als auch der Divi Builder (oder das Theme) aktiv sind. Wenn ja, versuchen Sie, den Cache Ihres Browsers zu leeren.
- Kampagnen-Dropdown ist leer? Sie müssen mindestens eine Kampagne mit dem Status „Veröffentlicht“ haben, damit sie in der Liste angezeigt wird. Entwurfs-Kampagnen werden nicht angezeigt.
- Styling wird nicht angewendet? Dies ist oft ein Caching-Problem. Gehen Sie zu Divi » Theme-Optionen » Builder » Erweitert und leeren Sie den statischen CSS-Cache von Divi. Überprüfen Sie auch auf CSS-Konflikte mit Ihrem aktiven Theme.
Das ist alles! Sie haben jetzt gelernt, wie Sie Charitable Divi-Module verwenden, um schöne Spenden-Seiten zu erstellen.
Sie wissen nicht, wie Sie eine Spendenaktion erstellen? Erfahren Sie So richten Sie Ihre erste Kampagne ein »
Hier sind einige der beliebtesten Anleitungen und Hilfsartikel für neue Benutzer:
- Spenden im WordPress-Dashboard erstellen und bearbeiten
- Verwendung des Spenderverwaltungssystems
- Verbindung mit Google Analytics
- Probleme mit nicht gesendeten Spenden-E-Mails
- Spenden-E-Mails vom Dashboard erneut senden
- Widgets und Shortcodes
Mehr Tipps zum Fundraising und Ratschläge für gemeinnützige Organisationen?
Wir teilen regelmäßig praktische Anleitungen, bewährte Strategien und Insider-Tipps, um Ihnen zu helfen, mehr Spenden zu sammeln und stärkere Spenderbeziehungen aufzubauen. Schließen Sie sich Tausenden von gemeinnützigen Organisationen an, die unsere besten Inhalte direkt erhalten:
- Abonnieren Sie unseren Newsletter – Erhalten Sie wöchentliche Tipps und exklusive Anleitungen in Ihrem Posteingang
- Abonnieren Sie unseren YouTube-Kanal – Sehen Sie sich Schritt-für-Schritt-Anleitungen und Erfolgsgeschichten an
- Folgen Sie uns auf LinkedIn – Vernetzen Sie sich mit unserer Community und erhalten Sie tägliche Einblicke in Non-Profit-Organisationen
- Folgen Sie uns auf TikTok – Aufschlussreiche & unterhaltsame Videos, die Ihnen helfen, Ihre Sache voranzubringen
- Folgen Sie uns auf Instagram – Lustige Reels mit Einblicken und Tipps für gemeinnützige Organisationen
Kein Schnickschnack, nur umsetzbare Ratschläge von Menschen, die die Herausforderungen verstehen, denen Sie täglich gegenüberstehen.
Gibt es Video-Tutorials für Charitable?
Ja! Abonnieren Sie den Charitable YouTube-Kanal für Schritt-für-Schritt-Anleitungen und Erfolgsgeschichten.
Benötigen Sie Unterstützung? Haben Sie eine Frage? Wenn Sie ein Lite/kostenloser Benutzer von Charitable sind, können Sie sich an unser Team in den Support-Foren von WordPress.org wenden. Wenn Sie eine aktive Lizenz haben, können Sie uns für bevorzugten Support direkt kontaktieren.


