https://tdestudiodesign.com/wp-content/plugins/whatsapp/style.css

La página de pago de WooCommerce juega un papel muy importante en el éxito de su comercio electrónico. Es una de las partes más importantes de su embudo de conversión. Esta es la página que brinda ingresos.

No importa cuántas personas visiten su sitio web, si nadie hace ninguna compra. El proceso de pago complicado es una de las principales razones para el abandono del carrito de compras.

Siempre debe buscar formas de hacer que su proceso de pago sea lo más simple posible. Si está utilizando WooCommerce como su solución de comercio electrónico, puede cambiar fácilmente el diseño de la página de pago, eliminar o cambiar el pedido de campos de pago existente.

Tabla de contenido

-link__trigger»>Agregue campos de pago personalizados (no facturación o envío)

Comprensión del bloque de pago clásico vs. de pago en WooCommerce

Al personalizar los campos de pago de WooCommerce, es esencial reconocer la diferencia entre el checkout «clásico» (también conocido como «legado») y el nuevo «bloque de pago» introducido por el editor de bloques.

El El cheque clásico es la estructura tradicional de WooCommerce y admite amplias personalizaciones a través de ganchos, filtros y Php. La mayoría de los tutoriales y fragmentos están diseñados para este método, lo que lo convierte en la opción para desarrolladores y propietarios de tiendas que buscan flexibilidad.

Por otro lado, el bloque de pago es parte de la función WooCommerce Blocks. Si bien ofrece un diseño moderno y capacidades de edición de arrastrar y soltar, su personalización es limitada en comparación con el pago clásico. Muchas personalizaciones, especialmente aquellas que requieren ajustes PHP de backend, pueden no trabajar con el pago basado en el bloque.

Antes de hacer cambios, confirme qué tipo de pago usa su tienda. Si necesita personalizaciones profundas, seguir el pago heredado podría ser la mejor opción.

Página de pago clásico de WooCommerce

Ejemplo: página de pago de WooCommerce

Por defecto, WooCommerce requiere la siguiente información de los clientes:

  • Nombre de pila
  • Apellido
  • Nombre de empresa
  • País
  • Dirección Línea 1
  • Línea de dirección 2
  • Ciudad/ciudad
  • Provincia/Condado/Distrito
  • Código postal/zip
  • Teléfono
  • Dirección de correo electrónico
  • Notas de pedido

¿Los necesitas a todos? Probablemente no.

¿Necesita agregar campos personalizados? Eso también es posible.

Vea sus opciones a continuación.

Personalización de los campos de pago

Puede personalizar sus campos de pago de WooCommerce con código personalizado o extensiones de WooCommerce.

Solo como referencia, aquí hay una lista completa de campos en la matriz pasada a wooCommerce_checkout_fields gancho de filtro. Le ayudará a mapear y comprender los fragmentos de código a continuación.

/** * Billing Checkout Fields */       billing_first_name       billing_last_name       billing_company       billing_address_1       billing_address_2       billing_city       billing_postcode       billing_country       billing_state       billing_email       billing_phone  /** * Shipping Checkout Fields */       shipping_first_name       shipping_last_name       shipping_company       shipping_address_1       shipping_address_2       shipping_city       shipping_postcode       shipping_country       shipping_state  /** * Account Checkout Fields */       account_username       account_password       account_password-2  /** * Order Checkout Fields */       order_comments 

Cada campo que se pasa a wooCommerce_checkout_fields contiene una matriz de propiedades a continuación:

  • Tipo – Tipo de campo (texto, textura, contraseña, seleccionar)
  • etiqueta – etiqueta para el campo de entrada
  • marcador de posición – marcador de posición para la entrada
  • Clase – Clase para la entrada
  • requerido – Verdadero o falso, si el campo es requerido o no
  • Borrar: verdadero o falso, aplica una solución clara al campo/etiqueta
  • Label_class – clase para el elemento de etiqueta
  • Opciones: para cuadros de selección, matriz de opciones (clave => pares de valores)

Eliminar los campos de pago

Ahora para eliminar los campos que no desea en su página de pago de WooCommerce, use este fragmento y cambie las claves de matriz en consecuencia a la lista anterior:

add_filter( 'woocommerce_checkout_fields', 'tddesign_remove_woo_checkout_fields' );   function tddesign_remove_woo_checkout_fields( $fields ) {     unset( $fields['billing']['billing_first_name'] );      return $fields; } 

Cambiar la etiqueta del campo de pago o el texto del marcador de posición

Si desea cambiar las etiquetas y el marcador de posición de los campos de pago, use este fragmento:

add_filter( 'woocommerce_checkout_fields', 'tddesign_rename_woo_checkout_fields' );   function tddesign_rename_woo_checkout_fields( $fields ) {     $fields['billing']['billing_first_name']['placeholder'] = 'New placeholder';     $fields['billing']['billing_first_name']['label'] = 'New label';     return $fields; } 

Haga que los campos de pago requeridos sean opcionales

Por defecto, se requieren ciertos campos de la página de pago. No hay forma de que un usuario pueda completar la compra sin completarla correctamente. Si desea que ese campo sea opcional y no es obligatorio, use este PHP:

add_filter( 'woocommerce_checkout_fields', 'tddesign_required_woo_checkout_fields' );   function tddesign_required_woo_checkout_fields( $fields ) {     $fields['billing']['billing_first_name']['required'] = false;     return $fields; } 

Mover o reordenar los campos de pago

Puede cambiar el orden predeterminado de campos de pago utilizando el tutorial. Por ejemplo, puede mostrar el campo de correo electrónico primero en lugar de nombre.

Agregue nuevos campos de facturación o envío

Aquí hay algunos ejemplos:

Agregue campos de pago personalizados (no facturación o envío)

Puede agregar sus propios campos de pago personalizados de WooCommerce y usar estos datos de varias maneras.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *