Cómo cambiar el texto Proceder al pago en WooCommerce

¿Está buscando una manera fácil de cambiar el texto de proceder al pago en su tienda WooCommerce? Has venido al lugar correcto. En esta guía, le mostraremos diferentes métodos para hacerlo.

Muchos propietarios de sitios personalizan su página de compras y páginas de productos, editan sus páginas de pago y piensan que todo su sitio está optimizado. Sin embargo, hay muchos otros detalles que puedes cambiar que te ayudarán a aumentar tus tasas de conversión y mejorar tu tienda. Ya vimos cómo cambiar el mensaje Agregar al carrito y hoy le mostraremos cómo cambiar el texto Proceder al pago en WooCommerce .

Antes de saltar a los diferentes métodos para hacerlo, entendamos mejor qué es el texto Proceder al pago y por qué debería personalizarlo.

¿Qué es el texto Proceder al pago?

De forma predeterminada, el botón de pago contiene el texto Proceder al pago :

Este texto está configurado de forma predeterminada en los archivos de plantilla de WooCommerce y la mayoría de los propietarios de tiendas no se toman el tiempo para cambiarlo. Sin embargo, considerando que este es un paso muy importante para cerrar la venta, debes optimizarlo al máximo. La buena noticia es que puede personalizar fácilmente este texto para que sea más significativo y se adapte mejor al diseño de su tienda.

Por ejemplo, puede cambiar este texto a "¡Únase a nuestro servicio ahora!" o "Pagar aquí" para un flujo de pago más simple. Todos los pequeños pasos que tome para mejorar su experiencia de pago pueden sumarse para aumentar la tasa de conversión de su sitio web.

La mayoría de los propietarios de tiendas no se toman el tiempo para personalizar el texto de proceder al pago porque implica editar los archivos de plantilla de WooCommerce . Para algunos usuarios, especialmente los principiantes, esto parece difícil o arriesgado. Sin embargo, no es necesario que lo sea. En la siguiente sección, le mostraremos diferentes métodos para cambiar el texto Proceed to Checkout con y sin código, para que pueda seguir el que mejor se adapte a sus habilidades.

Cómo cambiar el texto Proceder al pago en WooCommerce

Hay dos métodos principales para editar el texto Proceder al pago:

1. Programáticamente
2. Con complementos

Echemos un vistazo más de cerca a ambos.

1) Cómo cambiar el texto Proceder al pago usando una función de tema

Comencemos con el método programático de personalizar el texto de pago en WooCommerce agregando una función personalizada al archivo functions.php .

El proceso es bastante simple y todo lo que necesita hacer es pegar un pequeño script de código en su archivo functions.php . Antes de comenzar, le recomendamos que haga una copia de seguridad de su sitio y use un tema secundario. Además de ser más seguro, con un tema secundario, te aseguras de que si actualizas tu tema, tu personalización no se sobrescribirá con los nuevos archivos de tema. Es por eso que siempre es una buena práctica instalar un tema secundario en su sitio.

Una vez que haya hecho eso, abra su Panel de administración de WP y diríjase a Apariencia> Editor de temas . Luego, haga clic en Funciones de tema o functions.php en la barra lateral de archivos de tema a la derecha.

Ahora, use el editor para pegar el siguiente fragmento de código. El código creará una función personalizada que cambiará el texto del pago. Simplemente cambie la parte del código Checkout-Text-Here del código a cualquier cosa que desee.

 función quadlayers_woocommerce_button_proceed_to_checkout() { ?>
<a href="<?php echo esc_url( wc_get_checkout_url() ); ?>" class="botón de pago button alt wc-forward">
<?php esc_html_e( 'Pagar-Texto-Aquí', 'woocommerce' ); ?>
</a>
<?php
}

Por ejemplo, en la siguiente secuencia de comandos, usaremos el texto "Por favor, muévase a Pagar aquí", por lo que la secuencia de comandos será:

 función quadlayers_woocommerce_button_proceed_to_checkout() { ?>
<a href="<?php echo esc_url( wc_get_checkout_url() ); ?>" class="botón de pago button alt wc-forward">
<?php esc_html_e( 'Por favor, muévase al pago aquí', 'woocommerce' ); ?>
</a>
<?php
}

Ajuste el código para agregar el texto que desee, péguelo en functions.php de su tema secundario y luego haga clic en Actualizar archivo para finalizar el proceso.

La función simplemente reemplaza el texto del botón Proceder to Checkout de WooCommerce, por lo que debería funcionar independientemente del tema que esté usando o de los scripts de funciones adicionales que pueda haber habilitado.

Sin embargo, si aún no se siente cómodo editando archivos principales, puede usar un complemento dedicado en su lugar.

2) Cómo cambiar el texto Proceder al pago usando complementos

Otra alternativa para personalizar el texto Proceder al pago es usar un complemento dedicado. Para esta demostración, usaremos una herramienta simple llamada Cambiar texto de proceder al pago que hace que sea muy fácil editar el texto del pago con unos pocos clics.

Este es un complemento gratuito, por lo que es una excelente opción para aquellos que no desean usar código para cambiar el texto o desean cambiar el texto Proceder a la caja a menudo para fines de prueba y personalización.

Instalación y activación del complemento

Para instalar el complemento, simplemente abra su Panel de administración de WP y vaya a Complementos> Agregar nuevo . Use la barra de búsqueda en la parte superior derecha para buscar Change Proceed to Checkout Text , haga clic en Install en la pestaña del complemento y luego presione Activar .

Uso del complemento para cambiar el texto Proceder al pago

Para usar el complemento, vaya a Configuración> Cambiar el texto Continuar con el pago.

Para cambiar el texto de pago, todo lo que tiene que hacer es escribir el nuevo texto del botón de pago en el campo correspondiente. Digamos que queremos cambiar el texto a Move to Checkout . Luego, presione Actualizar y se guardará su cambio en el campo de texto Proceder al pago.

Ahora echa un vistazo a la interfaz y verás el resultado como se muestra a continuación:

De esta manera, puedes probar fácilmente diferentes textos y ver cuál tiene mejores tasas de conversión.

Bonificación: Cómo cambiar el mensaje Agregado al carrito

Además de personalizar el texto Proceder to Checkout, hay mucho más de lo que puede hacer para mejorar la experiencia de pago en su tienda. Por ejemplo, otra práctica recomendada es editar los mensajes de Agregar al carrito . Cuantos más pasos tome para mejorar su experiencia de pago, mejores resultados obtendrá, por lo que es una buena idea no dejar nada al azar.

Veamos cómo puede personalizar el mensaje "Agregado al carrito" .

Adición de un mensaje de agregado al carrito simple y personalización del mensaje de agregado al carrito

Para reemplazar su mensaje Agregado al carrito con un texto personalizado simple, puede agregar un fragmento de código al archivo functions.php . Para hacerlo, dirígete a Apariencia > Editor de temas en tu Panel de WordPress. Luego, abra el archivo functions.php haciendo clic en functions.php o Theme functions en la barra lateral derecha.

Ahora, puede agregar el siguiente script al editor para personalizar el mensaje Agregado al carrito dentro de la sección $message= ' ' del código. En el siguiente script, el mensaje dirá “Su producto ha sido agregado al carrito. ¡Gracias por comprar con nosotros!" .

 add_filter('wc_add_to_cart_message_html', 'quadlayers_custom_add_to_cart_message');
función quadlayers_custom_add_to_cart_message() {
$mensaje = 'Su producto ha sido agregado al carrito. ¡Gracias por comprar con nosotros!' ;
devolver $mensaje;
}

Supongamos que desea cambiarlo por algo como " Gracias por comprar nuestro producto". En ese caso, utilizará este script:

 add_filter('wc_add_to_cart_message_html', 'quadlayers_custom_add_to_cart_message');
función quadlayers_custom_add_to_cart_message() {
$mensaje = '¡Gracias por comprar nuestro producto!' ;
devolver $mensaje;
} 

Si revisa la interfaz, el mensaje se verá así:

Personalización del mensaje Agregado al carrito

Alternativamente, puede personalizar el mensaje y agregar el nombre del producto que su cliente ha agregado al carrito. Para hacer eso, use este script:

 add_filter('wc_add_to_cart_message', 'quadlayers_custom_wc_add_to_cart_message', 10, 2); 
función quadlayers_custom_wc_add_to_cart_message ($mensaje, $product_id) { 
$mensaje = sprintf(esc_html__('%s ha sido agregado a su carrito. ¡Gracias por comprar el producto!','tm-organik'), get_the_title( $product_id ) ); 
devolver $mensaje; 
} 

Presione Actualizar archivo , revise la interfaz y debería ver algo como esto:

Esto requiere personalizar el mensaje en la instrucción $message . Estos son solo algunos ejemplos, pero hay mucho más que puedes hacer. Para obtener más información al respecto, consulte nuestra guía sobre cómo personalizar los mensajes Agregar al carrito .

Alternativamente, si desea ocultar o eliminar el mensaje Agregar al carrito, también puede hacerlo agregando este código a su functions.php.

¡Simplemente pegue este script y actualice el archivo y debería haber terminado!

 add_filter('wc_add_to_cart_message_html', '__return_null');

Conclusión

En resumen, el texto Proceder al pago aparece en una etapa muy importante del proceso de compra, por lo que siempre es una buena idea personalizarlo. La mayoría de los propietarios de tiendas pasan por alto esto, por lo que puede aprovecharlo y destacarse de sus competidores.

En esta guía, le mostramos dos métodos diferentes para cambiar el texto de proceder al pago en WooCommerce:

• Mediante el uso de un gancho de WooCommerce personalizado y una función en sus archivos de tema
• Mediante el uso de un complemento dedicado

Ambos métodos hacen el trabajo, así que elija el más apropiado para usted. Si tiene algunas habilidades de codificación, puede usar el método programático. Usando un script simple, puede personalizar el texto en poco tiempo. Por otro lado, si es un principiante y no se siente cómodo editando archivos de temas, le recomendamos que use un complemento dedicado. Para esta demostración, hemos utilizado Change Proceed to Checkout Text , una herramienta gratuita que le permite editar y probar diferentes textos con unos pocos clics.

¿Qué método has probado? ¿Conoces algún otro que debamos incluir? ¡Háganos saber en los comentarios a continuación!

Finalmente, si desea obtener más información sobre cómo personalizar otros componentes de su tienda en línea, consulte otras guías:

• Cómo eliminar la pestaña de información adicional en WooCommerce
• Cómo personalizar las plantillas de WooCommerce
• Métodos para personalizar la página Mi cuenta