Más de 27 ganchos de pago de WooCommerce ilustrados
Publicado: 2022-07-02
En esta publicación, aprenderá cómo usar ganchos de pago en WooCommerce. Cíñete al final, ya que veremos los ganchos principales y te daremos ejemplos de lo que puedes hacer con ellos. Le ayudan a personalizar la página de pago para aumentar sus tasas de conversión.
Ganchos de WooCommerce
Los ganchos son funciones poderosas que le permiten modificar o agregar código sin modificar los archivos principales. Brindan mucha flexibilidad y los desarrolladores los usan para cambiar las funcionalidades predeterminadas de WooCommerce.
Debes tener en cuenta que existen dos tipos de anzuelos diferentes:
- Ganchos de acción : le permiten agregar código personalizado para realizar ciertas acciones cuando ocurre un evento.
- Ganchos de filtro : cambian el comportamiento de una variable o función existente.
Ganchos de pago de WooCommerce
Los ganchos ayudan a los desarrolladores a crear soluciones personalizadas de manera práctica y flexible. Los ganchos de pago son un tipo de varios ganchos compatibles con WooCommerce. Los ganchos de pago se pueden usar para agregar algún contenido antes de los campos de facturación, aplicar alguna lógica para aumentar el precio o limitar a los usuarios por rol, antes de la revisión del pedido o después del formulario de pago, y muchos más.
Debe tener en cuenta que los ganchos de WooCommerce funcionan exactamente como los ganchos nativos de WordPress. Antes de comenzar, recomiendo encarecidamente crear un tema secundario para que sus cambios no se pierdan.
La página de pago de WooCommerce tiene los siguientes ganchos:
1. woocommerce_before_checkout_form
El gancho woocommerce_before_checkout_form se define antes del formulario de pago. Se coloca encima del campo del cupón en la página de pago.
add_action('woocommerce_before_checkout_form', 'njengah_before_checkout_form', 10);
función njengah_before_checkout_form(){
echo '<h2>woocommerce_before_checkout_form</h2>';
} 
2. woocommerce_checkout_before_customer_detalles
El gancho woocommerce_checkout_before_customer_details se define en el formulario de pago justo antes de los detalles del cliente.
add_action('woocommerce_checkout_before_customer_details', 'njengah_checkout_before_customer_details', 10);
función njengah_checkout_before_customer_details(){
echo '<h2>woocommerce_checkout_antes_de_los_detalles del cliente</h2>';
} 
3. woocommerce_checkout_facturación
El woocommerce_checkout_billing es un nuevo enlace agregado a la página de pago. La plantilla del formulario de facturación en la página de pago se incluye con este gancho.
add_action('woocommerce_checkout_billing', 'njengah_checkout_billing');
función njengah_checkout_billing() {
echo '<h2>woocommerce_checkout_billing</h2>';
} 
4. woocommerce_before_checkout_billing_form
El enlace woocommerce_before_checkout_billing_form se define antes del inicio del formulario de facturación.
add_action('woocommerce_before_checkout_billing_form', 'njengah_before_checkout_billing_form', 10);
función njengah_before_checkout_billing_form(){
echo '<h2>woocommerce_before_checkout_billing_form</h2>';
} 
5. woocommerce_after_checkout_billing_form
El gancho woocommerce_after_checkout_billing_form se define después de completar el formulario de facturación.
add_action('woocommerce_after_checkout_billing_form', 'njengah_after_checkout_billing_form', 10);
función njengah_after_checkout_billing_form(){
echo '<h2>woocommerce_after_checkout_billing_form</h2>';
} 
6. woocommerce_before_checkout_registration_form
El gancho woocommerce_before_checkout_registration_form se define en la plantilla del formulario de facturación después del formulario de creación de la cuenta. Esto se ejecutará para los usuarios invitados.
add_action('woocommerce_before_checkout_registration_form', 'njengah_checkout_billing');
función njengah_checkout_billing() {
echo '<h2>woocommerce_before_checkout_registration_form</h2>';
} 
7. woocommerce_after_checkout_registration_form
El enlace woocommerce_after_checkout_registration_form se define en la plantilla del formulario de facturación. Esto se ejecutará para los usuarios invitados.
add_action('woocommerce_after_checkout_registration_form', 'njengah_after_checkout_registration_form');
function njengah_after_checkout_registration_form() {
echo '<h2>woocommerce_after_checkout_registration_form</h2>';
} 
8. woocommerce_checkout_envío
El enlace woocommerce_checkout_shipping se define en la plantilla del formulario de envío antes del formulario de envío.
add_action('woocommerce_checkout_shipping', 'njengah_checkout_shipping');
función njengah_checkout_shipping() {
echo '<h2>woocommerce_checkout_shipping</h2>';
} 
9. woocommerce_before_checkout_shipping_form
El enlace woocommerce_before_checkout_shipping_form se define justo antes del inicio del formulario de envío.
add_action('woocommerce_before_checkout_shipping_form', 'njengah_before_checkout_shipping_form', 10);
función njengah_before_checkout_shipping_form(){
echo '<h2>woocommerce_before_checkout_shipping_form</h2>';
} 
10. woocommerce_after_checkout_shipping_form
El enlace woocommerce_after_checkout_shipping_form se define después de completar el formulario de envío.
add_action('woocommerce_after_checkout_shipping_form', 'njengah_after_checkout_shipping_form', 10);
función njengah_after_checkout_shipping_form(){
echo '<h2>woocommerce_after_checkout_shipping_form</h2>';
} 
11. woocommerce_before_order_notas
El enlace woocommerce_before_order_notes se define antes del campo de notas del pedido en la página de pago.
add_action('woocommerce_before_order_notes', 'njengah_before_order_notes', 10);
función njengah_before_order_notes(){
echo '<h2>woocommerce_before_order_notes</h2>';
} 
12. woocommerce_after_order_notas
El enlace woocommerce_after_order_notes se define después del campo de notas del pedido en la página de pago.
add_action('woocommerce_after_order_notes', 'njengah_after_order_notes', 10);
función njengah_after_order_notes(){
echo '<h2>woocommerce_after_order_notes</h2>';
} 
13. woocommerce_checkout_después_de_los_detalles del cliente
El gancho woocommerce_checkout_after_customer_details se coloca después de completar los detalles del cliente que se encuentran después de los campos de facturación y envío.
add_action('woocommerce_checkout_after_customer_details', 'njengah_checkout_after_customer_details', 10);
función njengah_checkout_after_customer_details(){
echo '<h2>woocommerce_checkout_después_de_los_detalles_del_cliente</h2>';
} 
14. woocommerce_checkout_before_order_review_heading
El gancho woocommerce_checkout_before_order_review_heading se define en la plantilla de pago antes del encabezado de revisión del pedido que es "Su pedido". Este enlace se agregó en WooCommerce v3.6.0.
add_action('woocommerce_checkout_before_order_review_heading', 'njengah_checkout_before_order_review_heading');
función njengah_checkout_before_order_review_heading() {
echo '<h2>woocommerce_checkout_before_order_review_heading</h2>';
} 
15. woocommerce_checkout_order_review
El gancho woocommerce_checkout_order_review se define en la plantilla de pago principal. La plantilla de la tabla de revisión de pedidos se incluye con este gancho.
add_action('woocommerce_checkout_order_review', 'njengah_checkout_order_review');
función njengah_checkout_order_review() {
echo '<h2>woocommerce_checkout_order_review</h2>';
} 
16. woocommerce_checkout_before_order_review
El gancho woocommerce_checkout_before_order_review se define antes de los detalles del pedido en la página de pago.
add_action('woocommerce_checkout_before_order_review', 'njengah_checkout_before_order_review', 10);
función njengah_checkout_before_order_review(){
echo '<h2>woocommerce_checkout_before_order_review</h2>';
} 
17. woocommerce_review_order_before_cart_contents
El gancho woocommerce_review_order_before_cart_contents se define dentro del cuerpo de la tabla de pedidos antes del contenido.
add_action('woocommerce_review_order_before_cart_contents', 'njengah_review_order_before_cart_contents', 10);
función njengah_review_order_before_cart_contents(){
echo '<h2>woocommerce_review_order_before_cart_contents</h2>';
} 
18. woocommerce_review_order_after_cart_contents
El gancho woocommerce_review_order_after_cart_contents se define dentro del cuerpo de la tabla de pedidos después de todo el contenido.
add_action('woocommerce_review_order_after_cart_contents', 'njengah_review_order_after_cart_contents', 10);
función njengah_review_order_after_cart_contents(){
echo '<h2>woocommerce_review_order_after_cart_contents</h2>';
} 
19. woocommerce_review_order_before_shipping
El gancho woocommerce_review_order_before_shipping se define antes de la sección de envío en la tabla de pedidos.
add_action('woocommerce_review_order_before_shipping', 'njengah_review_order_before_shipping', 10);
función njengah_review_order_before_shipping(){
echo '<h2>woocommerce_review_order_before_shipping</h2>';
} 
20. woocommerce_review_order_after_shipping
El enlace woocommerce_review_order_after_shipping se define después de la sección de envío en la tabla de detalles del pedido.
add_action('woocommerce_review_order_after_shipping', 'njengah_review_order_after_shipping', 10);
función njengah_review_order_after_shipping(){
echo '<h2>woocommerce_review_order_after_shipping</h2>';
} 
21. woocommerce_review_order_before_order_total
El gancho woocommerce_review_order_before_order_total se define antes de la sección total y después de la sección de envío en la tabla de detalles del pedido.
add_action('woocommerce_review_order_before_order_total', 'njengah_review_order_before_order_total', 10);
función njengah_review_order_before_order_total(){
echo '<h2>woocommerce_review_order_before_order_total</h2>';
} 
22. woocommerce_review_order_after_order_total
El gancho woocommerce_review_order_after_order_total se define después de la sección total y en la tabla de detalles del pedido.
add_action('woocommerce_review_order_after_order_total', 'njengah_review_order_after_order_total', 10);
función njengah_review_order_after_order_total(){
echo '<h2>woocommerce_review_order_after_order_total</h2>';
} 
23. woocommerce_review_order_before_pago
El gancho woocommerce_review_order_before_payment se define antes de la sección de métodos de pago en la página de pago.
add_action('woocommerce_review_order_before_payment', 'njengah_review_order_before_payment', 10);
función njengah_review_order_before_payment(){
echo '<h2>woocommerce_review_order_before_payment</h2>';
} 
24. woocommerce_review_order_before_submit
El gancho woocommerce_review_order_before_submit se define antes del botón "Realizar pedido" en la página de pago.
add_action('woocommerce_review_order_before_submit', 'njengah_review_order_before_submit', 10);
función njengah_review_order_before_submit(){
echo '<h2>woocommerce_review_order_before_submit</h2>';
} 
25. woocommerce_review_order_after_submit
El enlace woocommerce_review_order_after_submit se define después del botón "Realizar pedido" en la página de pago.
add_action('woocommerce_review_order_after_submit', 'njengah_review_order_after_submit', 10);
función njengah_review_order_after_submit(){
echo '<h2>woocommerce_review_order_after_submit</h2>';
} 
26. woocommerce_review_order_after_payment
El gancho woocommerce_review_order_after_payment se define después de toda la sección de pago, incluido el botón "Realizar pedido".
add_action('woocommerce_review_order_after_payment', 'njengah_review_order_after_payment', 10);
función njengah_review_order_after_payment(){
echo '<h2>woocommerce_review_order_after_payment</h2>';
} 
27. woocommerce_checkout_after_order_review
El gancho woocommerce_checkout_after_order_review se define después de la sección de revisión del pedido en la página de pago, que incluye la tabla de detalles del pedido y la sección de pago.
add_action('woocommerce_checkout_after_order_review', 'njengah_checkout_after_order_review', 10);
función njengah_checkout_after_order_review(){
echo '<h2>woocommerce_checkout_after_order_review</h2>';
} 
28. woocommerce_after_checkout_form
El gancho woocommerce_after_checkout_form se define al final después del formulario de pago.
add_action('woocommerce_after_checkout_form', 'njengah_after_checkout_form', 10);
función njengah_after_checkout_form(){
echo '<h2>woocommerce_after_checkout_form</h2>';
} 
Conclusión
Esta publicación ilustra todos los ganchos de WooCommerce que están disponibles en la página de pago. Estos ganchos le permiten personalizar la página de pago según sus necesidades.
Si es la primera vez que utiliza ganchos, puede copiar estos scripts y pegarlos directamente en el archivo functions.php de su tema secundario. Ahora puede ser creativo y personalizar la página de pago para aumentar las tasas de conversión.
Alternativamente, puede usar complementos para personalizar esta sección si no está familiarizado con los códigos. Si necesita más personalización, considere contratar a un desarrollador de WordPress calificado.
Artículos similares
- ¿Qué es el tema de escaparate de WooCommerce? [Contestada]
- Cómo poner WooCommerce Cart y Checkout en una sola página
- Cómo agregar un campo adicional en el formulario de pago de WooCommerce
- Cómo personalizar la página de pago de la tienda
- Cómo eliminar el tema de WooCommerce Storefront de la página del carrito
- Cómo ocultar impuestos al finalizar la compra si existe un valor de campo WooCommerce
- Cómo ocultar el campo de nombre de la empresa Página de pago de WooCommerce
- Cómo quitar el botón de pago WooCommerce
- Cómo cambiar la cantidad en el proceso de pago de WooCommerce
- Cómo eliminar la página de pago de información adicional WooCommerce