Настройка кампаний Shopify Messaging с помощью Liquid

Liquid — это простой и удобный язык программирования Shopify. На этом же языке программирования созданы темы из Shopify Theme Store.

Вы можете использовать пользовательский код Liquid для улучшения сообщений Shopify Messaging, создав письмо полностью из пользовательского кода или добавив раздел с пользовательским кодом Liquid в шаблон. Эти параметры позволяют вводить пользовательский код Liquid или HTML.

С помощью пользовательского кода Liquid можно отображать пользовательские ресурсы, например изображения рядом друг с другом, пользовательские кнопки, а также изменять размер изображений и разделов.

Что необходимо учесть

Перед добавлением пользовательского кода Liquid в сообщения Shopify Messaging ознакомьтесь со следующей информацией:

  • Переменные, которые вы включаете в свой код, должны поддерживаться пользовательским кодом Liquid.
  • Создать раздел с пользовательским кодом Liquid можно только на компьютере.
  • В письмах с пользовательским кодом Liquid обязательна переменная unsubscribe_link или unsubscribe_url. Если вы активировали отслеживание открытий, также обязательна переменная open_tracking. Подробнее о добавлении обязательных переменных в письмо.
  • Вводимый код имеет следующие ограничения:
    • Не более 50 килобайт (КБ) для разделов с пользовательским кодом Liquid.
    • Не более 500 КБ для писем с пользовательским кодом Liquid.

Создание письма с пользовательским кодом Liquid

Если при создании письма вы хотите использовать пользовательский код Liquid, вы можете добавить раздел с пользовательским кодом Liquid или создать письмо полностью из пользовательского кода Liquid. Для этого выберите Написать собственный код при создании кампании Shopify Messaging.

Переменные Liquid, поддерживаемые в пользовательском коде Liquid

Вы можете использовать поддерживаемые переменные для настройки сообщений Shopify Messaging с помощью Liquid. Ознакомьтесь со списками поддерживаемых переменных Liquid для следующих типов шаблонов:

Переменные Liquid, поддерживаемые для всех шаблонов писем

Следующие переменные можно использовать для настройки любых сообщений Shopify Messaging с помощью Liquid.

Описание поддерживаемых переменных Liquid для Shopify Messaging
ПеременнаяОписание
all_products
Все товары в вашем магазине.
customer.accepts_marketing
Возвращает значение true, если клиент согласен получать маркетинговые материалы, и false в противном случае.
customer.addresses
Возвращает все адреса, связанные с клиентом.
customer.addresses_count
Возвращает количество адресов, связанных с клиентом.
customer.b2b?
Возвращает значение true, если клиент является B2B-покупателем, и false в противном случае.
customer.current_location
Возвращает текущее выбранное местонахождение компании для клиента.
customer.default_address
Возвращает адрес по умолчанию клиента.
customer.email
Возвращает адрес электронной почты клиента.
customer.first_name
Возвращает имя клиента.
customer.has_account
Возвращает значение true, если адрес электронной почты клиента связан с аккаунтом клиента, и false в противном случае.
customer.has_avatar?
Возвращает значение true, если с аккаунтом клиента связан аватар, и false в противном случае.
customer.id
Возвращает ИД клиента.
customer.last_name
Возвращает фамилию клиента.
customer.last_order
Возвращает последний заказ, размещенный клиентом (не включая тестовые заказы).
customer.name
Возвращает полное имя клиента.
customer.orders
Возвращает все заказы, размещенные клиентом.
customer.orders_count
Возвращает общее количество заказов, размещенных клиентом.
customer.payment_methods
Возвращает сохраненные способы оплаты клиента.
customer.phone
Возвращает номер телефона клиента. Номер телефона заполняется только в том случае, если клиент использовал номер телефона при оформлении заказа, согласился на SMS-уведомления или если вы вручную добавили его в аккаунт клиента.
customer.store_credit_account.balance

Возвращает баланс кредита магазина клиента в валюте, связанной с соответствующим контекстом. Например:

{{customer.store_credit_account.balance | money_with_currency}}
customer.tags
Возвращает теги, связанные с клиентом.
customer.tax_exempt
Возвращает true, если клиент освобожден от налогов, и возвращает false в противном случае.
customer.total_spent
Возвращает общую сумму, которую клиент потратил на все заказы в вашем магазине.
email.*

Эта переменная предоставляет доступ к следующим свойствам электронной почты:

  • subject отображает тему письма.
  • preview_text отображает текст предпросмотра письма.
  • open_tracking
    Эта переменная предоставляет доступ к предварительно отформатированному блоку отслеживания открытий. Эта переменная обязательна, если вы создаете письмо с пользовательским кодом и активировали отслеживание открытий.
    shop.*
    Эта переменная предоставляет доступ к следующим свойствам магазина:
  • name отображает название магазина.
  • domain отображает основной домен магазина.
  • url отображает URL магазина.
  • shopify_domain отображает домен Shopify для магазина.
    • адрес отображает адрес магазина, что предоставляет доступ к следующим свойствам адреса:
      • address1
      • address2
      • city
      • country
      • phone
      • province
      • zip
    unsubscribe_url
    Эта переменная предоставляет доступ к исходному URL отписки и может быть настроена. Если вы создаете письмо с пользовательским кодом, вы обязаны включить переменную unsubscribe_url или unsubscribe_link. И unsubscribe_url, и unsubscribe_link всегда будут указывать на основной домен интернет-магазина и не могут быть изменены для перенаправления в другое место.

    Переменные Liquid, поддерживаемые для писем о незавершенном оформлении заказа

    Вы можете использовать следующие переменные, чтобы настроить ваши сообщения электронной почты Shopify Messaging о незавершенном оформлении заказа с помощью Liquid.

    Переменная abandoned_checkout заполняется только в том случае, если письмо является частью автоматизации маркетинга для незавершенного оформления заказа. В противном случае переменная имеет значение null.

    Описание переменных Liquid, поддерживаемых Shopify Messaging, для брошенного просмотра, брошенной корзины и незавершенного оформления заказа
    ПеременнаяОписание
    abandoned_checkout.*

    Эта переменная предоставляет доступ к следующим свойствам незавершенного оформления заказа:

    • url отображает URL незавершенного оформления заказа.
    • line_items отображает первые пять позиций незавершенного оформления заказа. Кроме того, каждый line_items объект содержит следующие свойства каждого продукта:
      • components
      • image_url
      • product_title
      • variant_title
      • quantity
    • line_items.components отображает компоненты незавершенного оформления заказа. Кроме того, каждый components объект содержит следующие свойства каждого компонента:
      • image_url
      • quantity
      • product_title
      • variant_title
    • remaining_products_count отображает количество оставшихся позиций, если в незавершенном оформлении заказа больше пяти позиций.
    id
    (checkout ID)
    Уникальный ИД оформления заказа для внутреннего использования.
    shop
    Название вашего магазина Shopify.
    name
    Название незавершенного оформления заказа, также известное как номер оформления заказа.
    total_price
    Общая стоимость заказа (промежуточный итог + стоимость доставки - скидка на доставку + налог).
    shipping_price

    Стоимость доставки.

    Пример: {{ shipping_price | money }}

    shipping_address
    Адрес доставки.
    billing_address
    Адрес для выставления счета.
    line_items
    Список всех позиций в незавершенном оформлении заказа.
    unavailable_line_items
    Список всех недоступных позиций в незавершенном оформлении заказа.
    note
    Примечание, прикрепленное к незавершенному оформлению заказа.
    landing_site

    Путь целевого сайта, который использовал клиент. Это первая страница, на которую зашел клиент, когда попал в магазин.

    Пример: /products/great-product?ref=my-tracking-token

    landing_site_ref

    Извлекает реферальный параметр с целевого сайта. Реферальными параметрами могут быть: ref, source, r.

    Если landing_site — это /products/great-product?ref=my-tracking-token, тогда landing_site_ref будет my-tracking-token. Вы можете выполнить определенное действие, если ваш реферальный параметр равен определенному значению:

    {% if landing_site_ref == 'my-tracking-token' %}
    My action...
    {% endif %}
    referring_site

    URL реферера, который привел клиента в ваш магазин.

    Пример: https://www.google.com/?s=great+products

    created_at

    Дата и время создания оформления заказа, которое клиент не завершил.

    closed_at

    Дата и время закрытия оформления заказа.

    customer_locale
    Двух- или трехбуквенный код языка для локали клиента, за которым может следовать модификатор региона. Например,
    en
    ,
    en-CA
    item_count
    Сумма количества всех товаров.
    unique_gateways
    Список уникальных поставщиков платежей, доступных при оформлении заказа.
    discount
    Скидка, примененная к корзине или позиции в незавершенном оформлении заказа.
    discounts
    Список скидок, примененных к оформлению заказа.
    successfully_applied_discounts
    Скидки, успешно примененные к оформлению заказа.
    discounts_amount

    Сумма в долларах для скидки, полученной за счет всех примененных скидок.

    Пример: +5,00 $

    discounts_savings

    Сумма в долларах для экономии, полученной за счет всех скидок.

    Пример: -5,00 $

    buyer_accepts_marketing
    Возвращает
    true
    или
    false
    в зависимости от того, согласился ли клиент на рекламную рассылку во время незавершенного оформления заказа.
    subtotal_line_items
    Позиции, которые используются для расчета промежуточного итога при оформлении заказа, за исключением чаевых.
    requires_shipping
    Возвращает
    true
    , если при оформлении заказа есть как минимум один товар, требующий доставки.
    subtotal_price
    Сумма промежуточного итога позиций при оформлении заказа.
    email
    Электронная почта, связанная с незавершенным оформлением заказа.
    shop_name
    Название вашего магазина.
    tax_lines

    Налоги с разбивкой по типу:

    {% for tax_line in tax_lines %}
    {{ tax_line.title }} ({{ tax_line.rate_percentage }}%) : {{ tax_line.price | money_with_currency  }}
    {% endfor %}
    tax_price
    Общая сумма налогов для всех товаров при оформлении заказа.
    attributes

    Любые атрибуты, которые были прикреплены к незавершенному оформлению заказа.

    Пример: {{ attributes.gift-note }}

    shipping_method
    Информация о первом способе доставки, доступном при оформлении заказа.
    shipping_methods
    Способы доставки, доступные при оформлении заказа.
    free
    Возвращает
    true if the total price of the checkout is zero.
    free_shipping
    Возвращает
    true
    , если для оформления заказа не требуется доставка, или если стоимость доставки равна нулю.
    different_billing_address
    Возвращает
    true
    или
    false
    в зависимости от того, совпадает ли адрес доставки с адресом выставления счета.
    customer
    Объект клиента, содержащий атрибуты вывода клиента.
    gift_cards
    Подарочные карты, примененные при оформлении заказа.
    gift_cards_amount
    Часть стоимости заказа, которая будет оплачена подарочными картами.
    transactions
    Транзакции при оформлении заказа.
    shareable_url
    URL первого товара в позициях.
    shareable_title
    Название товара первой позиции.
    total_tip
    Общая сумма чаевых, добавленных клиентом при оформлении заказа.
    discount_applications
    Описывает причину и способ применения скидки к товару при оформлении заказа.
    cart_level_discount_applications
    Применения скидок, специфичных для данной корзины.
    currency
    Валюта незавершенного оформления заказа.
    line_items_subtotal_price
    Сумма цен всех позиций при оформлении заказа после применения скидок на позиции.

    Переменные Liquid для писем о брошенном просмотре и брошенной корзине

    Переменная abandoned_visit.* заполняется только в том случае, если письмо является частью автоматизации маркетинга для брошенной корзины или незавершенного просмотра товара. Ознакомьтесь со следующими свойствами, к которым эта переменная предоставляет доступ.

    Описание поддерживаемых переменных Liquid для Shopify Messaging
    ПеременнаяОписание
    abandoned_visit.*

    Эта переменная дает доступ к следующим свойствам брошенной корзины или просмотра:

    • url отображает URL брошенной корзины или просмотра.
    • products_added_to_cart отображает первые пять товарных позиций, добавленных в корзину во время незавершенного посещения. Кроме того, каждый products_added_to_cart объект содержит следующие свойства для каждого товара:
      • title
      • image_url
      • variant_title
      • quantity
    • products_viewed отображает первые пять товаров, просмотренных во время незавершенного посещения. Кроме того, каждый products_viewed объект содержит следующие свойства для каждого товара:
      • title
      • description
      • image_url
      • url
      • image_alt_text
    • remaining_cart_products_count отображает оставшееся количество позиций, если в незавершенном оформлении заказа больше пяти позиций.

    Использование обязательных переменных

    При создании пользовательского письма с помощью Liquid обязательной является переменная unsubscribe_link или unsubscribe_url. Если вы активировали отслеживание открытий, также потребуется переменная open_tracking.

    Хотя эти переменные можно вставить в любое место в коде вашего письма, чаще всего они добавляются в футер письма, как в следующем примере:

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

    Пример пользовательского кода Liquid

    Вы можете добавить свой код Liquid или HTML в редактор кода. Следующий код является примером того, как с помощью кода Liquid можно отобразить название магазина, пользовательскую кнопку и изображение заданного размера в сообщении электронной почты.

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