Dokumentation für Wohltätigkeitsorganisationen

Erfahren Sie, wie Sie mit klaren Schritt-für-Schritt-Anleitungen das Beste aus Charitable herausholen.

Anleitung zur Verwendung von Charitable-Widgets in Divi

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.

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.

  1. Klicken Sie auf das graue Plus-Symbol, um ein neues Modul hinzuzufügen
  2. Suchen Sie nach der Kategorie Charitable im Modul-Selektor
  3. 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.
Divi-Module auswählen

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.

Charitable-Kampagneneinstellungen in Divi

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

Charitable Kampagnen-Block in Divi

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.

Anzeigeoptionen für Kampagneninhalte in Divi

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.

Charitable-Spendenformular: Kampagne in Divi auswählen

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.

Charitable Spenden-Button in Divi

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.
Charitable Kampagnen-Hintergrund in Divi

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.
Charitable Suchoptionen in Divi Kampagnen

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.

Charitable Kampagnen-Erweiterte Einstellungen in Divi

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:

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:

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.

Haben Sie noch Fragen? Wir helfen Ihnen gerne weiter!

Zuletzt geändert:

Was ist neu bei Charitable

Die neuesten Updates anzeigen
🔔 Abonnieren Sie, um unsere neuesten Updates zu erhalten
📧 E-Mails abonnieren

E-Mail-Abonnement

Abonnieren Sie unseren Newsletter

Wir werden Sie nicht spammen. Wir senden nur eine E-Mail, wenn wir glauben, dass sie Ihnen wirklich hilft. Abmeldung jederzeit möglich!

Neu Vorlagen

🤩 Neue Beacon Kampagnenvorlagen mit „Hero“-Block!

Mit den neuen Beacon Kampagnenvorlagen für Charitable Pro können Sie eine beeindruckende, bildschirmfüllende Spendenaktion starten, die sofort die Aufmerksamkeit der Besucher oberhalb der Falz erregt.

Spendenaktions-Header für Save Maple Grove Park mit einem Spenden-Widget und einem kleinen quadratischen Foto eines sonnenbeschienenen Baumes als Miniaturansicht links.

🔦 Wirkung oberhalb der Falz: Beginnen Sie mit einem bildschirmfüllenden Hero-Bild, Ihrem Logo und Ihrem Spendenziel mit einem Spenden-Widget, das direkt über dem Banner platziert ist, sodass Ihre Bitte und Ihr Schwung sofort ohne Scrollen registriert werden.

📐 Zwei flexible Layouts: Wählen Sie zwischen einem strukturierten Zwei-Spalten-Layout für nebeneinanderliegende Storys und unterstützende Details oder einer übersichtlichen Ein-Spalten-Ansicht für ununterbrochene Langform-Erzählungen.

⚡ All-in-One Hero-Feld: Angetrieben durch das neue Campaign Hero-Feld, das Hintergrundmedien, Live-Fortschrittsbalken, benutzerdefinierte Spendenbeträge und wiederkehrende Spendentabs in einem einzigen zusammenhängenden Block vereint, der in jedes Layout eingefügt werden kann.

🎨 Automatische Theme-Anpassung: Das Hero-Banner und das Spenden-Widget übernehmen automatisch die Button- und Akzentfarben Ihres Kampagnen-Themes, sodass Ihre gesamte Präsentation perfekt im Markenstil bleibt, ohne eine Zeile CSS anfassen zu müssen.

Hier mehr erfahren.

Spendenformular Funktion Neu

📝 Spendenformular-Block: Ein funktionierendes Spendenformular überall einbetten

Mit dem neuen Spendenformular-Block für Charitable Pro können Sie ein voll funktionsfähiges Spendenformular direkt auf jeder Seite oder jedem Beitrag im WordPress-Block-Editor platzieren. Keine Weiterleitungen, keine Seitenaktualisierungen und null Reibung zwischen dem Lesen Ihrer Geschichte und dem Leisten eines Beitrags.

📝 Formulare überall platzieren: Platzieren Sie ein funktionierendes Formular direkt auf Ihrer Homepage, in einem Story-basierten Blogbeitrag, auf einer speziellen Landingpage oder innerhalb einer Kampagnenankündigung.

🎯 Dynamische Kampagnenbindung: Wählen Sie einfach eine bestimmte Kampagne aus der Blockseitenleiste aus oder stellen Sie sie so ein, dass sie automatisch an die gerade angezeigte Kampagne gebunden wird.

📐 Vollständige vs. Minimale Formularansichten: Wechseln Sie zwischen einem vollständigen Layout oder einer kompakten Minimalansicht, um Seitenleisten, schmale Spalten oder breite Landingpages perfekt anzupassen.

🎨 Geltungsbereichspezifische No-Code-Stile: Passen Sie Typografie, Container-Abstände, Randradius, Betragsbuttons und Akzentfarben für jede Formularinstanz unabhängig voneinander an, ohne eine Zeile CSS zu berühren.

Hier mehr erfahren.

Botschafter Neu

👤 Erstellerprofile: Geben Sie jeder Peer-to-Peer-Kampagne ein Gesicht

Ambassadors 3.3.0 bietet jetzt Erstellerprofile – geben Sie Ihren Unterstützern ein permanentes, teilbares öffentliches Zuhause, das einmalige Spendenaktionen in dauerhafte Beziehungen verwandelt.

👤 Öffentliche Erstellerseiten: Geben Sie jedem Spendenwerber eine sofortige, übersichtliche Landingpage unter /creator/ihr-name/, um ihren benutzerdefinierten Avatar, ihre Biografie und ein durchsuchbares Raster ihrer Kampagnen zu präsentieren.

📊 Erfolgsnachweis: Steigern Sie das Vertrauen der Spender, indem Sie standortweite Meilensteine im Profil anzeigen – wie z. B. die insgesamt gesammelten Gelder und die Gesamtzahl der Spender.

💳 Interaktive Hover-Karten: Wenn Spender mit der Maus über den Namen eines Erstellers auf einer Kampagnenseite fahren, erweitert sich eine kompakte Karte mit ihrer Biografie und ihren Social-Media-Handles genau im Moment der Entscheidung.

📍 Verantwortungsvolle Standortfreigabe: Ermöglichen Sie Erstellern, ihren Standort sicher mitzuzeigen, indem Sie nur Stadt-, Bundesland- und Landesdetails verwenden.

🛠️ Eigenständige Anpassung: Spendenwerber können ihre eigenen Profile aktualisieren und bis zu sechs soziale Netzwerke direkt aus dem Hub „Meine Kampagnen“ verknüpfen, was Ihnen Administratorzeit spart.

Bereit, Ihre Fürsprecher zu stärken? Aktualisieren Sie auf Ambassadors 3.3.0 und aktivieren Sie noch heute „Öffentliche Erstellerseite aktivieren“!

Verbesserung Zahlungen

📱 Verwandeln Sie mobile Scroller in Spender: Treffen Sie Charitable's Mollie Upgrade

Verlieren Sie mobile Unterstützer, weil sie es hassen, lange Kartennummern auf ihren Handys einzugeben? Charitable's aktualisierte Mollie-Integration bietet:

⚡ One-Tap Wallet Checkout: Ermöglichen Sie Spendern, ihre Geschenke sofort mit Apple Pay oder Google Pay mit einem einfachen Gesichtsscan, Fingerabdruck oder Tippen abzuschließen.

💰 Keine zusätzliche PCI-Belastung: Überspringen Sie komplexe Domain-Verifizierung und Sicherheitskonformität, da alle Wallet-Transaktionen sicher über den gehosteten Checkout von Mollie abgewickelt werden.

🛠️ Benutzerdefinierte Abbruch-Weiterleitung: Sorgen Sie für ein vorhersehbares Erlebnis, indem Sie Spender, die abbrechen, automatisch an Ihre Abbruchseite weiterleiten, oder verwenden Sie Entwicklerfilter, um sie zu einer benutzerdefinierten Seite weiterzuleiten.

Besuchen Sie diese Seite, um mehr zu erfahren.

Botschafter verbessert Neu

Moderations- und Verzeichnisbildschirme in Ambassadors 3.0

Ambassadors 3.0 hat neue Funktionen: Moderations- und Verzeichnisbildschirme… sehen Sie jetzt ganz einfach diejenigen, die Spenden in Ihrem Peer-to-Peer-Netzwerk erhalten – einschließlich Kampagnenerstellern, die möglicherweise verifiziert werden müssen – alles an einem Ort. Generieren Sie Berichte, senden Sie E-Mails direkt an Botschafter und Kampagnenersteller und mehr.

🚀 Sehen Sie, wann Kampagnenersteller und Botschafter ihre Kampagnen aktualisiert haben, welche Spender/Spenden sie eingebracht haben und mehr.

🎉 Botschafter und Kampagnenersteller manuell hinzufügen und mit einem Klick genehmigen!

Besuchen Sie diese Seite, um mehr zu erfahren.