Agregar Liquid personalizado a las campañas de Shopify Email

Haz crecer tu negocio

Si necesitas ayuda para crear un código personalizado para los mensajes de Shopify Email, puedes contratar a un Shopify Partner.

Puedes agregar codificaciones personalizadas a los mensajes de Shopify Email agregando una sección personalizada de Liquid o creando un correo electrónico con código completamente personalizado. Estas opciones te permiten introducir Liquid y HTML personalizados.

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 mostrar recursos personalizados como imágenes lado a lado, botones personalizados, imágenes de tamaño personalizado y tamaños de secciones personalizados.

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 es obligatoria en los correos electrónicos de Liquid personalizado. Si activaste el seguimiento de correos abiertos, 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 usar las siguientes variables para personalizar tus mensajes de Shopify Email con Liquid.

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.
unsubscribe_link	Esta variable brinda acceso al enlace para darse de baja. Es obligatoria si creas un correo electrónico con código personalizado.
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.
data.customer.*	Esta variable otorga acceso a las siguientes propiedades de datos de clientes: nombre apellido Correo electrónico city estado país Estas propiedades no se pueden usar dentro de los filtros Liquid ni de las condiciones de Liquid.
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.
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 branding muestra la promoción de marca de la tienda, lo que permite acceder a las siguientes propiedades: accent_section_color background_primary_color background_border_color body_text_color button_background_and_link_color button_label_color footer_link_color footer_text_color footer_background_color social_link_facebook social_link_twitter social_link_instagram social_link_pinterest shop_name logo, que se renderiza como una etiqueta img directamente.

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: image_url product_title variant_title quantity 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 es obligatoria. Si activaste el seguimiento de correos abiertos, 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.

<style>
  body {
    text-align: center;
  }

  p#welcome {
    margin: 0;
    padding: 3rem;
    color: white;
    font-weight: 700;
    font-size: 26px;
    font-family: 'Futura';
  }

  div#image_wrapper img {
    max-width: 70%;
    border-radius: 60px;
    box-shadow: -2px 6px 0px rgba(227, 111, 59, 0.7);
  }

  div#button_wrapper {
    padding: 1rem;
  }

  div#button_wrapper a {
    padding: 1rem 2rem;
    border-radius: 24px;
    display: inline-block;
    background: linear-gradient(120deg, #F6A179, #865CFF);
    box-shadow: -2px 4px 0px rgba(96, 54, 173, 0.9);
    font-weight: 700;
    font-size: 16px;
    font-family: 'Futura';
    color: white;
  }

  div#footer {
    font-weight: 700;
    font-size: 16px;
    font-family: 'Futura';
    padding: 2rem;
  }

  div#button_wrapper:hover a {
    box-shadow: -4px 6px 0px rgba(96, 54, 173, 0.8);
  }

  div#custom_section {
    background: linear-gradient(120deg, #FF9F73, #FFC7AD);
    padding:0 0 2rem 0;
    border-radius: 4rem;
  }
</style>
<div id="custom_section">
  <p id="welcome">
    Hello from {{shop.name}}<strong></strong>!
  </p>
  <div id="image_wrapper">
    <img src="https://burst.shopifycdn.com/photos/a-trio-of-natural-soaps.jpg" alt="" />
  </div>
  <div id="button_wrapper">
    <a href="">Shop now</a>
  </div>
  <div id="footer">{{ unsubscribe_link }} {{ open_tracking_block }}</div>
</div>