Cum să utilizați WooCommerce Hooks - Un ghid complet

Publicat: 2022-05-03

În acest articol vom discuta despre cum puteți utiliza WooCommerce Hooks pentru a vă extinde magazinul WooCommerce în funcție de cerințele dvs.

Te-ai întrebat vreodată cum a devenit WordPress atât de mare? Mai mult de 40% dintre site-urile web din lume folosesc acum WordPress ca CMS. Totul a fost posibil prin cârlige și filtre cu ajutorul cărora oamenii au creat mii de pluginuri.

Din când în când, s-ar putea să ascultați oameni spunând că PHP va muri în curând, dar cota WordPress continuă să crească, iar WordPress se bazează complet pe PHP. Ei bine, doar timpul va spune.

Dacă nu ai dezvoltat niciodată un plugin WordPress, atunci trebuie să te uiți la acest ghid, deoarece trebuie să știi cum să creezi un plugin WordPress înainte de a putea folosi acest ghid.

Cuprins

Ce sunt Hooks?

Este posibil să editați sau să adăugați cod în WordPress fără a edita fișierele de bază folosind cârlige.

WordPress și WooCommerce folosesc pe scară largă cârlige, care sunt funcții pe care dezvoltatorii WordPress și WooCommerce le pot personaliza. Cârligele sunt de două feluri

  1. Acțiuni : Aceste tipuri de cârlige vă permit să executați cod personalizat ori de câte ori sunt declanșate.
  2. Filtre : Filter Hooks vă permit să manipulați și să returnați o valoare (de exemplu, un preț al unui produs) pe măsură ce aceasta este trecută prin anumite funcții.

WooCommerce este un plugin WordPress care a fost, de asemenea, creat folosind Acțiuni și cârlige, cu toate acestea, fiecare plugin își poate crea propriile cârlige și filtru pe care alți dezvoltatori de plugin-uri le pot folosi pentru a extinde și mai mult funcționalitatea pluginului.

WooCommerce Hooks

Acum, în acest tutorial, vom explica despre diferitele cârlige WooCommerce, vă vom oferi și exemple vizuale, precum și exemple de cod. Inițial, codul nostru de plugin arată ca

 <?php /** * Plugin Name: CyberPanel * Plugin URI: https://cyberpanel.net * Description: CyberPanel Tutorial * Version: 1.0.0 * Requires at least: 5.2 * Requires PHP: 7.1 * Author: Usman Nasir * Author URI: https://cyberpanel.net * License: GPL v2 or later * License URI: https://www.gnu.org/licenses/gpl-2.0.html */ if (!defined('WPINC')) { die("Please don't run via command line."); }

Pe măsură ce continuăm cu tutorialul, vom continua să adăugăm mai mult cod la acest fișier.

Produs WooCommerce Hooks

Vom începe mai întâi cu cârlige pe care le puteți folosi pe paginile de produse, mai târziu vă vom oferi un exemplu de cod despre cum să utilizați woocommerce_before_single_product pentru a afișa ceva deasupra produsului.

Cârlige afișate în partea de sus și de jos a paginii de produs

  • woocommerce_before_main_content
  • woocommerce_after_main_content
cârlige woocommerce

Cârlige afișate deasupra și sub o descriere a produsului

  • woocommerce_before_single_product_summary
  • woocommerce_after_single_product_summary

Cârlige afișate în partea de sus și de jos a paginii de produs

  • woocommerce_before_single_product
  • woocommerce_after_single_product

Cârlige care sunt afișate în descrierea scurtă a produsului

  • woocommerce_single_product_summary
  • woocommerce_product_meta_start
  • woocommerce_product_meta_end
  • woocommerce_share

Cârlige afișate în comentarii

  • woocommerce_review_before
  • woocommerce_review_before_comment_meta
  • woocommerce_review_meta
  • woocommerce_review_before_comment_text
  • woocommerce_review_comment_text
  • woocommerce_review_after_comment_text

woocommerce_before_single_product

Acum să presupunem că doriți să afișați ceva în partea de sus a paginii cu un singur produs, puteți utiliza WooCommerce Hooks numite woocommerce_before_single_product , codul nostru pentru aceasta arăta astfel:

 add_action( 'woocommerce_before_single_product', 'woocommerce_output_all_notices_custom', 10 ); function woocommerce_output_all_notices_custom() { echo "hello world"; }

Acum puteți vedea în imaginea de mai jos că Hello World este imprimată deasupra imaginii produsului

În mod similar, puteți utiliza alte cârlige din tabelul de mai jos pentru a adăuga informații pe pagina produsului. Aspectul actual al fișierului nostru de plugin:

 <?php /** * Plugin Name: CyberPanel * Plugin URI: https://cyberwp.cloud * Description: Manage multiple CyberPanel installations via WordPress. * Version: 1.0.0 * Requires at least: 5.2 * Requires PHP: 7.1 * Author: Usman Nasir * Author URI: https://cyberwp.cloud * License: GPL v2 or later * License URI: https://www.gnu.org/licenses/gpl-2.0.html */ if (!defined('WPINC')) { die("Please don't run via command line."); } add_action( 'woocommerce_before_single_product', 'woocommerce_output_all_notices_custom', 10 ); function woocommerce_output_all_notices_custom() { echo "hello world"; }

Coș WooCommerce Hooks

Acum, haideți să vedem toate cârligele folosite pe pagina coșului, împărțite în trei categorii pentru confortul dvs.

Cârlige afișate înaintea listei de produse din coș

  • woocommerce_before_cart
  • woocommerce_before_cart_table
  • woocommerce_before_cart_contents
  • woocommerce_cart_contents
  • woocommerce_after_cart_contents

Cârlige afișate după lista de produse din coș

  • woocommerce_cart_coupon
  • woocommerce_cart_actions
  • woocommerce_after_cart_table
  • woocommerce_cart_colaterals
  • woocommerce_before_cart_totals

Cârlige afișate la sfârșitul unei comenzi

  • 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

Și dacă nu există produse în coș, se va folosi următorul cârlig

woocommerce_cart_is_empty

woocommerce_before_cart

Să vedem cum putem folosi woocommerce_before_cart hook pentru a afișa ceva înainte de tabelul coșului

Și fragmentul de cod pentru acesta este

 add_action( 'woocommerce_before_cart', 'woocommerce_before_cart_custom', 10, 0 ); function woocommerce_before_cart_custom() { echo "before cart content"; }

Și codul final va arăta așa

 <?php /** * Plugin Name: CyberPanel * Plugin URI: https://cyberpanel.net * Description: CyberPanel Tutorial * Version: 1.0.0 * Requires at least: 5.2 * Requires PHP: 7.1 * Author: Usman Nasir * Author URI: https://cyberpanel.net * License: GPL v2 or later * License URI: https://www.gnu.org/licenses/gpl-2.0.html */ if (!defined('WPINC')) { die("Please don't run via command line."); } add_action( 'woocommerce_before_single_product', 'woocommerce_output_all_notices_custom', 10 ); function woocommerce_output_all_notices_custom() { echo "hello world"; } add_action( 'woocommerce_before_cart', 'woocommerce_before_cart_custom', 10, 0 ); function woocommerce_before_cart_custom() { echo "before cart content"; }

În mod similar, puteți utiliza alte cârlige în codul dvs. și puteți face aproape orice cu codul dvs.

Finalizare - WooCommerce Hooks

Pagina de checkout este o pagină foarte importantă și funcțională într-un magazin WooCommerce. Mai jos sunt menționate mai multe categorii de cârlige utilizate pe paginile de finalizare a achiziției.

Cârlige utilizate înainte de forma informațiilor de contact ale utilizatorului

  • woocommerce_before_checkout_form
  • woocommerce_checkout_before_customer_details
  • woocommerce_checkout_billing
  • woocommerce_before_checkout_billing_form

Cârlige utilizate pentru setarea de marcare a detaliilor de facturare

  • woocommerce_after_checkout_billing_form
  • woocommerce_checkout_shipping
  • woocommerce_before_order_notes
  • woocommerce_after_order_notes

Cârlige folosite înainte de rezumatul produsului în ordine

  • 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_before_order_total
  • woocommerce_review_order_after_order_total

Cârlige afișate mai jos formularul de comandă

  • woocommerce_checkout_order_review
  • woocommerce_review_order_before_payment
  • woocommerce_review_order_before_submit
  • woocommerce_review_order_after_submit
  • woocommerce_review_order_after_payment
  • woocommerce_after_checkout_form

Cârlige de categorie WooCommerce

Afișarea titlului categoriei

woocommerce_archive_description

woocommerce_shop_loop

Este afișat înaintea cardului de produs din listă.

woocommerce_before_shop_loop

Este afișat deasupra listei de produse din categorie.

woocommerce_after_shop_loop

Este afișat sub lista de produse din categorie.

woocommerce_after_shop_loop_item

Este afișat la sfârșitul fiecărei descrieri a cardului de produs.

Cârlige care marchează suplimentar cardul de produs în listă.

  • woocommerce_after_shop_loop_item_title
  • woocommerce_shop_loop_item_title
  • woocommerce_before_shop_loop_item_title

Concluzie

Am făcut tot posibilul pentru a vă oferi o reprezentare vizuală a aproape tuturor cârligelor de import pe care le puteți folosi pentru a vă extinde magazinul WooCommerce.

În afară de asta, am oferit două exemple practice de cod pentru a arăta cât de ușor este să folosești acele cârlige în codul pluginului tău. Puteți utiliza cu ușurință aceste cârlige WooCommerce pentru a adăuga chiar și câmpuri de finalizare a comenzii sau pentru a adăuga casete de introducere pentru a colecta mai multe informații de la utilizator în timpul procesului de comandă.

Există posibilități nelimitate la îndemână, dacă mai aveți întrebări, nu ezitați să le întrebați în caseta de comentarii de mai jos.