Todas las colecciones
Avanzado
Mostrar información del producto en la página del carrito
Mostrar información del producto en la página del carrito

Muestre a los clientes la etiqueta, proveedor, colección o tipo de producto en la página del carrito

María Banegas avatar
Escrito por María Banegas
Actualizado hace más de una semana

Al utilizar funciones como la activación condicional, es posible que desees brindarles a los clientes información adicional en la página del carrito. Puedes mostrar que productos solo están disponibles bajo ciertas condiciones.

Por ejemplo, si tienes algunos productos configurados para ser "Solo recogida", puedes resultar confuso para los clientes en la página del carrito determinar qué producto no está disponible para recogida. Esta solución agregará el texto "Solo recogida" a un producto en la página del carrito como se muestra a continuación:

Puedes editar el código y el texto para mostrar cualquier información sobre los productos, por ejemplo:

  • Qué métodos de pago están disponibles para tus productos

  • ¿En qué días o fechas están disponibles tus productos?

  • En qué ubicaciones están disponibles tus productos

  • ¿Cuánto tardan tus productos en prepararse?

Si no te siente cómodo editando código, contáctenos en [email protected] y estaremos encantados de ayudarte.


Editar el código del tema

Para mostrar el texto en la página del carrito, deberá agregar algún código a los archivos de su tema.

  1. En Canales de venta, haz clic en Tienda online.

  2. Busca el tema que deseas editar y haz clic en "..." y luego en Editar código.

  3. Localiza el archivo del carrito (por ejemplo, cart.liquid, cart-template.liquid, main-cart.liquid, etc.)

  4. Agrega el código entre las secciones relacionadas con la cantidad y el precio del artículo, o cualquier otro lugar que se ajuste a tus necesidades.

El código se puede modificar para mostrar texto basado en:


Mostrar etiquetas

Puedes modificar el código para adaptarlo a tus necesidades comerciales.

En este código de ejemplo, los clientes podrán ver qué productos están disponibles para qué método de pago mediante las etiquetas del producto.

No es necesario que el texto coincida con la etiqueta; puedes agregar cualquier texto que necesites.

  • Si el artículo está etiquetado como "Solo para recogida", el texto "Solo para recogida" se mostrará en el carrito.

{% if item.product.tags contains "Pickup Only" %}     
<p style="color:red;text-align:center;"><strong>Pickup Only</strong></p> {% endif %}
  • Si el artículo está etiquetado como "Sólo entrega", el texto "Sólo entrega" se mostrará en el carrito.

{% if item.product.tags contains "Delivery Only" %}     
<p style="color:red;text-align:center;"><strong>Delivery Only</strong</p> {% endif %}
  • Si el artículo está etiquetado como "Sólo envío", el texto "Sólo envío" se mostrará en el carrito.

{% if item.product.tags contains "Shipping Only" %}     
<p style="color:red;text-align:center;"><strong>Shipping Only</strong></p>
{% endif %}

Proveedor

Puedes modificar el código a continuación para que coincida con tu tienda.

En este código de ejemplo, los clientes podrán ver qué productos están disponibles para qué método de pago por parte del proveedor del producto.

No es necesario que el texto coincida con el proveedor; puedes agregar cualquier texto que necesites.

  • Si el proveedor es "Almacén", el texto "Sólo envío" se mostrará en el carrito.

{% for vendor in item.product.vendor %}
{% if vendor == "Warehouse" %}
<p style="color:red;text-align:left;"><strong>Shipping Only</strong></p>
{% endif %}
{% endfor %}
  • Si deseas comparar varios proveedores, puedes agregarlos en un bucle FOR.

    • Si el proveedor es "Almacén", el texto "Sólo envío" se mostrará en el carrito.

    • Si el proveedor es "Tienda", el texto "Solo recogida" se mostrará en el carrito.

{% for vendor in item.product.vendor %}
{% if vendor == "Warehouse" %}
<p style="color:red;text-align:left;"><strong>Shipping Only</strong></p>
{% endif %}

{% if vendor == "Store" %}
<p style="color:red;text-align:left;"><strong>Pickup Only</strong></p>
{% endif %}
{% endfor %}

Mostrar tipo de producto

Puedes modificar el código a continuación para que coincida con tu tienda.

En este código de ejemplo, los clientes podrán ver qué productos están disponibles para qué método de pago y tiempo de preparación por tipo de producto.

No es necesario que el texto coincida con el tipo de producto; puedes agregar cualquier texto que necesites.

  • Si el tipo de producto es "Flores", el texto "Solo recogida" se mostrará en el carrito.

{% if item.product.type == 'Flowers' %}
<p style="color:red;text-align:left;"><strong>Pickup Only</strong></p>
{% endif %}
  • Si el tipo de producto es "Panadería", el texto "Disponible después de 2 días" se mostrará en el carrito.

{% if item.product.type == 'Bakery' %}
<p style="color:red;text-align:left;"><strong>Available after 2 days</strong></p>
{% endif %}


Mostrar colección de productos

Puedes modificar el código a continuación para que coincida con tu tienda.

En este código de ejemplo, los clientes podrán ver qué productos están disponibles en qué ubicación según la colección de productos.

No es necesario que el texto coincida con la colección; puedes agregar cualquier texto que necesites.

  • Si la colección es "London ST", el texto "Disponible en London Street" se mostrará en el carrito.

{% for collection in item.product.collections %}
{% if collection.title == 'London ST' %}
<p style="color:red;text-align:left;"><strong>Available at London street</strong></p>
{% endif %}
{% endfor %}
  • Si deseas comparar colecciones, puedes agregarlas en un bucle FOR.

    • Si la colección es "London ST", el texto "Disponible en London Street" se mostrará en el carrito.

    • Si la colección es "Trafalgar SQ", el texto "Disponible en Trafalgar Square" se mostrará en el carrito.

{% for collection in item.product.collections %}
{% if collection.title == 'London ST' %}
<p style="color:red;text-align:left;"><strong>Available at London street</strong></p>
{% endif %}

{% if collection.title == 'Trafalgar SQ' %}
<p style="color:red;text-align:left;"><strong>Available at Trafalgar Square</strong></p>
{% endif %}
{% endfor %}

¿Ha quedado contestada tu pregunta?