Personalizza le campagne Shopify Email utilizzando Liquid
Liquid è il linguaggio di programmazione di Shopify semplice e facile da utilizzare. Si tratta dello stesso linguaggio di programmazione con cui sono costruiti i temi del Theme store di Shopify.
Puoi utilizzare Liquid personalizzato per migliorare i messaggi di Shopify Email creando un'email con il codice completamente personalizzato o aggiungendo una sezione Liquid personalizzata a un modello. Queste opzioni ti consentono di inserire Liquid o HTML personalizzati.
Puoi utilizzare Liquid personalizzato per mostrare risorse personalizzate quali immagini affiancate, pulsanti personalizzati, nonché immagini e sezioni con dimensioni personalizzate.
Su questa pagina
Considerazioni
Prima di aggiungere Liquid personalizzato ai messaggi di Shopify Email, esamina le seguenti considerazioni:
- Le variabili incluse nel codice devono essere supportate da Liquid personalizzato.
- È possibile creare una sezione Liquid personalizzata solo da un dispositivo desktop.
- La variabile
unsubscribe_link
ounsubscribe_url
è obbligatoria nelle email Liquid personalizzate. Se hai attivato il monitoraggio dell'apertura, è necessaria anche la variabileopen_tracking
. Scopri di più sull'aggiunta delle variabili obbligatorie alla tua email. - Il codice che inserisci ha i seguenti limiti: - Massimo 50 kilobyte (KB) per le sezioni Liquid personalizzate. - Massimo 500 KB per le email con codice Liquid personalizzato.
Variabili Liquid supportate nel Liquid personalizzato
Puoi utilizzare le variabili supportate per personalizzare i messaggi email di Shopify con Liquid. Puoi rivedere gli elenchi delle variabili Liquid supportate per i seguenti tipi di modelli:
- Tutti i modelli di email
- Modelli di email per check-out abbandonato
- Modelli di email per navigazione abbandonata e carrelli abbandonati
Variabili Liquid supportate per tutti i modelli di email
Puoi utilizzare le seguenti variabili per personalizzare tutti i messaggi di Shopify Email con Liquid.
Variabile | Descrizione |
---|---|
all_products | Tutti i prodotti nel tuo negozio. |
customer.accepts_marketing | Restituisce true se il cliente accetta comunicazioni di marketing e false in caso contrario. |
customer.addresses | Restituisce tutti gli indirizzi associati al cliente. |
customer.addresses_count | Restituisce il numero di indirizzi associati al cliente. |
customer.b2b? | Restituisce true se il cliente è un cliente B2B, altrimenti restituisce false . |
customer.current_location | Restituisce la sede aziendale attualmente selezionata per il cliente. |
customer.default_address | Restituisce l'indirizzo predefinito del cliente. |
customer.email | Restituisce l'indirizzo email del cliente. |
customer.first_name | Restituisce il nome del cliente. |
customer.has_account | Restituisce true se l'email del cliente è associata a un account cliente, altrimenti restituisce false . |
customer.has_avatar? | Restituisce true se all'account del cliente è associato un avatar, altrimenti restituisce false . |
customer.id | Restituisce l'ID del cliente. |
customer.last_name | Restituisce il cognome del cliente. |
customer.last_order | Restituisce l'ultimo ordine effettuato dal cliente, esclusi gli ordini di prova. |
customer.name | Restituisce nome e cognome del cliente. |
customer.orders | Restituisce tutti gli ordini effettuati dal cliente. |
customer.orders_count | Restituisce il numero totale di ordini effettuati da un cliente. |
customer.payment_methods | Restituisce i metodi di pagamento salvati del cliente. |
customer.phone | Restituisce il numero di telefono del cliente. Il numero di telefono viene compilato solo se il cliente ha utilizzato un numero di telefono al momento del check-out, se ha acconsentito esplicitamente alle notifiche SMS o se lo hai aggiunto manualmente al suo account cliente. |
customer.store_credit_account.balance |
Restituisce il saldo del credito in negozio del cliente nella valuta associata al contesto in questione. Per esempio:
|
customer.tags | Restituisce i tag associati al cliente. |
customer.tax_exempt | Restituisce true se il cliente è esente da imposte e false in caso contrario. |
customer.total_spent | Restituisce l'importo totale speso dal cliente per tutti gli ordini nel tuo negozio. |
email.* |
Questa variabile consente di accedere alle seguenti proprietà dell'email: subject mostra l'oggetto dell'email.preview_text mostra l'anteprima del testo dell'email. |
open_tracking | Questa variabile dà accesso al blocco di monitoraggio dell'apertura già formattato. Questa variabile è obbligatoria se crei un'email con codice personalizzato e hai attivato il monitoraggio dell'apertura. |
shop.* | Questa variabile consente di accedere alle seguenti proprietà del negozio:
name mostra il nome del negozio.domain mostra il dominio primario del negozio.url visualizza l'URL del negozio.shopify_domain mostra il dominio del negozio Shopify.
|
unsubscribe_url | Questa variabile dà accesso all'URL di annullamento dell'iscrizione non elaborato e può essere personalizzata. Se crei un'email con codice personalizzato, devi includere la variabile unsubscribe_url o unsubscribe_link . Sia unsubscribe_url sia unsubscribe_link punteranno sempre al dominio principale del negozio online e non potranno essere modificate per indirizzare altrove. |
Variabili Liquid supportate per le email per check-out abbandonato
Puoi utilizzare le seguenti variabili per personalizzare i messaggi Shopify Email dei check-out abbandonati con Liquid.
Variabile | Descrizione |
---|---|
abandoned_checkout.* |
Questa variabile consente di accedere alle seguenti proprietà di un check-out abbandonato:
|
id(checkout ID) | Un ID univoco del check-out per uso interno. |
shop | Il nome del tuo negozio Shopify. |
name | Il nome del check-out abbandonato, noto anche come numero di check-out. |
total_price | Il prezzo totale dell'ordine (subtotale + costo di spedizione - sconto di spedizione + imposte). |
shipping_price |
Il prezzo di spedizione. Esempio: |
shipping_address | L'indirizzo di spedizione. |
billing_address | L'indirizzo di fatturazione. |
line_items | Un elenco di tutte le voci nel check-out abbandonato. |
unavailable_line_items | Un elenco di tutte le voci nel check-out abbandonato che non sono disponibili. |
note | La nota allegata al check-out abbandonato. |
landing_site |
Il percorso del landing site utilizzato dal cliente. Si tratta della prima pagina a cui il cliente ha effettuato l'accesso una volta arrivato sul tuo negozio. Esempio: |
landing_site_ref |
Estrae un parametro di riferimento dal landing site. I parametri di riferimento possono essere: Se il {% if landing_site_ref == 'my-tracking-token' %} La mia azione... {% endif %} |
referring_site |
L'URL del referrer che ha portato il cliente al tuo negozio. Esempio: |
created_at | La data e l'ora in cui il cliente ha creato il check-out che ha abbandonato. |
closed_at | La data e l'ora in cui il check-out è stato chiuso. |
customer_locale | Il codice della lingua composto da due o tre lettere per le impostazioni locali del cliente, seguito eventualmente da un modificatore di area geografica. Per esempio it, en-CA |
item_count | Una somma di tutte le quantità degli articoli. |
unique_gateways | Un elenco dei gestori dei pagamenti univoci disponibili al momento del check-out. |
discount | Lo sconto applicato al carrello o a una voce nel check-out abbandonato. |
discounts | Un elenco di sconti applicati al check-out. |
successfully_applied_discounts | Gli sconti che sono stati correttamente applicati al check-out. |
discounts_amount |
L'importo dello sconto applicato da tutti gli sconti. Esempio: + 5,00 $ |
discounts_savings |
L'importo dei risparmi derivanti da tutti gli sconti. Esempio: -5,00 $ |
buyer_accepts_marketing | RESI trueo falsea seconda che il cliente accetti il marketing durante il check-out abbandonato. |
subtotal_line_items | Le voci utilizzate per calcolare il prezzo subtotale al momento del check-out, escluse le voci di mancia. |
requires_shipping | RESI truese al momento del check-out è presente almeno un articolo che richiede la spedizione. |
subtotal_price | Il prezzo subtotale delle voci al momento del check-out. |
L'email associata al check-out abbandonato. | |
shop_name | Il nome del tuo negozio. |
tax_lines |
Le imposte suddivise per tipo di imposta: {% for tax_line in tax_lines %} {{ tax_line.title }} ({{ tax_line.rate_percentage }}%) : {{ tax_line.price | money_with_currency }} {% endfor %} |
tax_price | Le imposte complessive di tutti gli articoli al momento del check-out. |
attributes |
Qualsiasi attributo allegato al check-out abbandonato. Esempio: |
shipping_method | Informazioni sulla prima modalità di spedizione disponibile al momento del check-out. |
shipping_methods | Le modalità di spedizione disponibili al momento del check-out. |
free | RESI true se il prezzo totale del check-out è zero. |
free_shipping | RESI truese il check-out non richiede la spedizione o se il prezzo per la spedizione è zero. |
different_billing_address | RESI trueo falsea seconda che l'indirizzo di spedizione sia uguale all'indirizzo di fatturazione. |
customer | L'oggetto cliente contenente gli attributi dell'output del cliente. |
gift_cards | I buoni regalo applicati al momento del check-out. |
gift_cards_amount | L'importo del prezzo del check-out che verrebbe pagato con i buoni regalo. |
transactions | Le transazioni del check-out. |
shareable_url | L'URL del primo prodotto nelle voci. |
shareable_title | Il titolo del prodotto della prima voce. |
total_tip | La mancia totale che il cliente ha aggiunto al momento del check-out. |
discount_applications | Descrive il motivo per cui un articolo è stato scontato al momento del check-out e con quali modalità. |
cart_level_discount_applications | Le applicazioni di sconto specifiche del carrello per il carrello. |
currency | La valuta del check-out abbandonato. |
line_items_subtotal_price | La somma dei prezzi di tutte le voci del check-out, dopo l'applicazione di eventuali sconti per le voci. |
Variabili Liquid per la ricerca abbandonata e le email per i carrelli abbandonati
La variabile abandoned_visit.*
viene compilata solo se un'email fa parte di un'automazione di marketing per il carrello abbandonato o per la ricerca di prodotto abbandonata. Controlla le seguenti proprietà a cui questa variabile dà accesso.
Variabile | Descrizione |
---|---|
abandoned_visit.* |
Questa variabile consente di accedere alle seguenti proprietà di un browser o un check-out abbandonati:
|
Utilizzo delle variabili
Quando crei un'email Liquid personalizzata, la variabile unsubscribe_link
o unsubscribe_url
è obbligatoria. Se hai attivato il monitoraggio dell'apertura, è necessaria anche la variabile open_tracking
.
Anche se queste variabili possono essere inserite in qualsiasi punto del codice del tuo indirizzo email, quello più comune si trova nella sezione footer di un'email, come nell'esempio seguente:
<div id="footer">{{ unsubscribe_link }} {{ open_tracking_block }}</div>
Esempio di codice Liquid personalizzato
Puoi aggiungere HTML e Liquid personalizzati nell'editor di codice. Il seguente codice mostra un esempio di come aggiungere il codice Liquid per visualizzare il nome del negozio, un pulsante personalizzato e un'immagine di dimensioni personalizzate in un messaggio email.
<!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>