Personaliza la página de tu carrito
La página del carrito aparece automáticamente en el sitio web de tu tienda en línea una vez que la activas. En esta página, los visitantes pueden seleccionar un método de pago, una opción de entrega y otros detalles al realizar un pedido.
En la configuración del widget Carrito, puedes personalizar el estilo de la tarjeta de producto y del ícono del carrito, activar un minicarrito, añadir métodos de pago disponibles y más información, y conectar herramientas de análisis.
También puedes añadir otros elementos a la página del carrito y ajustar su estilo para adaptarlo a la identidad visual y las necesidades de tu marca. Por ejemplo, puedes añadir un menú superior, un pie de página o recomendaciones de productos relacionados.
Hablemos de cómo personalizar el estilo del widget Carrito y sus elementos, y configurar un minicarrito.
Ve a la lista de páginas del sitio web y selecciona Editar en el menú situado junto a la página del Carrito. También puedes acceder a la página del carrito desde la lista de páginas del creador.
Haz clic en el widget y, en el panel de edición del elemento, selecciona el elemento que deseas personalizar.
Personaliza la apariencia de tu carrito
En la sección Estilo de carrito, haz clic en el elemento que deseas actualizar.
Carrito
En la sección Configuración del carrito, puedes personalizar el estilo del elemento en la tarjeta del producto añadido:
| Tamaño de la vista previa | Cambia el tamaño de la vista previa de tu producto. Selecciona S, M o L. |
| Separador | Añade espacio entre las vistas previas de los productos. Elige un tamaño, estilo y color. |
| Tipografía | Cambia el tamaño del estilo de texto en las vistas previas de los productos. Selecciona un tamaño de texto, formato y color para el nombre del producto, la opción, el precio y el importe total. |
| Botón de eliminar producto | Cambia el ícono para eliminar productos del carrito. Selecciona un color para el ícono y otro para el fondo. Si añades un color, el ícono será circular. |
| Contador de productos | Cambia el estilo del contador donde los usuarios pueden seleccionar cuántos artículos añadir a su carrito. Selecciona un estilo de campo, color, redondeo y tamaño. |
Ícono del carrito
En la Configuración de los íconos del carrito, puedes establecer los estilos de los íconos que aparecerán en todas las páginas de tu sitio web. En Apariencia, selecciona un estilo de ícono.
| Flotante | El ícono del carrito se fijará en la esquina derecha de la pantalla y permanecerá en su lugar a medida que los usuarios se desplacen. |
| En el encabezado | El ícono del carrito se incrustará en el encabezado. |
Selecciona la forma del ícono, los colores de los elementos, el redondeo y el tamaño.
Utiliza el modo de vista previa o visita tu sitio web publicado para ver cómo aparece el ícono del carrito.
Configura un minicarrito
Un minicarrito es una ventana emergente compacta con los productos que un cliente ha añadido al carrito. Aparece junto al ícono del carrito cuando un cliente añade un producto o hace clic en el ícono.
En el minicarrito, los clientes pueden ver los productos añadidos, cambiar sus cantidades o eliminarlos y consultar el total del pedido sin salir de la página.
Por ejemplo, los clientes de una tienda de electrónica pueden añadir un teclado y seguir buscando un mouse compatible en la misma página.
Activa el minicarrito
Para mostrar el minicarrito en tu sitio web, ve a Sitios web, selecciona tu sitio y haz clic en Editar junto a la página Carrito. En el creador de sitios web, haz clic en el widget Carrito.
En el panel de edición del elemento, activa la opción Minicarrito. Cuando conectas una tienda en línea, esta opción se activa automáticamente.
Cuando la opción está activada, el ícono del carrito abre el minicarrito en lugar de la página del carrito.
Si la opción Redirigir automáticamente al carrito después de añadir un producto está seleccionada en la configuración de tu tienda en línea, los clientes irán directamente a la página del carrito después de añadir un producto, incluso cuando el minicarrito esté activado. Para mostrar el minicarrito, deselecciona esta opción.
Personaliza el estilo del minicarrito
Para adaptar el minicarrito al diseño de tu sitio web, cambia sus colores y el redondeo de sus esquinas. El minicarrito utiliza los estilos de texto establecidos en Configuración del carrito.
Cuando la opción Minicarrito esté activada, en la sección Estilo de carrito, haz clic en Configuración del minicarrito. Aparecerá una vista previa del minicarrito junto a la configuración.
Para personalizar la ventana del minicarrito, utiliza las siguientes opciones:
| Fondo de la ventana modal | Establece el color de fondo de la ventana del minicarrito. |
| Redondeo | Redondea las esquinas de la ventana del minicarrito. Ingresa un valor en píxeles. |
| Color del separador | Establece el color de las líneas que separan el título, los productos y el total. |
En la sección Tipografía, establece los siguientes colores de texto:
| Color del texto | Establece el color del título, los nombres de los productos y otros textos. |
| Color del precio | Establece el color de los precios de los productos y del total. |
| Color del precio anterior | Establece el color de los precios anteriores, que aparecen tachados. |
En la sección Botón de eliminar producto, establece los siguientes colores para el ícono que elimina un producto:
| Color del ícono | Establece el color del ícono de eliminación. |
| Color de fondo | Establece el color del círculo detrás del ícono de eliminación. |
En la sección Contador de productos del carrito, personaliza el campo de cantidad con las siguientes opciones:
| Color del texto | Establece el color del texto del contador. |
| Color de fondo | Establece el color de relleno del contador. |
| Color del borde | Establece el color del contorno del contador. |
| Redondeo | Redondea las esquinas del contador. Ingresa un valor en píxeles. |
Para aplicar los cambios, haz clic en Guardar.
Cambia el botón del minicarrito
El botón del minicarrito lleva a los clientes a la página del carrito, donde completan el formulario de pedido y pagan. De forma predeterminada, el botón muestra el texto Finalizar compra.
Para cambiar el botón, haz clic en el ícono del lápiz de la sección Botón del minicarrito.
En el campo Texto, ingresa el texto del botón. Este campo es obligatorio.
En el campo Estilo, selecciona Primario, Secundario o Personalizado, y selecciona un tamaño de botón.
También puedes cambiar el ancho del botón, añadir un ícono o activar las opciones Efecto adicional y Sombra.
Para aplicar los cambios, haz clic en Guardar.
Más información: Configura un botón en tu sitio web.
Visualiza el minicarrito en tu sitio web
Para ver el minicarrito con los estilos y el texto del botón que configuraste, publica tu sitio web. Después, añade un producto al carrito o haz clic en el ícono del carrito.
Para cambiar la cantidad de un producto, los clientes hacen clic en − o +, o ingresan un número en el contador. Los productos digitales no tienen contador.
Los clientes pueden hacer clic en la imagen o el nombre de un producto para volver a la página donde lo añadieron.
Para cerrar el minicarrito, los clientes hacen clic en el ícono × junto al título o en cualquier lugar fuera de la ventana.
Personaliza tu formulario de pedido
Especifica un método de pago
Para añadir un nuevo método de pago, haz clic en Añadir un método de pago. Para editar un método de pago existente, haz clic en el ícono del lápiz que se encuentra junto a él.
Elige el sistema de pago que usarás para aceptar pagos. Si aceptas pagos a través de varios métodos, puedes agregar uno adicional.
Es necesario añadir métodos de pago que utilicen la misma moneda que tu tienda. Si las monedas no coinciden, el importe del pago será incorrecto.
Para obtener más información sobre cómo conectar varios métodos de pago, consulta la sección Aceptar pagos.
También puedes asignar un nombre personalizado a tu método de pago. Los visitantes del sitio web verán este nombre al finalizar la compra. En la sección Nombre del método de pago, introduce el nombre que deseas que se muestre.
También puedes redirigir a los usuarios a una página específica después de la confirmación del pago. Para ello, desplázate hacia abajo y selecciona la sección Configuración adicional del formulario. Selecciona o introduce el enlace a la página que deberá aparecer después de la confirmación del pago.
Durante el proceso de pago, el sistema comprueba si los productos de tu CRM están en stock. Si un producto está agotado o no hay suficientes unidades en stock, tu cliente verá un mensaje indicando que no se puede completar la compra. La cantidad de productos y el precio total de su pedido se actualizarán en función de tu stock actual.
Añade campos
De forma predeterminada, tu formulario de pedido ya incluye el campo Email, que el sistema utiliza para identificar a los clientes en todas las herramientas de SendPulse. También puedes añadir tus propios campos para recopilar más información, incluidos nombres, direcciones y números de teléfono.
Haz clic en Añadir en la sección Campos del formulario. Para configurar un campo, haz clic en el ícono del lápiz junto a él. Selecciona un tipo de campo, introduce su nombre y marcador de posición, y vincúlalo a los campos del CRM. También puedes mover y eliminar campos.
Consulta también: Qué tipos de campos personalizados puedes configurar.
Integra con otras herramientas
Para integrar el formulario con el CRM, introduce un nombre para el trato, selecciona una canalización y establece la etapa en la que se guardará el trato. Cuando un visitante de tu sitio web realice un pedido, se crearán un trato y un contacto en el CRM con los datos que haya ingresado en los campos del carrito. La lista de productos que pidió se añadirá a los comentarios del trato.
Para guardar contactos con etiquetas específicas del CRM, activa la opción Asignar etiqueta a un contacto y selecciona las etiquetas. La lista incluye todas las etiquetas creadas en todas las canalizaciones y pestañas del CRM.
También puedes integrar el formulario con la sección Email. Activa la opción Añadir a una lista de correo y selecciona una lista de correo.
Selecciona una opción de entrega
Una vez que añadas productos físicos a la configuración de tu tienda en línea, aparecerán automáticamente las opciones de entrega disponibles.
Si los usuarios solo añaden productos digitales a sus carritos, no se mostrará ninguna opción de entrega.
Personaliza el botón de pago
Para personalizar el botón Pago, haz clic en el ícono del lápiz de la sección Botón. En el campo Texto, introduce el texto del botón y, en el campo Estilo, selecciona el tamaño y el estilo del botón. Primario y Secundario siguen el estilo general de tu página, mientras que Personalizado te permite establecer un color de texto, un color de fondo, un borde y efectos hover.
Añade la página posterior al pago
Puedes redirigir a los usuarios a una página específica después de la confirmación del pago. Usa las páginas posteriores al pago para indicarles a los clientes cuáles son los siguientes pasos.
Para añadir una página, desplázate hacia abajo y selecciona la sección Configuración adicional del formulario. Añade el enlace a la página a la que se redirigirá a los usuarios después de realizar el pago correctamente. También puedes seleccionar una página del sitio web en el menú o añadir un enlace a un chatbot.
Más información: Crea una página después de un pago exitoso.
Añade un código promocional
Puedes permitir a los usuarios aplicar códigos promocionales del CRM al finalizar la compra, lo que te ayuda a ofrecer descuentos o bonificaciones.
Ve a Configuración adicional del formulario, activa la opción Añadir un campo para el código promocional y decide qué códigos promocionales se pueden utilizar.
En el campo Título, escribe el texto que aparecerá encima del campo, como "Aplicar un código promocional". En el campo Marcador de posición, escribe el texto de ayuda que aparecerá dentro del campo. En el campo Código promocional, elige uno o varios códigos promocionales.
Una vez que publiques tu sitio web, el formulario de pago incluirá un campo donde los usuarios podrán aplicar códigos promocionales. Cuando ingresen un código promocional, el sistema lo validará automáticamente. Si es válido, el descuento se aplicará al total del pedido.
Configura los datos analíticos
Puedes transferir los objetivos de tu formulario a los eventos de Google Analytics y Facebook Pixel. Haz clic en Configuración de Analytics.
Activa la opción Transferir el objetivo a Google Analytics o Transferir el objetivo a Facebook Pixel.
Para completar la transferencia de datos, añade el código de Facebook Pixel y Google Analytics a la configuración de tu sitio web. Más información: Cómo conectar Google Analytics a tu sitio y Cómo conectar Facebook Pixel a tu sitio.
Una vez que hayas terminado de editar la página del carrito, haz clic en Publicar.
Última actualización: 02.05.2025
o