So verwenden Sie WooCommerce Hooks – Anleitung mit Beispielen

Möchten Sie lernen, wie man WooCommerce-Hooks verwendet? Sie sind an der richtigen Stelle! In dieser Anleitung zeigen wir Ihnen, wie Sie Aktions- und Filter-Hooks verwenden. Außerdem stellen wir Ihnen viele Beispiele zur Verfügung, die Sie auf Ihren WooCommerce-Shop anwenden können!

Wenn Sie WooCommerce auf Ihrer Website installieren, haben Sie Zugriff auf eine lange Liste neuer Hooks, die Ihre Möglichkeiten zur Entwicklung einer maßgeschneiderten Lösung erweitern. WooCommerce-Hooks funktionieren genauso wie native WordPress-Hooks und ermöglichen es Ihnen, benutzerdefinierte Skripte auf jeder WooCommerce-Seite auszuführen.

Ähnlich wie bei WordPress-Hooks gibt es zwei Arten von WooCommerce-Hooks: Aktion oder Filter. Mit dem Aktions-Hook können Sie ein Skript einfügen, während die Filter-Hooks Originaldaten empfangen und mit einer Art Modifikation zurückgeben.

Syntax von WooCommerce-Hooks

WooCommerce-Hooks folgen der gleichen Syntax wie WordPress-Hooks.

Aktionshaken

add_action('name_of_the_action_hook','your_action_hook_funcion');

Filterhaken

add_filter('name_of_the_filter_hook','your_filter_hook_funcion');

Nachdem Sie den Hook deklariert haben, müssen Sie Ihre Skripte in die Funktion einfügen:

 Funktion your_action_hook_funcion(){
# Ihr Code hier
}

Filter-Hooks müssen einige Daten in einem Parameter der Funktion zurückgeben:

 Funktion your_filter_hook_function($data){
# Ihr Code, der $data modifiziert
$daten zurückgeben;
}

Um einen WooCommerce-Hook in Aktion zu sehen, fügen Sie den folgenden Code in die Datei functions.php Ihres Child-Themes ein:

 add_action( 'woocommerce_product_meta_start', 'quadlayers_woocommerce_hooks');
Funktion quadlayers_woocommerce_hooks() {
echo '<img src="https://kokohai.com/wp-content/uploads/2020/02/logo-kokohai-tienda-de-merchandising-de-anime-y-maga-e1584570981420.png">'; // Zur gewünschten Bild-URL wechseln
}

Dies ist das grundlegendste Beispiel, bei dem Sie allen Produktseiten ein Bild hinzufügen. Das Bild wird unter der Schaltfläche „ Zum Warenkorb hinzufügen“ vor den Metadaten des Produkts angezeigt.

Wie Sie sehen können, ist der Name des Hooks, woocommerce_product_meta_start , selbsterklärend und sagt Ihnen genau, wo Sie mit diesem Hook Ihren Code einfügen können.

Liste der WooCommerce-Hooks

Es gibt mehr als tausend WooCommerce-Hooks. Hier listen wir die beliebtesten auf, damit Sie sich mit den gängigsten und bekanntesten Hooks vertraut machen.

Wir haben die Liste entsprechend der Seite, auf die sie sich beziehen, in Abschnitte unterteilt. Die Namen der Haken sind selbsterklärend, so dass Sie keine Probleme haben werden, zu verstehen, was sie tun.

• Wagen

  • woocommerce_before_cart
  • woocommerce_before_cart_table
  • woocommerce_before_cart_contents
  • woocommerce_cart_contents
  • woocommerce_after_cart_contents
  • woocommerce_cart_is_empty
  • woocommerce_cart_totals_before_shipping
  • woocommerce_cart_totals_after_shipping
  • woocommerce_cart_totals_before_order_total
  • woocommerce_cart_totals_after_order_total
  • woocommerce_after_shipping_rate
  • woocommerce_before_shipping_calculator
  • woocommerce_proceed_to_checkout
  • woocommerce_after_cart_totals
  • woocommerce_after_cart

• Kasse

  • woocommerce_before_checkout_form
  • woocommerce_checkout_before_customer_details
  • woocommerce_before_checkout_billing_form
  • woocommerce_checkout_shipping
  • woocommerce_checkout_after_order_review
  • woocommerce_checkout_after_customer_details
  • woocommerce_checkout_before_order_review
  • woocommerce_review_order_before_cart_contents
  • woocommerce_review_order_after_cart_contents
  • woocommerce_review_order_before_shipping
  • woocommerce_review_order_after_shipping
  • woocommerce_review_order_after_order_total
  • woocommerce_checkout_order_review
  • woocommerce_review_order_after_submit
  • woocommerce_review_order_after_payment
  • woocommerce_after_checkout_form
  • woocommerce_danke
• Weitere Informationen zu Checkout-Hooks finden Sie in unserem vollständigen Leitfaden zu WooCommerce Checkout-Hooks.

• Produkte

  • woocommerce_before_main_content
  • woocommerce_after_main_content
  • woocommerce_before_single_product_summary
  • woocommerce_after_single_product_summary
  • woocommerce_before_single_product
  • woocommerce_after_single_product
  • woocommerce_single_product_summary
  • woocommerce_product_meta_start
  • woocommerce_product_meta_end
  • woocommerce_review_before
  • woocommerce_review_before_comment_meta
  • woocommerce_review_before_comment_text
  • woocommerce_review_comment_text
  • woocommerce_review_after_comment_text

• Taxonomien

  • woocommerce_archive_description
  • woocommerce_shop_loop
  • woocommerce_before_shop_loop
  • woocommerce_after_shop_loop
  • woocommerce_after_shop_loop_item
  • woocommerce_after_shop_loop_item_title
  • woocommerce_shop_loop_item_title

• Konto

  • woocommerce_before_account_navigation
  • woocommerce_after_account_navigation
  • woocommerce_before_edit_account_address_form
  • woocommerce_account_content
  • woocommerce_before_my_account
  • woocommerce_after_my_account

• Mini-Wagen

  • woocommerce_before_mini_cart
  • woocommerce_before_mini_cart_contents
  • woocommerce_mini_cart_contents
  • woocommerce_widget_shopping_cart_before_buttons
  • woocommerce_widget_shopping_cart_buttons
  • woocommerce_after_mini_cart

• Email

  • woocommerce_email_after_order_table
  • woocommerce_email_before_order_table
  • woocommerce_email_customer_details
  • woocommerce_email_footer
  • woocommerce_email_header
  • woocommerce_email_order_details

• Global

  • pre_get_product_search_form
  • woocommerce_breadcrumb
  • woocommerce_no_products_found

Die vollständige Liste der WooCommerce-Hooks finden Sie in der offiziellen WC-Dokumentation.

Nützliche Beispiele für WooCommerce-Hooks

Schauen wir uns nun einige Beispiele für nützliche Dinge an, die Sie mit WooCommerce-Hooks machen können.

HINWEIS : Bevor Sie beginnen, empfehlen wir Ihnen, ein untergeordnetes Thema zu erstellen. Wenn Sie damit nicht vertraut sind, können Sie sich unsere Anleitung zum Erstellen eines untergeordneten Themas und die Liste der besten untergeordneten Themen-Plugins ansehen.

Wenn Sie gerade erst mit Hooks beginnen, können Sie diese Skripte einfach kopieren und in die Datei functions.php Ihres Child-Themes einfügen. Wenn Sie sich dann wohler fühlen, können Sie die Skripte bearbeiten und eine andere Logik erstellen.

Fügen Sie der Shop-Seite eine Beschreibung hinzu

Standardmäßig zeigt die Shop-Seite die Beschreibung nicht an. Sie können es jedoch mit dem Hook woocommerce_archive_description wie folgt aktivieren:

 Funktion quadlayers_shop_description() {
$description = '<p>Willkommen in meinem Shop, bitte seien Sie großzügig und kaufen Sie viele Dinge, danke.</p>';
Echo $Beschreibung;
}

add_action('woocommerce_archive_description', 'quadlayers_shop_description');

Fügen Sie einen Informationshinweis nach der Schaltfläche „In den Warenkorb“ hinzu

WooCommerce-Warenkorb-Hooks ermöglichen es Ihnen, benutzerdefinierte Skripte in viele Abschnitte der Warenkorbseite einzufügen. Hier zeigen wir Ihnen, wie Sie nach der Schaltfläche In den Warenkorb einen Text hinzufügen.

Dieses Skript druckt einen benutzerdefinierten Text nach der Schaltfläche In den Warenkorb.

 add_action( 'woocommerce_after_add_to_cart_form', 'quadlayers_after_addtocart_button' );
Funktion quadlayers_after_addtocart_button() {
	// HINWEIS: Ersetzen Sie Ihre Kategorie-Slugs durch 'Musik' && ersetzen Sie /delivery-costs/ durch eine gültige URL
	if ( is_product() && has_term( array( 'music' ), 'product_cat' ) ) {
		echo '<div></div><div>;<a href="/lieferkosten/" target="_blank" rel="noopener"><i class="fa fa-truck" aria-hidden=" true"></i> Geben Sie 100 $ aus und erhalten Sie eine kostenlose Lieferung;</a></div>
'; } }

Sie können dies verwenden, um beispielsweise Rabatte zu bewerben, die einen Mindestumsatz oder eine kostenlose Lieferung erfordern.

Code-Erklärung

• Der Hook woocommerce_after_add_to_cart_form den HTML-Code nach dem Button aus.
• Wir prüfen, ob die aktuelle Seite eine Produktseite ist und unsere angegebene Kategorie hat.
• Verwenden Sie den Kategorie-Slug innerhalb eines Arrays. Auf diese Weise können Sie mehrere Kategorien überprüfen.
• Echoinhalt erlaubt HTML-Tags, Variablen und alles andere innerhalb des PHP-Bereichs.

Fügen Sie Text zu einer bestimmten Produkttaxonomie hinzu

Sehen wir uns nun an, wie WooCommerce-Hooks verwendet werden, um eine Nachricht in Produkten mit einem bestimmten Tag anzuzeigen. Beispielsweise zeigen wir eine Nachricht an, die einen Rabatt für bestimmte Produkte anbietet.

Denken Sie daran, das Produkt zuerst zu markieren.

 add_action( 'woocommerce_before_single_product', 'my_product_notice_function' );
Funktion my_product_notice_function() { 
if ( is_product() && has_term( 'discount-25','product_tag' ) ) {
echo '<p><strong>Auf dieses Produkt erhalten Sie 25 % Rabatt für die nächsten 48 Stunden!</strong></p>';
}
}

Code-Erklärung

1. 1. Wir verwenden den Hook woocommerce_before_single_product , um eine Nachricht oben auf der Produktseite anzuzeigen.
   2. Innerhalb der Funktion verwenden wir eine Bedingung für is_product() , um sicherzustellen, dass es sich um eine Produktseite handelt.
   3. Und has_term() prüft, ob das aktuelle Produkt das Tag „discount-25“ hat.
   4. Geben Sie dann Ihre Nachricht in der if-Anweisung aus.

Käufe von abgemeldeten Benutzern blockieren

Mit WooCommerce-Hooks können Sie die Schaltfläche „ Zum Warenkorb hinzufügen“ auf Produktseiten für abgemeldete Benutzer deaktivieren. Dies kann für Produkte oder Angebote nützlich sein, die nur für Abonnenten oder Mitglieder verfügbar sind. Um das Beispiel zu vervollständigen, fügen wir einen zweiten Hook hinzu, um eine Nachricht anzuzeigen, wenn die Schaltfläche „Kaufen“ deaktiviert ist.

Der Filter-Hook woocommerce_is_purchasable blockiert den Kauf und der Aktions-Hook woocommerce_before_single_product zeigt die Nachricht an.

 add_action( 'woocommerce_before_single_product', 'quadlayers_add_message');
add_filter( 'woocommerce_is_purchasable', 'quadlayers_block_admin_purchase' );
Funktion quadlayers_block_admin_purchase($block) {
Wenn ( is_user_logged_in() ): true zurückgeben;
sonst: false zurückgeben;
endif;
}

Funktion quadlayers_add_message( ){
if ( !is_user_logged_in() ):echo '<H2>BITTE ANMELDEN, UM DIESES PRODUKT ZU KAUFEN</h2>';
endif;
}

Code-Erklärung

1. Wir verwenden den Action-Hook, um eine Nachricht zu drucken, und den Filter-Hook, um die Schaltfläche „Zum Warenkorb hinzufügen“ zu deaktivieren.
2. Der Filter-Hook woocommerce_is_purchasable ist wahr, wenn der Benutzer angemeldet ist, und falsch, wenn er abgemeldet ist.
3. Wir verwenden auch eine bedingte if()- Anweisung, um die Bedingungen in beiden Funktionen nur auf abgemeldete Benutzer anzuwenden (Schaltfläche „Zum Warenkorb hinzufügen“ deaktiviert und die Nachricht).
4. Schließlich haben wir der Nachricht ein CSS-Styling hinzugefügt, das in einem H2-HTML-Tag eingeschlossen ist.

Wie kann man WooCommerce Hooks optimal nutzen?

Zusammenfassend lässt sich sagen, dass WooCommerce-Hooks großartige Tools zum Anpassen Ihrer Website sind. Es gibt Hunderte von Hooks, die verwendet werden können, und alle folgen derselben Syntax. Wir empfehlen Ihnen daher, sich die Beispiele anzusehen und sich inspirieren zu lassen, um die Hooks anzuwenden, die Sie auf Ihrer Website benötigen.

Mit Hooks können Sie jeden Bereich Ihres Shops verbessern: von der Kasse über den Warenkorb bis hin zu den Produktseiten, Taxonomien und vielem mehr! Also, wenn Sie das Beste aus ihnen machen wollen, machen Sie weiter, spielen Sie herum und lassen Sie uns wissen, wie das geht. Wenn Sie detailliertere Informationen zu Checkout-Hooks wünschen, können Sie einen Blick in unseren Checkout-Hooks-Leitfaden werfen.

Zögern Sie schließlich nicht, uns bei Fragen zu kontaktieren. Wir werden unser Bestes tun, um Ihnen zu helfen!