Personaliza tus campañas de Shopify Email usando Liquid

Liquid es un lenguaje de programación simple y fácil de usar de Shopify y es con el que se construyen los temas de la tienda de temas de Shopify.

Puedes usar Liquid personalizado para mejorar tus mensajes de Shopify Email creando un correo electrónico completamente personalizado o agregando una sección de Liquid personalizada a una plantilla. Estas opciones te permiten introducir Liquid personalizado o HTML.

Puedes usar Liquid personalizado para mostrar recursos personalizados como imágenes lado a lado, botones personalizados, imágenes de tamaño personalizado y tamaños de secciones personalizados.

En esta página

Consideraciones

Revisa las siguientes consideraciones antes de comenzar a agregar Liquid personalizado a los mensajes de Shopify Email:

Las variables que incluyas en el código deben ser compatibles con Liquid personalizado.
Solo puedes usar un dispositivo de escritorio para crear una sección de Liquid personalizada.
La variable unsubscribe_link o unsubscribe_url es obligatoria en los correos electrónicos de Liquid personalizado. Si activaste el seguimiento de apertura, la variable open_tracking también es obligatoria. Obtén más información sobre cómo agregar variables obligatorias al correo electrónico.
El código que introduces tiene los siguientes límites: - Máximo de 50 kilobytes (KB) para secciones de Liquid personalizado. - Máximo de 500 KB para correos electrónicos de Liquid con código personalizado.

Variables de Liquid admitidas en Liquid personalizado

Puedes utilizar variables compatibles para personalizar tus mensajes de correo electrónico de Shopify con Liquid. Puedes revisar las listas de variables Liquid compatibles para los siguientes tipos de plantillas:

Variables de Liquid admitidas para todas las plantillas de correo electrónico

Puedes usar las siguientes variables para personalizar todos tus mensajes de correo electrónico de Shopify con Liquid.

Descripción de las variables Liquid compatibles con Shopify Email
Variable	Descripción
all_products	Todos los productos de tu tienda.
customer.accepts_marketing	Devuelve `true` si el cliente acepta el marketing y `false` si no lo hace.
customer.addresses	Devuelve todas las direcciones asociadas con el cliente.
customer.addresses_count	Devuelve la cantidad de direcciones asociadas con el cliente.
customer.b2b?	Devuelve `true` si el cliente es un cliente B2B y `false` si no lo es.
customer.current_location	Devuelve la sucursal de la empresa seleccionada actualmente para el cliente.
customer.default_address	Devuelve las direcciones predeterminadas del cliente.
customer.email	Muestra la dirección de correo electrónico del cliente.
customer.first_name	Devuelve el nombre del cliente.
customer.has_account	Devuelve `true` si el correo electrónico del cliente está asociado con una cuenta de cliente y `false` si no lo está.
customer.has_avatar?	Devuelve `true` si el cliente tiene un Avatar asociado a su cuenta y `false` si no lo tiene.
customer.id	Devuelve el ID del cliente.
customer.last_name	Devuelve el apellido del cliente.
customer.last_order	Devuelve el último pedido realizado por el cliente, sin incluir el pedido de prueba.
customer.name	Devuelve el apellido del cliente.
customer.orders	Devuelve todos los pedidos que realizó el cliente.
customer.orders_count	Devuelve la cantidad total de pedidos que realizó el cliente.
customer.payment_methods	Devuelve las formas de pago guardadas del cliente.
customer.phone	Devuelve el número de teléfono del cliente. El número de teléfono se completa únicamente si el cliente utilizó un número de teléfono al realizar el pago, se suscribió a las notificaciones SMS o si agregaste este dato manualmente a su cuenta de cliente.
customer.tags	Devuelve las etiquetas asociadas con el cliente.
customer.tax_exempt	Devuelve `true` si el cliente se encuentra exento del pago de impuestos y `false` si no lo está.
customer.total_spent	Devuelve el importe total que pagó el cliente por todos los pedidos de tu tienda.
email.*	Esta variable otorga acceso a las siguientes propiedades de correo electrónico: `subject` muestra la línea del asunto del correo electrónico. `preview_text` muestra el texto de vista previa del correo electrónico.
open_tracking	Esta variable brinda acceso al bloque preformateado de seguimiento de correos abiertos. Es obligatoria si creas un correo electrónico con código personalizado y activaste el seguimiento de correos abiertos.
shop.*	Esta variable brinda acceso a las siguientes propiedades de la tienda: `name` muestra el nombre de la tienda. `domain` muestra el dominio principal de la tienda. `url` muestra la URL de la tienda. `shopify_domain` muestra el dominio de Shopify. `address` muestra la dirección de la tienda, lo que permite acceder a las siguientes propiedades de dirección: `address1` `address2` `city` `país` `teléfono` `province` `Código postal`
unsubscribe_url	Esta variable otorga acceso a la URL sin procesar para darse de baja y se puede personalizar. Si creas un correo electrónico con código personalizado, debes incluir la variable `unsubscribe_url` o `unsubscribe_link`.

Variables de Liquid admitidas para los correos electrónicos de pedido abandonado

Puedes usar las siguientes variables para personalizar tus mensajes de correo electrónico de pedido abandonado de Shopify con Liquid.

La variable abandoned_checkout se llena solo si un correo electrónico es parte de una automatización de marketing de pedido abandonado. En el resto de los casos, la variable es null.

Descripción de las variables de Liquid que admite Shopify Email para navegaciones, carritos y pedidos abandonados
Variable	Descripción
abandoned_checkout.*	Esta variable otorga acceso a las siguientes propiedades de un pedido abandonado: `url` muestra la URL del pago abandonado. `line_items` muestra las primeras cinco líneas de artículo del pedido abandonado. Además, cada objeto `line_items` contiene las siguientes propiedades sobre cada producto: `componentes` `image_url` `product_title` `variant_title` `quantity` `line_items.components` muestra los componentes del pedido abandonado. Además, cada objeto de `componentes` contiene las siguientes propiedades sobre cada componente: `image_url` `quantity` `product_title` `variant_title` `remaining_products_count` muestra el número de líneas de artículos restantes, si hay más de cinco líneas de artículo en el pedido abandonado.
id (checkout ID)	Una identificación única de la pantalla de pago para uso interno.
shop	El nombre de tu tienda de Shopify.
name	El nombre del pedido abandonado, también conocido como número de pago.
total_price	Precio total del pedido (subtotal + costo de envío - descuento de envío + impuestos).
shipping_price	El precio de envío. Ejemplo: `{{ shipping_price \| money }}`
shipping_address	La dirección de envío.
billing_address	La dirección de facturación.
line_items	Una lista con todas las líneas de artículo incluidas en el pedido abandonado.
unavailable_line_items	Una lista con todas las líneas de artículo incluidas en el pedido abandonado que no están disponibles.
note	La nota que se adjunta al pedido abandonado.
landing_site	La ruta del sitio de destino que utilizó el cliente. Esta es la primera página a la que el cliente accede cuando llega a la tienda. Ejemplo: `/products/great-product?ref=my-tracking-token`
landing_site_ref	Extrae un parámetro de referencia del sitio de destino. Los parámetros de referencia pueden ser: `ref`, `source` y `r`. Si `landing_site` es `/products/great-product?ref=my-tracking-token`, entonces el `landing_site_ref` es `my-tracking-token`. Puedes efectuar una acción determinada si tu parámetro de referencia es igual a cierto valor: {% if landing_site_ref == 'my-tracking-token' %} My action... {% endif %}
referring_site	La URL de la fuente de la referencia que llevó al cliente a tu tienda. Ejemplo: `https://www.google.com/?s=great+products`
created_at	La fecha y hora en que el cliente creó el pedido que abandonó.
closed_at	La fecha y hora en que se cerró la pantalla de pago.
customer_locale	El código de idioma de dos o tres letras de la configuración regional del cliente, opcionalmente seguido por un modificador de región. Por ejemplo, en , en-CA
item_count	Una suma de todas las cantidades de los artículos.
unique_gateways	Una lista de proveedores de pago únicos disponibles en la pantalla de pago.
discount	El descuento aplicado al carrito o a una línea de artículo en el pedido abandonado.
discounts	Una lista de descuentos aplicados en la pantalla de pago.
successfully_applied_discounts	Los descuentos que se aplicaron correctamente en la pantalla de pago.
discounts_amount	El monto del descuento que aplican todos los descuentos. Ejemplo: +$5,00
discounts_savings	El monto ahorrado gracias a todos los descuentos. Ejemplo: -$5,00
buyer_accepts_marketing	Devoluciones verdadero O falso dependiendo de si el cliente aceptó el marketing durante el pedido abandonado.
subtotal_line_items	Las líneas de artículo que se usan para calcular el precio del subtotal en la pantalla de pago, excluyendo cualquier línea de artículo de propina.
requires_shipping	Devoluciones verdadero si hay al menos un artículo en la pantalla de pago que requiere envío.
subtotal_price	El precio del subtotal de las líneas de artículo en la pantalla de pago.
email	El correo electrónico asociado al pedido abandonado.
shop_name	El nombre de tu tienda.
tax_lines	Los impuestos desglosados por tipo: {% for tax_line in tax_lines %} {{ tax_line.title }} ({{ tax_line.rate_percentage }}%) : {{ tax_line.price \| money_with_currency }} {% endfor %}
tax_price	Los impuestos combinados de todos los artículos que figuran en la pantalla de pago.
attributes	Cualquier atributo vinculado al pedido abandonado. Ejemplo: `{{ attributes.gift-note }}`
shipping_method	Información sobre el primer método de envío disponible en la pantalla de pago.
shipping_methods	Los métodos de envío disponibles en la pantalla de pago.
free	Devoluciones verdadero si el precio total del pago es cero.
free_shipping	Devoluciones verdadero si ningún artículo en la pantalla de pago requiere envío, o si el precio del envío es cero.
different_billing_address	Devoluciones verdadero O falso en función de si la dirección de envío es la misma que la de facturación.
customer	El objeto de cliente que contiene los atributos del resultado de cliente.
gift_cards	Las tarjetas de regalo que se aplicaron en la pantalla de pago.
gift_cards_amount	El monto del precio de pago que se abonaría con tarjetas de regalo.
transactions	Las transacciones durante el proceso de pago.
shareable_url	La URL del primer producto en las líneas de artículo.
shareable_title	El nombre del producto de la primera línea de artículo.
total_tip	La propina total que el cliente agregó en la pantalla de pago.
discount_applications	Describe el motivo y la forma en que se aplicó un descuento a un artículo en la pantalla de pago.
cart_level_discount_applications	Las solicitudes de descuento específicas para el carrito.
currency	La moneda del pedido abandonado.
line_items_subtotal_price	La suma de los precios de todas las líneas de artículo de la pantalla de pago, después de aplicar cualquier descuento en líneas de artículo.

Variables de Liquid para los correos electrónicos de carrito y navegación abandonados

La variable abandoned_visit.* se rellena solo si un correo electrónico es parte de una automatización de marketing de un carrito abandonado o una navegación de producto abandonada. Revisa las siguientes propiedades a las que esta variable concede acceso.

Descripción de las variables Liquid compatibles con Shopify Email
Variable	Descripción
abandoned_visit.*	Esta variable otorga acceso a las siguientes propiedades de un carrito abandonado o de navegación: `url` muestra la URL del carrito o la navegación abandonados. `products_added_to_cart` muestra las primeras cinco líneas de artículos de productos agregadas al carrito de la visita abandonada. Además, cada objeto `products_added_to_cart` contiene las siguientes propiedades sobre cada producto: `título` `image_url` `variant_title` `quantity` `products_viewed` muestra los primeros cinco productos vistos durante la visita abandonada. Además, cada objeto `products_viewed` contiene las siguientes propiedades sobre cada producto: `título` `descripción` `image_url` `URL` `image_alt_text` `remaining_cart_products_count` muestra el número de líneas de artículos restantes, si hay más de cinco líneas de artículo en el pedido abandonado.

Usar las variables obligatorias

Cuando creas un correo electrónico de Liquid personalizado, la variable unsubscribe_link o unsubscribe_url es obligatoria. Si activaste el seguimiento de apertura, la variable open_tracking también es obligatoria.

Aunque estas variables se pueden insertar en cualquier lugar del código del correo electrónico, el lugar más común para agregarlas es en la sección del pie de página de un correo electrónico, como en el siguiente ejemplo:

<div id="footer">{{ unsubscribe_link }} {{ open_tracking_block }}</div>

Ejemplo de código Liquid personalizado

Puedes agregar Liquid y HTML personalizados en el editor de código. El siguiente código es un ejemplo de cómo agregar código Liquid para mostrar el nombre de la tienda, un botón personalizado y una imagen de tamaño personalizado en un mensaje de correo electrónico.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ shop.name }} Newsletter</title>
</head>
<body style="margin: 0; padding: 0; font-family: Arial, sans-serif; line-height: 1.5; color: #333333; background-color: #f5f5f5;">
    <table cellpadding="0" cellspacing="0" border="0" width="100%" style="background-color: #f5f5f5;">
        <tr>
            <td align="center" style="padding: 20px;">
                <table cellpadding="0" cellspacing="0" border="0" width="600" style="background-color: #ffffff; border-radius: 4px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
                    <!-- Header -->
                    <tr>
                        <td align="center" style="background-color: #4a6de5; padding: 30px 20px; color: #ffffff;">
                            <h1 style="margin: 0; font-size: 28px; font-weight: bold;">{{ shop.name }}</h1>
                            <p style="margin: 10px 0 0; font-size: 16px;">Your Book Journey with Us</p>
                        </td>
                    </tr>

                    <!-- Content -->
                    <tr>
                        <td style="padding: 30px 20px;">
                            <!-- Greeting Section -->
                            <table cellpadding="0" cellspacing="0" border="0" width="100%" style="margin-bottom: 30px;">
                                <tr>
                                    <td>
                                        <h2 style="margin: 0 0 15px; font-size: 22px; color: #222222;">Hello {{ customer.name }}!</h2>
                                        <p style="margin: 0 0 15px; font-size: 15px;">We hope this email finds you well. We noticed you're from {{ customer.default_address.city }}.</p>
                                        {% if customer.email %}
                                            <p style="margin: 0 0 15px; font-size: 15px;">Your registered email is: {{ customer.email }}</p>
                                        {% endif %}
                                    </td>
                                </tr>
                            </table>

                            <!-- Reading Journey Section -->
                            <table cellpadding="0" cellspacing="0" border="0" width="100%" style="margin-bottom: 30px;">
                                <tr>
                                    <td>
                                        <h2 style="margin: 0 0 15px; font-size: 20px; color: #4a6de5;">Your Reading Journey</h2>
                                        <p style="margin: 0 0 15px; font-size: 15px;">Thank you for being a loyal customer! Here's a snapshot of your journey:</p>
                                        <p style="margin: 0 0 15px; font-size: 15px;">You purchased {{ customer.orders_count }} books with us.</p>
                                        {% if customer.last_order %}
                                            <p style="margin: 0 0 15px; font-size: 15px;"> You last read {{customer.last_order.line_items[0].title}}. Great choice! </p>
                                          {% endif %}
                                    </td>
                                </tr>
                            </table>

                            <!-- Recommended Books Section -->
                            <table cellpadding="0" cellspacing="0" border="0" width="100%" style="margin-bottom: 30px;">
                                <tr>
                                    <td>
                                        <h2 style="margin: 0 0 15px; font-size: 20px; color: #4a6de5;">Books You Might Love</h2>
                                        <p style="margin: 0 0 15px; font-size: 15px;">Based on your reading preferences, we've handpicked these titles just for you:</p>

                                        <table cellpadding="0" cellspacing="0" border="0" width="100%">
                                            <tr>
                                                <td width="50%" style="padding-right: 10px;">
                                                    <table cellpadding="0" cellspacing="0" border="0" width="100%" style="background-color: #f9f9f9; border-radius: 4px; padding: 15px;">
                                                        <tr>
                                                            <td align="center">
                                                                <!-- Image with proper email attributes -->
                                                                <img src="https:{{ all_products['product-1-handle'] | image_url: width: 200 }}"
                                                                     alt="Product 1"
                                                                     width="200"
                                                                     height="200"
                                                                     style="display: block; border: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic;"
                                                                     title="Product 1"
                                                                     border="0">
                                                                <h3 style="margin: 0 0 10px; font-size: 16px; color: #333333;">{{ all_products['product-1-handle'].title }}</h3>
                                                                <p style="margin: 0 0 10px; font-size: 15px; color: #4a6de5;">${{ all_products['product-1-handle'].price }}</p>
                                                                <a href="{{shop.domain}}{{ all_products['product-1-handle'].url }}" style="display: inline-block; background-color: #4a6de5; color: #ffffff; padding: 10px 20px; text-decoration: none; border-radius: 4px; font-size: 14px;">View Book</a>
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </td>
                                                <td width="50%" style="padding-left: 10px;">
                                                    <table cellpadding="0" cellspacing="0" border="0" width="100%" style="background-color: #f9f9f9; border-radius: 4px; padding: 15px;">
                                                        <tr>
                                                            <td align="center">
                                                                <!-- Image with proper email attributes -->
                                                                <img src="https:{{ all_products['product-2-handle'] | image_url: width: 200 }}"
                                                                     alt="Product 2"
                                                                     width="200"
                                                                     height="200"
                                                                     style="display: block; border: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic;"
                                                                     title="Product 2"
                                                                     border="0">
                                                                <h3 style="margin: 0 0 10px; font-size: 16px; color: #333333;">{{ all_products['product-2-handle'].title }}</h3>
                                                                <p style="margin: 0 0 10px; font-size: 15px; color: #4a6de5;">${{ all_products['product-2-handle'].price }}</p>
                                                                <a href="{{shop.domain}}{{ all_products['product-2-handle'].url }}" style="display: inline-block; background-color: #4a6de5; color: #ffffff; padding: 10px 20px; text-decoration: none; border-radius: 4px; font-size: 14px;">View Book</a>
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                            </table>

                            <!-- Book Club Section -->
                            <table cellpadding="0" cellspacing="0" border="0" width="100%" style="margin-bottom: 30px;">
                                <tr>
                                    <td style="background-color: #f5f7ff; border-radius: 4px; padding: 25px; text-align: center;">
                                        <h2 style="margin: 0 0 15px; font-size: 18px; color: #333333;">This Month's Top Picks</h2>
                                        <p style="margin: 0 0 20px; font-size: 15px;">Discover what other readers are loving this month:</p>
                                        <a href="{{ shop.url }}/pages/book-club" style="display: inline-block; background-color: #4a6de5; color: #ffffff; padding: 10px 20px; text-decoration: none; border-radius: 4px; font-size: 14px;">Join Our Book Club</a>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>

                    <!-- Footer -->
                    <tr>
                        <td style="background-color: #f2f2f2; padding: 30px 20px; text-align: center;">
                            <p style="margin: 0 0 15px; font-size: 15px;">Best regards,<br><strong>{{ shop.name }} Team</strong></p>
                            <p style="margin: 0 0 15px; font-size: 12px; color: #999999;">© {{ 'now' | date: '%Y' }} {{ shop.name }}. All rights reserved.</p>
                            <p style="margin: 0 0 15px; font-size: 12px;">{{ open_tracking_block }}</p>
                            <a href="{{ unsubscribe_url }}" style="color: #999999; font-size: 12px; text-decoration: underline;">{{ unsubscribe_link }}</a>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
</body>
</html>