Während die meisten Leute Charitable für Spendenaktionen nutzen, haben einige Anwender kreative Wege gefunden, es einzusetzen. Ein Kunde wollte Charitable kürzlich weiterhin als Spenden-Tool nutzen und gleichzeitig als Anmeldeformular für seine Veranstaltung.
Der erste Schritt dazu ist recht einfach: Erstellen Sie einfach eine separate Kampagne für die Veranstaltungsanmeldung. Sie können unterschiedliche Ticketpreise konfigurieren, indem Sie die Funktion „Vorgeschlagene Spenden“ verwenden – legen Sie einfach einen Preis und eine Beschreibung fest.
Die Herausforderung besteht jedoch darin, den Text des Formularbuttons dem Kontext anzupassen. Anstatt „Spenden“ sollte dort etwas wie „Tickets kaufen“ stehen.
In diesem Tutorial zeige ich Ihnen, wie Sie mit ein wenig benutzerdefiniertem Code den Text des Spendenbuttons einfach pro Kampagne anpassen können.
Die Lösung
Um dies zu erreichen, werden wir ein neues Feld im Kampagnen-Editor im WordPress-Dashboard registrieren. Dieses Feld ermöglicht es Ihnen, den Text des Spendenbuttons festzulegen.
Wir werden auch modifizierte Versionen von Vorlagen erstellen, in denen der Spendenbutton angezeigt wird. Diese werden in unserem Theme- oder Child-Theme-Ordner gespeichert und überschreiben die Standardvorlagen, die in Charitable enthalten sind.
Schritt 1: Unsere Funktion hinzufügen
Wenn Sie mein letztes Tutorial gelesen haben, wird Ihnen dieser Schritt bekannt vorkommen.
Wir werden eine PHP-Funktion hinzufügen, die ausgeführt wird, wenn der init-Hook innerhalb von WordPress aufgerufen wird. init ist ein Hook, der früh während des Ladens von WordPress aufgerufen wird, bevor die Seite gerendert wird.
add_action( 'init', function() {
// Our code will go in here.
} );
Wir verwenden hier eine anonyme Funktion, was in Ordnung ist, solange Sie eine PHP-Version größer als 5.2 verwenden.
Wenn Sie sich nicht sicher sind, wie Sie dies zu Ihrer Website hinzufügen können, lesen Sie unsere Anleitung:
Schritt 2: Das Feld zum Kampagnen-Editor hinzufügen
Als Nächstes verwenden wir die Campaign Fields API, um dem Kampagnen-Editor ein Feld „Button-Text“ hinzuzufügen.
add_action( 'init', function() {
/**
* Create a new field as an instance of `Charitable_Campaign_Field`.
*
* See all available arguments at:
*
* @https://github.com/Charitable/Charitable/blob/ef9a468fbdd6fa83307abe6ac0c38896f625cf45/includes/fields/class-charitable-campaign-field.php
*/
$campaign_field = new Charitable_Campaign_Field( 'button_text', array(
'label' => 'Button Text',
'data_type' => 'meta',
'admin_form' => array(
'type' => 'text',
'required' => false,
'default' => 'Donate',
),
'value_callback' => function( Charitable_Campaign $campaign, $key ) {
$text = $campaign->get_meta( '_campaign_button_text' );
// Set a default value to use when the button text is not set yet.
if ( empty( $text ) ) {
$text = 'Donate';
}
return $text;
},
) );
/**
* Now, we register our new field.
*/
charitable()->campaign_fields()->register_field( $campaign_field );
} );
In diesem Code erstellen wir zuerst ein neues Feld, indem wir ein Charitable_Campaign_Field-Objekt erstellen. Wir übergeben zwei Parameter beim Erstellen dieses Objekts:
– Ein Schlüssel – button_text
– Ein Array von Argumenten
Wir verwenden nur eine Teilmenge aller möglichen Argumente bei der Registrierung eines Kampagnenfeldes. Um andere verfügbare Argumente zu sehen, lesen Sie die ausführliche Inline-Dokumentation auf Github.
Ein wichtiges hier enthaltenes Argument ist der Parameter value_callback:
'value_callback' => function( Charitable_Campaign $campaign, $key ) {
$text = $campaign->get_meta( '_campaign_button_text' );
// Set a default value to use when the button text is not set yet.
if ( empty( $text ) ) {
$text = 'Donate';
}
return $text;
},
Dies ist eine Funktion, die verwendet wird, um den Wert des Feldes für eine bestimmte Kampagne abzurufen. Wir fügen sie hier hinzu, um einen Standardwert von „Spenden“ für das Feld button_text bereitzustellen. Dies ist für bestehende Kampagnen erforderlich, die seit der Hinzufügung dieses Kampagnenfeldes nicht gespeichert wurden.
Wenn wir eine neue Kampagne hinzufügen oder eine bestehende bearbeiten, sehen wir nun ein Panel „Erweiterte Einstellungen“ und darin ein Feld „Button-Text“.
Schritt 3: Überschreiben der Spendenformular-Vorlage
Innerhalb von Charitable finden Sie ein Verzeichnis templates. Alle Vorlagen in diesem Verzeichnis können überschrieben werden, indem Sie eine Kopie in Ihrem Child-Theme-Ordner erstellen. Wenn Sie kein Child-Theme verwenden, können Sie sie auch überschreiben, indem Sie eine Kopie in Ihrem Theme-Ordner erstellen. Wir empfehlen jedoch den Child-Theme-Ansatz, da er sicherstellt, dass Sie Ihre Änderungen bei zukünftigen Theme-Updates nicht verlieren.
Zuerst erstellen wir einen charitable-Ordner in unserem Child-Theme-Ordner. Wenn Sie jemals eine Vorlage im templates-Verzeichnis von Charitable überschreiben möchten, muss diese am gleichen relativen Speicherort im charitable-Ordner (ohne templates) gespeichert werden.
In unserem Fall möchten wir die Vorlage donation-form/form-donation.php überschreiben. So machen wir das:
- In unserem Child-Theme erstellen wir eine neue Datei unter
charitable/donation-form/form-donation.php. - Darin fügen wir den Inhalt der Datei
templates/donation-form/form-donation.phpaus Charitable ein.
Wenn Sie diese Datei speichern und Ihr Spendenformular neu laden, werden Sie keine Unterschiede bemerken – das liegt daran, dass wir noch nichts geändert haben! Lassen Sie uns also unseren benutzerdefinierten Button-Text kopieren.
Suchen Sie in der Vorlage nach der folgenden Zeile:
<button class="button button-primary" type="submit" name="donate"><?php _e( 'Donate', 'charitable' ); ?></button>
In der aktuellen Version von Charitable (1.6.13) befindet sich diese in Zeile 59, dies kann sich jedoch in Zukunft ändern. Der Teil, den wir ersetzen müssen, ist dieser Teil in der Mitte: <?php _e( 'Donate', 'charitable' ); ?>.
Unser benutzerdefinierter Button-Text kann abgerufen werden, indem das Kampagnenobjekt des Formulars mit $form->get_campaign() abgerufen und dann get( 'button_text' ) darauf aufgerufen wird:
<?php echo $form->get_campaign()->get( 'button_text' ); ?>
Zusammengenommen sieht die aktualisierte Zeile so aus:
<button class="button button-primary" type="submit" name="donate"><?php echo $form->get_campaign()->get( 'button_text' ); ?></button>
Wenn Sie nun das Spendenformular neu laden, wird der benutzerdefinierte Button-Text Ihrer Kampagne angezeigt.
Schritt 4: Spülen & Wiederholen für andere Vorlagen
Schritt 3 hat das Spendenformular korrigiert. Aber der „Spenden“-Button erscheint auch in einigen anderen Fällen:
- In einer Liste oder einem Raster von Kampagnen, wenn Sie den
[campaigns]-Shortcode verwenden. - Auf der Kampagnenseite selbst.
Bestimmen der zu überschreibenden Vorlagen
Welche Vorlagen Sie überschreiben müssen, hängt davon ab, wie Sie Ihr Spendenformular mit der Einstellung „Anzeigeoptionen“ unter Charitable > Einstellungen anzeigen lassen.
„Auf einer separaten Seite anzeigen“
Die beiden Vorlagen, die Sie überschreiben müssen, sind:
templates/campaign/donate-button.phptemplates/campaign-loop/donate-link.php
Kopieren und fügen Sie den Inhalt dieser beiden Dateien in Ihr Child-Theme unter ein:
charitable/campaign/donate-button.phpcharitable/campaign-loop/donate-link.php
„Auf derselben Seite anzeigen“
Die beiden Vorlagen, die Sie überschreiben müssen, sind:
templates/campaign/donate-link.phptemplates/campaign-loop/donate-link.php
Kopieren und fügen Sie den Inhalt dieser beiden Dateien in Ihr Child-Theme unter ein:
charitable/campaign/donate-link.phpcharitable/campaign-loop/donate-link.php
„In einem Modal anzeigen“
Die beiden Vorlagen, die Sie überschreiben müssen, sind:
templates/campaign/donate-modal.phptemplates/campaign-loop/donate-modal.php
Kopieren und fügen Sie den Inhalt dieser beiden Dateien in Ihr Child-Theme unter ein:
charitable/campaign/donate-modal.phpcharitable/campaign-loop/donate-modal.php
Änderungen vornehmen
Abhängig davon, welche Vorlage Sie überschreiben, ist der tatsächliche Teil, den Sie ändern müssen, entweder:
<?php _e( 'Donate', 'charitable' ); ?>
Oder:
<?php esc_attr_e( 'Donate', 'charitable' ); ?>
Um die erste Variante (d. h. _e) zu ändern, ersetzen Sie sie durch Folgendes:
<?php echo $campaign->get( 'button_text' ); ?>
Wenn Sie die zweite Variante (d. h. esc_attr_e) ändern, tauschen Sie sie gegen Folgendes aus:
<?php echo esc_attr( $campaign->get( 'button_text' ) ); ?>
Abschluss
Nachdem Sie nun alle Vorlagen aktualisiert haben, sollten Sie sehen, dass Ihr benutzerdefinierter Kampagnen-Button-Text überall dort angezeigt wird, wo ein Spenden-Button angezeigt wird. Alles, was wir tun mussten, um dorthin zu gelangen, war, ein neues Kampagnenfeld zu erstellen und drei Standardvorlagen mit unserem Child-Theme zu ändern.
Ich hoffe, Sie können sehen, wie flexibel die Campaign Fields API ist und dass dieser Prozess verwendet werden kann, um viele weitere Anpassungen daran vorzunehmen, wie Charitable auf Ihrer Website funktioniert. Sie könnten diesen Prozess beispielsweise anpassen, um eine kampagnenspezifische Beschreibung vor dem Spendenformular einzufügen. Dazu müssen Sie lediglich ein neues Kampagnenfeld erstellen und den Wert dieses Feldes in die Vorlage form-donation.php einfügen (d. h. Schritte 2 & 3).
Fanden Sie das hilfreich? Haben Sie Fragen? Ich würde mich freuen, von Ihnen zu hören. Senden Sie uns eine E-Mail über unsere Support-Seite oder hinterlassen Sie einen Kommentar unten. Wenn Sie einen Vorschlag für ein Thema haben, das ich in einem zukünftigen Tutorial behandeln soll, würden wir uns auch darüber freuen, davon zu hören. 🙂
Hinterlassen Sie eine Antwort