Personalize as campanhas do Shopify Messaging com o Liquid

O Liquid é a linguagem de programação simples e fácil de usar da Shopify e é a mesma com a qual os temas da Shopify Theme Store são criados.

É possível usar o Liquid personalizado para aprimorar as mensagens do Shopify Messaging de duas formas: criar um e-mail totalmente personalizado com código ou adicionar uma seção de Liquid personalizado a um modelo. Essas opções permitem a inserção de Liquid ou HTML personalizados.

Use o Liquid personalizado para exibir ativos personalizados, como imagens lado a lado, botões personalizados, imagens de tamanho personalizado e tamanhos de seção personalizados.

Nesta página

Considerações

Analise as considerações a seguir antes de começar a adicionar Liquid personalizado às mensagens do Shopify Messaging:

As variáveis incluídas no código precisam ser compatíveis com o Liquid personalizado.
Só é possível usar um desktop para criar uma seção de Liquid personalizado.
A variável unsubscribe_link ou unsubscribe_url é obrigatória em e-mails com Liquid personalizado. Se o rastreamento de abertura estiver ativado, a variável open_tracking também será obrigatória. Saiba mais sobre como adicionar variáveis obrigatórias ao e-mail.
O código inserido tem os seguintes limites:
- Máximo de 50 kB para seções de Liquid personalizado.
- Máximo de 500 kB para e-mails com código Liquid personalizado.

Como criar um e-mail com código personalizado usando o Liquid

Para usar um código Liquid personalizado na criação de um e-mail, adicione uma seção de Liquid personalizado ou crie um e-mail inteiramente com código Liquid personalizado selecionando Codificar o seu ao criar uma campanha do Shopify Messaging.

Variáveis do Liquid compatíveis com o Liquid personalizado

Use variáveis compatíveis para personalizar os e-mails do Shopify Messaging com o Liquid. Confira as listas de variáveis do Liquid compatíveis com os seguintes tipos de modelos:

Variáveis do Liquid compatíveis com todos os modelos de e-mail

Use as variáveis a seguir para personalizar qualquer um dos e-mails do Shopify Messaging com o Liquid.

Descrição das variáveis do Liquid compatíveis com o Shopify Messaging
Variável	Descrição
all_products	Todos os produtos da loja.
customer.accepts_marketing	Retorna `true` se o cliente aceitar marketing e `false` caso contrário.
customer.addresses	Retorna todos os endereços associados ao cliente.
customer.addresses_count	Retorna o número de endereços associados ao cliente.
customer.b2b?	Retorna `true` se o cliente for B2B e `false` caso contrário.
customer.current_location	Retorna o local da empresa selecionado para o cliente.
customer.default_address	Retorna o endereço padrão do cliente.
customer.email	Retorna o endereço de e-mail do cliente.
customer.first_name	Retorna o nome do cliente.
customer.has_account	Retorna `true` se o e-mail do cliente estiver associado a uma conta de cliente e `false` caso contrário.
customer.has_avatar?	Retorna `true` se o cliente tiver um avatar associado à conta e `false` caso contrário.
customer.id	Retorna o ID do cliente.
customer.last_name	Retorna o sobrenome do cliente.
customer.last_order	Retorna o último pedido feito pelo cliente, excluindo os pedidos de teste.
customer.name	Retorna o nome completo do cliente.
customer.orders	Retorna todos os pedidos que o cliente fez.
customer.orders_count	Retorna o número total de pedidos que o cliente fez.
customer.payment_methods	Retorna as formas de pagamento salvas do cliente.
customer.phone	Retorna o número de telefone do cliente. O número de telefone é preenchido apenas se o cliente o tiver usado no checkout, se tiver optado por receber notificações por SMS ou se você o tiver adicionado manualmente à conta de cliente.
customer.store_credit_account.balance	Retorna o saldo de crédito na loja do cliente na moeda associada ao contexto relevante. Por exemplo: `{{customer.store_credit_account.balance \| money_with_currency}}`
customer.tags	Retorna as tags associadas ao cliente.
customer.tax_exempt	Retorna `true` se o cliente for isento de tributos e `false` caso contrário.
customer.total_spent	Retorna o valor total que o cliente gastou em todos os pedidos da sua loja.
email.*	Esta variável dá acesso às seguintes propriedades do e-mail: `subject` exibe a linha de assunto do e-mail. `preview_text` exibe o texto de pré-visualização do e-mail.
open_tracking	Esta variável dá acesso ao bloco pré-formatado de rastreamento de abertura. Ela é obrigatória se você criar um e-mail com código personalizado e tiver ativado o rastreamento de abertura.
shop.*	Esta variável dá acesso às seguintes propriedades da loja: `name` exibe o nome da loja. `domain` exibe o domínio primário da loja. `url` exibe a URL da loja. `shopify_domain` exibe o domínio da Shopify da loja. `endereço` exibe o endereço da loja, que dá acesso às seguintes propriedades de endereço: `address1` `address2` `city` `country` `phone` `province` `zip`
unsubscribe_url	Esta variável dá acesso à URL de cancelamento de assinatura sem formatação e pode ser personalizada. Se você criar um e-mail com código personalizado, será necessário incluir a variável `unsubscribe_url` ou `unsubscribe_link`. Tanto `unsubscribe_url` quanto `unsubscribe_link` sempre apontarão para o domínio primário da loja virtual e não podem ser modificadas para direcionar a outro lugar.

Variáveis do Liquid compatíveis com e-mails de checkout abandonado

Use as variáveis a seguir para personalizar os e-mails de checkout abandonado do Shopify Messaging com o Liquid.

A variável abandoned_checkout é preenchida apenas se um e-mail fizer parte de uma automação de marketing de checkout abandonado. Caso contrário, a variável será null.

Descrição das variáveis do Liquid compatíveis com o Shopify Messaging para navegação, carrinho e checkout abandonados
Variável	Descrição
abandoned_checkout.*	Esta variável dá acesso às seguintes propriedades de um checkout abandonado: `url` exibe a URL do checkout abandonado. `line_items` exibe os cinco primeiros itens de linha do checkout abandonado. Além disso, cada `line_items` objeto contém as seguintes propriedades sobre cada produto: `components` `image_url` `product_title` `variant_title` `quantity` `line_items.components` exibe os componentes do checkout abandonado. Além disso, cada `components` objeto contém as seguintes propriedades sobre cada componente: `image_url` `quantity` `product_title` `variant_title` `remaining_products_count` exibe a contagem de itens de linha restantes, se houver mais de cinco itens de linha no checkout abandonado.
id (checkout ID)	Um ID exclusivo do checkout para uso interno.
shop	O nome da sua loja na Shopify.
name	O nome do checkout abandonado, também conhecido como o número do checkout.
total_price	O preço total do pedido (subtotal + custo de frete - desconto de frete + tributo).
shipping_price	O preço do frete. Exemplo: `{{ shipping_price \| money }}`
shipping_address	O endereço de entrega.
billing_address	O endereço de cobrança.
line_items	Uma lista de todos os itens de linha no checkout abandonado.
unavailable_line_items	Uma lista de todos os itens de linha no checkout abandonado que não estão disponíveis.
note	A observação anexada ao checkout abandonado.
landing_site	O caminho do site de destino que o cliente usou. Esta é a primeira página que o cliente acessou ao chegar na loja. Exemplo: `/products/great-product?ref=my-tracking-token`
landing_site_ref	Extrai um parâmetro de referência do site de destino. Os parâmetros de referência podem ser: `ref`, `source`, `r`. Se o `landing_site` for `/products/great-product?ref=my-tracking-token`, o `landing_site_ref` será `my-tracking-token`. É possível realizar uma determinada ação se o parâmetro de referência for igual a um determinado valor: {% if landing_site_ref == 'my-tracking-token' %} My action... {% endif %}
referring_site	A URL do referenciador que levou o cliente para sua loja. Exemplo: `https://www.google.com/?s=great+products`
created_at	A data e a hora em que o cliente criou o checkout que abandonou.
closed_at	A data e a hora em que o checkout foi fechado.
customer_locale	O código de idioma de duas ou três letras da localidade do cliente, opcionalmente seguido por um modificador de região. Por exemplo, en , en-CA
item_count	A soma das quantidades de todos os itens.
unique_gateways	Uma lista dos provedores de pagamento únicos disponíveis no checkout.
discount	O desconto aplicado ao carrinho ou a um item de linha no checkout abandonado.
discounts	Uma lista de descontos aplicados ao checkout.
successfully_applied_discounts	Os descontos que foram aplicados com sucesso ao checkout.
discounts_amount	O valor em dinheiro do desconto aplicado, proveniente de todos os descontos. Exemplo: +$ 5,00
discounts_savings	O valor em dinheiro da economia gerada por todos os descontos. Exemplo: -$ 5,00
buyer_accepts_marketing	Retorna true ou false dependendo se o cliente aceitou receber marketing durante o checkout abandonado.
subtotal_line_items	Os itens de linha usados para calcular o subtotal no checkout, excluindo os itens de linha de gorjeta.
requires_shipping	Retorna true se houver pelo menos um item no checkout que exija frete.
subtotal_price	O subtotal dos itens de linha no checkout.
email	O e-mail associado ao checkout abandonado.
shop_name	O nome da loja.
tax_lines	Os tributos divididos por tipo de tributo: {% for tax_line in tax_lines %} {{ tax_line.title }} ({{ tax_line.rate_percentage }}%) : {{ tax_line.price \| money_with_currency }} {% endfor %}
tax_price	A soma dos tributos de todos os itens no checkout.
attributes	Quaisquer características que foram anexadas ao checkout abandonado. Exemplo: `{{ attributes.gift-note }}`
shipping_method	Informações sobre a primeira forma de frete disponível no checkout.
shipping_methods	As formas de frete disponíveis no checkout.
free	Retorna true if the total price of the checkout is zero.
free_shipping	Retorna true se o checkout não exigir frete ou se o preço do frete for zero.
different_billing_address	Retorna true ou false dependendo se o endereço de entrega é o mesmo que o endereço de faturamento.
customer	O objeto de cliente que contém as características da saída cliente.
gift_cards	Os cartões-presente aplicados ao checkout.
gift_cards_amount	O valor do preço do checkout que seria pago com cartões-presente.
transactions	As transações do checkout.
shareable_url	A URL do primeiro produto nos itens de linha.
shareable_title	O título do produto do primeiro item de linha.
total_tip	A gorjeta total que o cliente adicionou no checkout.
discount_applications	Descreve por que e como um item recebeu desconto no checkout.
cart_level_discount_applications	As aplicações de desconto específicas do carrinho.
currency	A moeda do checkout abandonado.
line_items_subtotal_price	A soma dos preços de todos os itens de linha do checkout, após a aplicação de quaisquer descontos do item de linha.

Variáveis do Liquid para e-mails de navegação abandonada e de carrinho abandonado

A variável abandoned_visit.* é preenchida apenas se um e-mail fizer parte de uma automação de marketing de carrinho abandonado ou de navegação de produto abandonada. Analise as propriedades a seguir às quais essa variável dá acesso.

Descrição das variáveis do Liquid compatíveis com o Shopify Messaging
Variável	Descrição
abandoned_visit.*	Essa variável dá acesso às seguintes propriedades de um carrinho ou de uma navegação abandonada: `url` exibe a URL do carrinho ou da navegação abandonada. `products_added_to_cart` exibe os cinco primeiros itens de linha de produto adicionados ao carrinho da visita abandonada. Além disso, cada `products_added_to_cart` objeto contém as seguintes propriedades sobre cada produto: `title` `image_url` `variant_title` `quantity` `products_viewed` exibe os cinco primeiros produtos visualizados durante a visita abandonada. Além disso, cada `products_viewed` objeto contém as seguintes propriedades sobre cada produto: `title` `description` `image_url` `url` `image_alt_text` `remaining_cart_products_count` exibe a contagem de itens de linha restantes, se houver mais de cinco itens de linha no checkout abandonado.

Uso de variáveis obrigatórias

Ao criar um e-mail com Liquid personalizado, a variável unsubscribe_link ou unsubscribe_url é obrigatória. Se você tiver ativado o rastreamento de abertura, a variável open_tracking também será obrigatória.

Embora essas variáveis possam ser inseridas em qualquer lugar no código do e-mail, o local mais comum para adicioná-las é na seção de rodapé do e-mail, como no exemplo a seguir:

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

Exemplo de código Liquid personalizado

É possível adicionar código Liquid ou HTML personalizado no editor de código. O código a seguir é um exemplo de como adicionar código Liquid para exibir o nome da loja, um botão personalizado e uma imagem de tamanho personalizado em um e-mail.

<!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>