Cómo personalizar la página de pago de WooCommerce con Elementor y ShopEngine

01_Banner_work_Image

El negocio del comercio electrónico es ahora más competitivo que nunca. La competencia está creciendo porque aparecen nuevos sitios con regularidad. Muchos emprendedores de comercio electrónico tienen dificultades con las ventas. ¿Tú también?

Un estudio reciente dice que hoy en día es normal que se abandonen 60% de carritos. Entonces, lleva al cliente potencial a su sitio de WordPress, le permite elegir el producto, agregar una página de carrito y luego obtiene el rebote.

No obtener ventas después de que alguien da el paso de agregar productos a su carrito es realmente desalentador. Sin embargo, puede solucionar este problema si personaliza la página de pago de WooCommerce.

Entonces, la pregunta es cómo personalizar o editar la página de pago de WooCommerce. Aquí aprenderá cómo personalizar la página de pago de WooCommerce con la plantilla de pago de WooCommerce.

¿Por qué personalizar la página de pago de WooCommerce?

La página de pago de WooCommerce hace un trabajo adecuado al proporcionar un proceso de pago fluido para los clientes. Sin embargo, si desea brindarle a su usuario una experiencia de compra más enriquecedora y así aumentar su tasa de conversión, entonces debería considerar personalizar la página de pago de WooCommerce. 

Dependiendo de su tipo de negocio, debe editar la página de pago de WooCommerce para garantizar una experiencia de compra fluida para sus clientes. Por ejemplo, si solo vende productos digitales, no es necesario recopilar direcciones.

Hablando de recopilar direcciones, la página de pago es el mejor lugar para recopilar datos de usuario que puede utilizar para mejorar la experiencia de sus clientes y también utilizarlos en su futura estrategia de marketing para aumentar las ventas.

Además de agregar, eliminar o editar los campos del formulario de la página de pago, también puede agregar una nueva sección para resaltar su oferta especial o PVU (propuesta de venta única) de su negocio o testimonio, etc. Todo esto puede ayudarlo a ganar clientes. confiar y conseguir que más clientes completen sus pedidos.

Espero que ahora se dé cuenta de la importancia de una página de pago personalizada para su sitio web de WordPress y de por qué debería personalizar la página de pago de WooCommerce. 

Si se pregunta cómo personalizar la página de pago de WooCommerce, pase a la siguiente sección para obtener respuestas.

Cómo personalizar la página de pago de WooCommerce en Elementor

Cuando todas las demás empresas ofrecen el complemento/complemento externo para la página de pago, Wpmet trae un creador de páginas de pago incorporado de arrastrar y soltar. Con ShopEngine, puedes crear tu propia página de pago con 3 sencillos pasos. Y también puedes editar tu página de pago de WooCommerce.

Además de crear y personalizar la página de pago de WooCommerce, puede crear y personalizar muchas otras páginas de WooCommerce, incluida la página de producto único de WooCommerce, la página de carrito y la página de archivo.

¡No te preocupes! No tendrás que escribir ningún código. Aquí voy a mostrar el proceso de personalización de la plantilla de la página de pago de WooCommerce.

Antes de comenzar con el diseño de la página de pago de WooCommerce, es mejor que hagas un boceto de tu próxima página de pago. Te ahorrará tiempo y evitará confusiones al diseñar la página.

Instalar Elementor y ShopEngine

Instale Elementor y ShopEngine para aprender a editar la página de pago de WooCommerce

El primer paso es instalar Elementor y ShopEngine en su sitio WordPress wooCommerce. Ambos complementos son gratuitos y están disponibles en el directorio de WordPress. Después de instalar el complemento, finalice la configuración básica.

Clave de instalación: wp-admin -> Complementos -> Agregar nuevo -> ShopEngine/Elementor -> Instalar ahora -> Activar

Crear una plantilla de página de pago

  • Haga clic en Plantilla desde el TiendaMotor menú de la barra lateral. 
  • Haga clic en "Agregar nuevo”Y se mostrará una ventana emergente en su panel de control. 
  • Establezca el nombre y "Verificar" desde el "Tipo" desplegable.
  • Establezca el valor predeterminado como "” y guarda la página.

Tecla de configuración: vaya a ShopEngine -> Plantillas -> Agregar nuevo

Se agregará una nueva página de pago a la lista de páginas. Edite la página con Elementor. Consulte la documentación para obtener más detalles sobre cómo cree una plantilla de página de pago con ShopEngine.

Puede cree campos personalizados y cree una página de pago estándar de WooCommerce para su sitio web. No se requiere código personalizado ni CSS personalizado para la plantilla de página de pago de WooCommerce. Con ShopEngine, puede modificar la página de pago de WooCommerce con un simple "arrastrar y soltar".

Puede buscar el elemento y soltarlo en la página para personalizar la página de pago de WooCommerce. Entonces guárdalo. Además, puedes explorarlos manualmente. Puede elegir cualquier diseño de Elementor según su elección, agregar widgets y guardarlo.

Elementos de pago para la página de pago personalizada

Cree una página de pago personalizada de WooCommerce con Elementor usando Shopengine
  • Formulario de cupón- Es una forma de ofrecer su cupón.
  • Pago de caja- El formulario es para configurar el método de pago del pago. Este formulario contiene detalles de facturación para personalizar la página de pago.
  • Pago: Revise su orden- Con este formulario, es posible recibir opiniones de clientes.
  • Formulario de pago adicional (Personalizar los campos de pago) es para tomar información adicional como diferentes direcciones de facturación o información externa.
  • Formulario de pago y facturación Es un formulario para tomar la información de facturación del cliente. 
  • Iniciar sesión en el formulario de pago El formulario es para que el cliente inicie sesión durante el momento del pedido.
  • Envío del formulario de pago Es un formulario para obtener la dirección de envío del cliente. 
  • Método de envío- El método de envío es para saber qué método de envío se aplicará.
  • Formulario Adicional- Estos campos personalizados sirven para tomar información adicional, como diferentes direcciones de facturación o información externa.
  • Envío de formularios- El envío del formulario sirve para obtener la información de envío del cliente.

¡Ahora ya sabes qué elemento sirve para qué! Y también tienes el boceto de tu página de pago. Por lo tanto, diseñe su página de pago personalizada de WooCommerce con las funciones de arrastrar y soltar de ShopEngine.

Nota: En caso de que no desee crear su página de pago desde cero, puede use las plantillas de página de pago prediseñadas de ShopEngine y edite diferentes secciones para personalizarlas. Para una comprensión más clara del proceso, mire el vídeo a continuación:

Personalice la página de pago de WooCommerce usando ShopEngine y Elementor

Con ShopEngine también puedes crear una página de pago de varios pasos en WooCommerce.
Consulta todo el proceso
👉👉 Cómo agregar WooCommerce en varios pasos Pagar en 5 pasos

Cómo personalizar la página de pago de WooCommerce en Gutenberg

El proceso de agregar y personalizar la página de pago de WooCommerce es bastante similar en Gutenberg. Primero, debes agregar una plantilla de página de pago y luego editarla en consecuencia con Gutenberg. Para eso, navega a ShopEngine >> Plantillas de creación y presiona "Agregar nuevo" botón.

Esto abrirá una plantilla en el lado derecho. Allí deberá completar los campos Campos de nombre y tipo. También, Habilitar el interruptor Activo y Seleccione una muestra diseño. Después de eso, Pulsa “Editar con Gutenberg” botón.

Ahora, accederá al editor de Gutenberg, donde podrá crear y personalizar la página de pago aprovechando los bloques de pago de ShopEngine. Para acceder a esos bloques, Presione el icono “+” y desplazarse hacia abajo hasta que te encuentres con los bloques de pago.

Después de encontrar los bloques de pago, añadir bloques requeridos como formulario de facturación, formulario de cupón, revisión de pedido, pago, etc. según sus necesidades. Además, puede encontrar la opción de personalizar todos estos bloques en el lado derecho después de seleccionar cada bloque.

Editar la página de pago de WooCommerce usando el complemento o generador de ShopEngine

Finalmente, presiona el botón “Guardar” Botón para activar tu página de pago en tu tienda WooCommerce.

Consejos adicionales Para mejorar la página de pago de WooCommerce

Siempre hay algunas cosas secretas que aumentan las ventas. Traemos todos los consejos secretos aquí en público. Aplicar los siguientes consejos después de personalizar la plantilla de la página de pago podría aumentar sus ventas mucho más de lo esperado.

Simplifique el proceso de pago

Un estudio reciente muestra que 28% de los principales sitios de comercio electrónico tienen 5 pasos en la página de pago. Puede mantenerlo igual o tener menos pasos en su sitio de comercio electrónico.

Mantenga su página de pago simple y obvia. Agrega un indicador visual para que tus clientes puedan ver el total de pasos. Demasiados pasos pueden dañar tu tasa de progreso.

Ofrezca múltiples opciones de pago

Hubo un tiempo en el que un sitio de comercio electrónico contenía un único método de pago. Provocó una alta tasa de abandono. Especialmente cuando un sitio utiliza una pasarela de pago local.

Para resolver el problema del alto abandono, las marcas ahora ofrecen múltiples formas de pago. Las billeteras electrónicas y las opciones de pago electrónico lo hacen más fácil que nunca. En esta era, si no ofrece múltiples opciones de pago, perderá muchos clientes.

Mostrar progreso de pago

Como ya se mencionó, la página de pago debe tener alrededor de 5 pasos. Ahora, es mejor mostrar los pasos como progreso o finalización del paso. Su cliente debe saber cuántos pasos quedan para finalizar el pago.

Es mejor agregar los pasos de progreso con el título. Ayudará a los usuarios a comprender la próxima información.

Comparte la cantidad de ahorro

Esta es una gran idea para aumentar sus ventas. Muestre el ahorro total a su cliente. Digamos que están guardando x% del pedido. ¿Quién no quiere ahorrar? Entonces, mantendrá su atención.

También puede mostrar el próximo punto de guardado. Por ejemplo, puede hacer ping o mostrar un aviso con "Gasta 100 y ahorra x% más". Esto seguramente ayudará a conseguir más ventas.

Mantenga al cliente en la misma página durante el pago

Si lleva a su cliente a otra página para recibir el pago, su cliente a menudo saldrá del sitio. No volverán para realizar compras adicionales. Será difícil aumentar y disminuir las ventas al cliente.

Por lo tanto, mantenga a su cliente en la misma página mientras crea un pago. Puedes integrar una pasarela de pago hoy en día. Mejora la experiencia del cliente y disminuye los problemas abandonados.

Mostrar testimonio

Agregar algunos testimonios llamativos a la página de pago aumenta la confianza de los clientes. Pero asegúrese de no agregar demasiados testimonios genéricos en la página.

Implementar puntos y recompensas

Otra excelente manera de reducir el problema del abandono es introducir puntos y recompensas. Si permite que sus clientes canjeen puntos por realizar compras o por descuentos adicionales, los motivará a realizar el pago.

Los clientes solo pueden ganar puntos al finalizar la compra si cumplen con el requisito del total del pedido mencionado.

Pruebe las ventas adicionales y cruzadas

Según Amazon, las ventas cruzadas y adicionales aportaron alrededor de 35% de sus ingresos. Las recomendaciones de productos son responsables de un promedio de 10-30% de ingresos del sitio de comercio electrónico según el analista de Forrester Research.

Las ventas adicionales y cruzadas de la página de pago son algunas de las mejores opciones para cualquier sitio de comercio electrónico. Muestre su producto relacionado con el cliente con un descuento y puntos de recompensa.

Utilice un diseño optimizado para dispositivos móviles

Cuando se trata de SEO, Google y todos los demás motores de búsqueda se preocupan por el diseño optimizado para dispositivos móviles. Tiene un alto impacto en el ranking de búsqueda. Bueno, si su página de pago es menos compatible con dispositivos móviles, tiene muchas posibilidades de perder muchos clientes.

Diseñe una página de pago responsiva y compatible con dispositivos móviles para su sitio de comercio electrónico. Puede utilizar ShopEngine, un complemento de personalización de la página de pago de WooCommerce para diseñar la página de pago optimizada para dispositivos móviles.

Habilitar ahorro de contenido del carrito

El sitio debe tener opciones para guardar el "contenido del carrito" limpias y sencillas. No debe solicitar ningún registro, inicio de sesión o entrada de datos futuros a los usuarios. 

¿Qué más tiene para ofrecer ShopEngine?

Junto con los widgets, ShopEngine también proporciona muchos módulos útiles para agregar hacer un pedido, modo vacaciones, venta express, etc. Siempre puedes consultar todos estos módulos en detalle más adelante. Además, para cada módulo, obtendrás diseños listos como la plantilla de página de pago de WooCommerce.

Pero el módulo que quiero resaltar es el de Campos de pago adicionales. Con este módulo, puede agregar fácilmente campos personalizados a cualquiera de los formularios de su página de pago de WooCommerce y personalizar la página de pago de WooCommerce según su negocio y sus requisitos.

Relacionado: Cómo agregar un campo de pago personalizado avanzado de WooCommerce


También puedes ver lo fácil que es agregar un campo personalizado en el video a continuación:

Agregue un campo personalizado a la página de pago de WooCommerce

Llamada final

El pago es el paso final para que un cliente potencial compre algo. Por lo tanto, la página de pago es el lugar donde debes tener especial cuidado. Y ShopEngine es el mejor complemento de personalización de la página de pago de WooCommerce que encontrará para personalizar o modificar la página de pago de WooCommerce y hacerla más especial.

Además, ahora sabes cómo personalizar o editar la página de pago de WooCommerce de forma gratuita. Entonces, ¿estás listo para personalizar o editar la página de pago de WooCommerce con ShopEngine?


Comentarios

  1. Avatar de Raaz

    Este es uno de los excelentes complementos para crear una página de pago. No sé dónde cometí un error, pero después del proceso de pago, no fui a la página de agradecimiento.

    1. Avatar de Dipa Shaha
      Dipa Shaha

      Raaz, no podemos estar seguros de cuál es la causa del problema que enfrenta sin inspeccionar su sitio web. Le sugiero que cree un ticket con nuestro equipo de soporte y ellos le brindarán una solución. Puedes crear un ticket usando este enlace https://wpmet.com/support-ticket-form/

  2. Avatar de Arnaldo Alves Pacheco

    Si estás usando el complemento y quieres hacer algunas cosas, pero no hay muchas cosas buenas que hacer. Por ejemplo, criei no meu site algumas páginas de categorías de productos con imágenes y contador de número de productos, pero me falta una opción de agregar categorías de productos por orden creciente y decreciente, tive que fazer todo manualmente y perdi muito tempo fazendo isto. Poderia automáticamente en el menú de productos para definir buscar según las condiciones del widget. Esta parte no gostei muito não.
    Y esto todavía con la recepción de mexer en otras partes de mi sitio usando el complemento, medo de perder mi trabajo.

    1. Avatar de Hasib

      Por favor, verifique una versión actualizada del complemento. ¡No tendrás problemas! Los complementos mencionados son muy fáciles de usar y no tienen errores técnicos.

Deja una respuesta

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