Leitfaden für Fortgeschrittene: Wie Sie Ihre E-Commerce-Website mit WooCommerce Hooks & Filtern anpassen

WooCommerce Hooks und Filter: Funktionen und Unterschiede

Bei der individuellen Entwicklung von WooCommerce ist es von entscheidender Bedeutung, die beiden Erweiterungsmechanismen – Hooks und Filter – zu verstehen. Beide sind wichtige Bestandteile der Kernarchitektur von WordPress, dienen jedoch unterschiedlichen Zwecken.

Hooks(Hooks) sind Schnittstellen, die von WooCommerce bei bestimmten Lebenszyklus-Ereignissen in der Codeausführung bereitgestellt werden. Sie ermöglichen es Ihnen, Ihren eigenen Code einzubinden, um neue Aktionen oder Funktionen auszuführen. Es gibt zwei Arten von Hooks:Actions(Aktion) undFilters(Filter-Hooks.) Kurz gesagt: Action-Hooks dienen dazu, “etwas zu tun” – sie geben keinen Wert zurück, sondern bieten lediglich die Möglichkeit, Ihren eigenen Code zu einem bestimmten Zeitpunkt auszuführen. Ein Beispiel wäre das Hinzufügen eines Banners nach dem Laden der Warenkorb-Seite. Filter-Hooks hingegen dienen dazu, “etwas zu ändern”: Sie erhalten einen Wert, können diesen Wert bearbeiten und müssen den bearbeiteten Wert anschließend zurückgeben. Ein Beispiel hierfür wäre die Änderung der Anzeigeformatierung eines Produktpreises.

Filters(Filter) sind eine Art von Hook, werden aber aufgrund ihrer spezifischen Semantik (“Daten verändern und zurückgeben”) häufig zusammen mit Aktionshooks (Action Hooks) erwähnt. Ein häufiger Fehler besteht darin, Aktionshooks zu verwenden, um Werte zurückzugeben – dies kann dazu führen, dass der Code nicht funktioniert. Es ist der erste Schritt, das richtige Tool zu wählen, wenn man klar definiert, ob man eine Aktion ausführen oder Daten verändern möchte.

Empfohlene Lektüre Ein tiefer Einblick in die WordPress-Core-Hooks und -Filter: Von den Grundlagen bis hin zur praktischen Programmierung.。

Die Kern-Hook- und Filter-Schnittstellen

Die Verwendung von Hooks und Filtern basiert hauptsächlich auf einigen Kernfunktionen, die von WordPress bereitgestellt werden. Das Beherrschen dieser Funktionen ist die Grundlage für jegliche Customisierungen.

UltaHost – WordPress-Hosting-Anbieter

30-tägige Geld-zurück-Garantie, unbegrenztes Bandbreiten- und Datenbankvolumen, kostenlose DDoS-Schutzmaßnahmen sowie ein Rabatt von 501 auf 4 Terabyte bei einer Kaufdauer von 3 Jahren.

Zugangsseite

Die Kernfunktionen der Action-Hook-Funktionen

Die am häufigsten verwendeten Funktionen sindadd_action()Diese Funktion dient dazu, Ihre eigene benannte Funktion an ein bestimmtes Aktionshook zu “abonnieren”. Die grundlegende Syntax umfasst den Namen des Hooks, die Rückruffunktion, die Priorität sowie die Anzahl der akzeptierten Parameter. Die Priorität bestimmt die Reihenfolge der Ausführung, wenn mehrere Funktionen an denselben Hook gebunden sind – je kleiner die Zahl, desto höher die Priorität.

add_action(‘woocommerce_before_add_to_cart_button’, ‘my_custom_message’, 10, 0 );
function my_custom_message() {
    echo ‘<p>Bitte überprüfen Sie die Spezifikationen vor dem Kauf!</p>’;
}

Der obige Code gibt eine benutzerdefinierte Meldung aus, bevor der “Zur Warenkorb hinzufügen”-Button aktiviert wird.

Die Kernfunktion der Filter-Hook-Funktionen

Dementsprechend ist es notwendig, die Daten mithilfe der entsprechenden Werkzeuge oder Methoden zu ändern.add_filter()Funktion. Ihre Struktur ist wie…add_action()Ähnlich, aber Ihre Callback-Funktion muss einen Eingabewert entgegennehmen und einen Wert zurückgeben.

add_filter( ‘woocommerce_currency_symbol’, ‘change_currency_symbol’, 10, 2 );
function change_currency_symbol( $currency_symbol, $currency ) {
    if ( $currency == ‘USD’ ) {
        $currency_symbol = ‘US$’;
    }
    return $currency_symbol;
}

In diesem Beispiel wird das Dollarzeichen in “$” in “US$” geändert.

Empfohlene Lektüre Verbesserung der E-Commerce-Konversionen: Ein detaillierter Blick auf WooCommerce Produkt On-Page-Optimierung Strategien。

Praktischer Fall: Anpassung der Produktseite

Die Produktseite ist ein entscheidender Bestandteil von WooCommerce, und ihre Layout- sowie Informationsanzeige kann mithilfe von Hooks erheblich verändert werden. Die folgenden Hooks können Ihnen dabei helfen, die genauen Stellen zu identifizieren, an denen Sie Änderungen vornehmen möchten.

Vor dem Bereich “Zur Warenkorb hinzufügen” wird zusätzlicher Inhalt angezeigt.

woocommerce_before_add_to_cart_formundwoocommerce_before_add_to_cart_buttonEs handelt sich um zwei häufig verwendete „Hooks“ (Verarbeitungsroutinen). Der erste wird vor dem gesamten Formular ausgeführt und eignet sich dazu, Banner oder Warnmeldungen anzuzeigen; der zweite wird zwischen dem Feld zur Eingabe der Anzahl und den entsprechenden Schaltflächen ausgeführt und dient dazu, kurze Anweisungen oder Kontrollkästchen hinzuzufügen.

add_action( ‘woocommerce_before_add_to_cart_button’, ‘add_product_notes_field’ );
function add_product_notes_field() {
    echo ‘<div class="“product-notes”"><label>Anforderungen an die Anpassung:</label><textarea name="“customer_notes”"></textarea></div>’;
}

Ändern der Ausgabe des Produktzusammenfassens

Die Kurzbeschreibung des Produkts stammt von…woocommerce_short_descriptionFiltersteuerung: Mit dieser Funktion können Sie die Beschreibungsinhalte bearbeiten – beispielsweise indem Sie einen allgemeinen Text am Ende aller Beschreibungen hinzufügen.

hosting.com Shared Hosting

Hohe Leistung mit AMD EPYC-CPUs, NVMe-SSD-Speicher und LiteSpeed, fachkundiger Inhouse-Support rund um die Uhr, erweiterte Sicherheitsmaßnahmen einschließlich SSL, Brute-Force-, Malware- und DDoS-Schutz, Einsparungen von bis zu 73%

Zugangsseite

add_filter( ‘woocommerce_short_description’, ‘append_to_short_description’ );
function append_to_short_description( $desc ) {
    $desc .= ‘<p><em>Dieses Produkt unterstützt eine 7-tägige Rückgabe ohne Angabe von Gründen.</em></p>’;
    return $desc;
}

Praktischer Fall: Anpassung des Warenkorbs und des Abrechnungsprozesses

Der Warenkorb sowie die Abrechnungsseite stellen die Kernkomponenten des Konversionsprozesses dar. Ihre Optimierung verbessert direkt die Benutzererfahrung sowie die Erfolgsrate der Bestellungen.

Nach der Tabelle des Warenkorbs werden globale Informationen angezeigt.

woocommerce_after_cart_tableDie „Hook-Funktion“ ermöglicht es Ihnen, Inhalte nach der Tabelle der Waren im Warenkorb und vor der Zusammenfassung des Warenkorbs einzufügen – beispielsweise Hinweise zu Rabattcodes oder Erklärungen zu den Versandkosten.

add_action( ‘woocommerce_after_cart_table’, ‘add_cart_promotion_notice’ );
function add_cart_promotion_notice() {
    echo ‘<div class="“cart-promotion”">Ab einem Einkauf von 500 Yuan ist die Versandkostenfreiheit garantiert!</div>’;
}

Ändern der Abrechnungsfelder

Das Zahlungsfeldsystem von WooCommerce ist sehr konfigurierbar und nutzt zahlreiche Filter. Um beispielsweise das Etikett und den Platzhalter des Feldes “Adresse 2” zu ändern, kann man dazu die entsprechenden Einstellungen nutzen.woocommerce_default_address_fieldsOder genauer gesagt…woocommerce_billing_fieldsFilter.

Empfohlene Lektüre WooCommerce Tutorial: Aufbau einer leistungsfähigen WordPress E-Commerce-Website von Grund auf!。

add_filter( ‘woocommerce_default_address_fields’, ‘modify_address_2_field’ );
function modify_address_2_field( $fields ) {
    if ( isset( $fields[‘address_2’] ) ) {
        $fields[‘address_2’][‘label’] = ‘公寓、套房、单元等（可选）’;
        $fields[‘address_2’][‘placeholder’] = ‘可不填’;
    }
    return $fields;
}

Auf diese Weise können Sie beliebige Abrechnungsfelder verbergen, umordnen, umbenennen oder hinzufügen, sodass sie vollständig Ihren Geschäftsanforderungen entsprechen.

Zusammenfassungen

Durch die Nutzung von Hooks und Filters in WooCommerce können Sie die einzelnen Details einer E-Commerce-Webseite ohne Änderungen am Kerncode tiefgreifend anpassen. Beginnen Sie damit, den grundlegenden Unterschied zwischen Aktionen (Actions) und Filters zu verstehen, und erlernen Sie, wie Sie diese effektiv einsetzen können.add_action()undadd_filter()Mit diesen beiden Kernfunktionen sowie durch die Anwendung in entscheidenden Bereichen wie der Produktseite, dem Warenkorb und dem Abrechnungsprozess kannst du schrittweise einen hochgradig personalisierten und leistungsstarken Online-Shop aufbauen. Denke daran: Füge den benutzerdefinierten Code immer in die Untertemple ein.functions.phpDie Implementierung erfolgt entweder in der Datei selbst oder mithilfe von benutzerdefinierten Plugins – dies ist die beste Praxis, um die Sicherheit von Updates zu gewährleisten.

InterServer Shared Hosting

Shared Hosting $2.50 USD pro Monat, erster Monat $0.1 USD Promo-Code tryinterserver, 461 Cloud-Apps Skripte, ein Klick installieren.

Zugangsseite

FAQ Häufig gestellte Fragen

Wo sollte ich meinen eigenen Code platzieren (####)?
Die sicherste und am meisten empfohlene Vorgehensweise ist es, die Datei in einem Untertema Ihres derzeit verwendeten Themes abzulegen.functions.phpIn der Datei.

So kannst du sicherstellen, dass dein eigener Code nicht überschrieben wird, wenn das Thema aktualisiert wird. Falls du keine Untertemate verwendest, kannst du auch einen speziellen Plugin für benutzerdefinierte Funktionen erstellen, um diesen Code darin zu speichern.

Wie finde ich den bestimmten Hook oder Filter, den ich benötige?

Sie können sich die offiziellen Entwicklerdokumente von WooCommerce ansehen, in denen eine ausführliche Übersicht über die verfügbaren Hooks angegeben ist.

Darüber hinaus kann man im Code-Editor im WordPress-Backend oder mithilfe von Plugins wie “Simply Show Hooks” alle auf der aktuellen Seite verfügbaren Hooks direkt auf der Frontend-Seite visuell darstellen. Dies ist sehr hilfreich, um schnell die benötigten Funktionen zu finden.

Ich habe einen Hook verwendet, aber der Code funktioniert nicht. Wie kann ich das Problem beheben?

Zuerst sollten Sie überprüfen, ob in Ihrem Code Syntaxfehler vorhanden sind, da diese dazu führen können, dass PHP die Codeausführung nicht erfolgreich durchführt. Stellen Sie sicher, dass die Callback-Funktion korrekt definiert ist und dass alle notwendigen Parameter bereitstehen.add_actionoderadd_filterDie Priorität sowie die Anzahl der Parameter sind korrekt.

Zweitens sollten Sie überprüfen, ob der Name des Hooks korrekt ist und ob er tatsächlich an der gewünschten Stelle auf der Seite ausgeführt wird. Verwenden Sie dazu die entsprechenden Tools oder Methoden.error_logodervar_dumpEinfache Debugging-Ausgaben können Ihnen dabei helfen zu erkennen, ob eine Funktion tatsächlich aufgerufen (ausgelöst) wurde.

Was ist der Unterschied zwischen der Modifizierung von WooCommerce-Templatendateien und der Verwendung von Hooks?

Die direkte Überwriteung der WooCommerce-Vorlagen-Dateien (d.h. deren Kopieren in Ihren Theme-Verzeichnis) ist eine einfache Methode, um das Erscheinungsbild und die Struktur von WooCommerce zu ändern. Allerdings wird diese Methode in der Regel nur dazu verwendet, die HTML-Ausgabestruktur zu modifizieren.

Hooken hingegen eignen sich besser dazu, neue Funktionen hinzuzufügen, Daten zu ändern oder Inhalte an bestimmten Stellen einzufügen. Hooken bieten eine höhere Flexibilität und Wartbarkeit – insbesondere bei der Erweiterung logischer Funktionen – und sollten daher als bevorzugte Lösung angesehen werden. Die Kombination aus Template-Überlagerungen und Hook-Technologien erzielt in der Regel die besten Ergebnisse.