Tilpas dine Shopify Email-kampagner ved hjælp af Liquid
Liquid er Shopifys enkle og brugervenlige programmeringssprog og det samme programmeringssprog, som temaerne fra Shopifys temabutik er udviklet med.
Du kan bruge tilpasset Liquid til at forbedre dine Shopify Email-beskeder ved at oprette en mail med fuldt ud tilpasset kode, eller ved at føje et tilpasset Liquid-afsnit til en skabelon. Disse giver dig mulighed for at indtaste tilpasset Liquid eller HTML.
Du kan bruge tilpasset Liquid til at vise tilpassede aktiver, som f.eks. billeder side om side, tilpassede knapper, billeder i tilpasset størrelse og tilpassede afsnitsstørrelser.
På denne side
Overvejelser
Gennemgå følgende overvejelser, før du begynder at føje tilpasset Liquid til dine Shopify Email-mails:
- De variabler, som du inkluderer i din kode, skal understøttes af tilpasset Liquid.
- Du kan kun bruge en computer til at oprette et tilpasset Liquid-afsnit.
- Variablen
unsubscribe_link
ellerunsubscribe_url
er påkrævet i tilpassede Liquid-mails. Hvis du har aktiveret sporing af åbninger, er variablenopen_tracking
også påkrævet. Få mere at vide om, hvordan du føjer påkrævede variabler til din mail. - Du kan indsætte kode med følgende begrænsninger: - Højst 50 kilobyte (KB) for afsnit med tilpasset Liquid-kode. - Højst 500 KB for mails med tilpasset Liquid-kode.
Liquid-variabler, der understøttes i tilpasset Liquid-kode
Du kan bruge understøttede variabler til at tilpasse dine Shopify-e-mail-beskeder med Liquid. Du kan gennemgå listerne over understøttede Liquid-variabler for følgende typer skabeloner:
- Alle mailskabeloner
- Mailskabeloner om forladt betaling
- Mailskabeloner om forladt browsing og forladt indkøbskurv
Liquid-variabler, der understøttes for alle mailskabeloner
Du kan bruge følgende variabler til at tilpasse alle dine Shopify Email-beskeder med Liquid.
Variabel | Beskrivelse |
---|---|
all_products | Alle produkter i din butik. |
customer.accepts_marketing | Returnerer sand , hvis kunden accepterer markedsføring, og returnerer falsk , hvis ikke. |
customer.addresses | Returnerer alle de adresser, der er knyttet til kunden. |
customer.addresses_count | Returnerer antallet af adresser tilknyttet kunden. |
customer.b2b? | Returnerer true , hvis kunden er en B2B-kunde, og returnerer false , hvis ikke. |
customer.current_location | Returnerer den aktuelt valgte virksomhedsplacering for kunden. |
customer.default_address | Returnerer kundens standardadresse. |
customer.email | Returnerer kundens mailadresse. |
customer.first_name | Returnerer kundens fornavn. |
customer.has_account | Returnerer true , hvis kundens e-mail er tilknyttet en kundekonto, og returnerer false , hvis ikke. |
customer.has_avatar? | Returnerer true , hvis kunden har en avatar tilknyttet sin konto, og returnerer false , hvis ikke. |
customer.id | Returnerer kundens ID. |
customer.last_name | Returnerer kundens efternavn. |
customer.last_order | Returnerer den sidste ordre afgivet af kunden, med undtagelse af testordrer. |
customer.name | Returnerer kundens fulde navn. |
customer.orders | Returnerer alle de ordrer, som kunden har afgivet. |
customer.orders_count | Returnerer det samlede antal ordrer, kunden har afgivet. |
customer.payment_methods | Returnerer kundens gemte betalingsmetoder. |
customer.phone | Returnerer kundens telefonnummer. Telefonnummeret udfyldes kun, hvis kunden brugte et telefonnummer ved betaling, har tilmeldt sig SMS-meddelelser, eller hvis du manuelt har føjet det til deres kundekonto. |
customer.store_credit_account.balance |
Returnerer kundernes saldo for tilgodebeviser i den valuta, der er knyttet til den relevante kontekst. Eksempel:
|
customer.tags | Returnerer tags, der er knyttet til kunden. |
customer.tax_exempt | Returnerer sand , hvis kunden er fritaget fra skatter, og returnerer falsk , hvis ikke. |
customer.total_spent | Returnerer det samlede beløb, kunden har brugt på alle ordrer i din butik. |
email.* |
Denne variabel giver adgang til følgende mailegenskaber: subject viser emnelinjen i mailen.preview_text viser forhåndsvisningen af mailen. |
open_tracking | Denne variabel giver adgang til den forudformaterede blok til sporing af åbninger . Denne variabel er påkrævet, hvis du opretter en kodetilpasset mail og har aktiveret sporing af åbninger. |
shop.* | Denne variabel giver adgang til følgende butiksegenskaber:
name viser butikkens navn.domain viser butikkens primære domæne.url viser butikkens webadresse.shopify_domain viser Shopify-domænet.
|
unsubscribe_url | Denne variabel giver adgang til den rå afmeldingswebadresse og kan tilgås. Hvis du opretter en brugerdefineret mail, skal du inkludere variablen unsubscribe_url eller unsubscribe_link . Både unsubscribe_url og unsubscribe_link vil altid pege på det primære online og kan ikke ændres til at pege andre steder hen. |
Liquid-variabler, der understøttes for mails om forladt betaling
Du kan bruge følgende variabler til at tilpasse dine Shopify Email-beskeder om forladt betaling med Liquid.
Variabel | Beskrivelse |
---|---|
abandoned_checkout.* |
Denne variabel giver adgang til følgende egenskaber for en forladt betaling:
|
id(checkout ID) | Et entydigt id for betalingsprocessen til intern brug. |
shop | Dit Shopify-butiksnavn. |
name | Navnet på den forladte betaling, også kaldet “betalingsnummeret”. |
total_price | Den samlede pris for ordren (subtotal + leveringsomkostninger – leveringsrabat + skat). |
shipping_price |
Leveringsprisen. Eksempel: |
shipping_address | Leveringsadressen. |
billing_address | Faktureringsadressen. |
line_items | En liste over alle varelinjerne i den forladte betaling. |
unavailable_line_items | En liste over alle varelinjer i den forladte betaling, der ikke er tilgængelige. |
note | Bemærkningen, der er knyttet til den forladte betaling. |
landing_site |
Stien til den landingsside, som kunden brugte. Dette er den første side, som kunden tilgik, da vedkommende kom til butikken. Eksempel: |
landing_site_ref |
Udtrækker en referenceparameter fra landingssiden. Referenceparametre kan være: Hvis {% if landing_site_ref == 'my-tracking-token' %} My action... {% endif %} |
referring_site |
Webadressen for den henviser, der førte kunden til din butik. Eksempel: |
created_at | Dato og klokkeslæt, hvor kunden oprettede den betalingsproces, som vedkommende senere forlod. |
closed_at | Dato og klokkeslæt, hvor betalingsprocessen blev lukket. |
customer_locale | Sprogkoden på to eller tre bogstaver for kundens landestandard. Valgfrit: Efterfølges af en områdemodifikator. F.eks. da, en-CA |
item_count | Sum af alle mængder af varen. |
unique_gateways | En liste over unikke betalingsudbydere, der er tilgængelige ved betaling. |
discount | Den rabat, der blev anvendt på indkøbskurven eller en varelinje i den forladte betaling. |
discounts | En liste over rabatter, der blev anvendt på betalingen. |
successfully_applied_discounts | De rabatter, der blev anvendt på betalingen. |
discounts_amount |
Rabatbeløbet for alle rabatter. Eksempel: +5,00 USD |
discounts_savings |
Størrelsen af besparelserne, der er resultatet af alle rabatter. Eksempel: -5,00 USD |
buyer_accepts_marketing | Returneringer sandteller falskafhængigt af om kunden accepterede markedsføring under den forladte betaling. |
subtotal_line_items | De varelinjer, der bruges til at beregne subtotalen ved betaling (ekskl. eventuelle varelinjer for drikkepenge). |
requires_shipping | Returneringer sandthvis der mindst én vare ved betaling, som kræver levering. |
subtotal_price | Subtotalen for varelinjerne ved betaling. |
Den mailadresse, der er knyttet til den forladte betaling. | |
shop_name | Navnet på din butik. |
tax_lines |
Skatterne opdelt efter skattetype: {% for tax_line in tax_lines %} {{ tax_line.title }} ({{ tax_line.rate_percentage }}%) : {{ tax_line.price | money_with_currency }} {% endfor %} |
tax_price | De kombinerede skatter for alle varer i betalingsprocessen. |
attributes |
Eventuelle attributter, som er knyttet til den forladte betaling. Eksempel: |
shipping_method | Oplysninger om den første leveringsmetode, der er tilgængelig ved betaling. |
shipping_methods | De leveringsmetoder, der er tilgængelige ved betaling. |
free | Returneringer sandt hvis den samlede pris ved betaling er nul. |
free_shipping | Returneringer sandthvis betalingsprocessen ikke kræver levering, eller hvis prisen for levering er nul. |
different_billing_address | Returneringer sandteller falskbaseret på, om leveringsadressen er den samme som faktureringsadressen. |
customer | Customer-objektet, der indeholder attributterne for customer-outputtet. |
gift_cards | De gavekort, der blev anvendt ved betaling. |
gift_cards_amount | Beløbet ved betaling, som ville blive betalt med gavekort. |
transactions | Transaktionerne i betalingsprocessen. |
shareable_url | Webadressen for det første produkt i varelinjerne. |
shareable_title | Produkttitlen for den første varelinje. |
total_tip | Det samlede drikkepengebeløb, som kunden tilføjede ved betaling. |
discount_applications | Beskriver, hvorfor og hvordan der blev givet rabat på en vare ved betaling. |
cart_level_discount_applications | De indkøbskurvspecifikke rabattildelinger for indkøbskurven. |
currency | Valutaen for den forladte betaling. |
line_items_subtotal_price | Summen af priserne for alle varelinjer i betalingsprocesen, når eventuelle varelinjerabatter er anvendt. |
Liquid-variabler for mails om forladt browsing og forladt indkøbskurv
Variablen abandoned_visit.*
udfyldes kun, hvis en mail er en del af en markedsføringsautomatisering for forladt indkøbskurv eller forladt produktbrowsing. Gennemgå følgende egenskaber, som denne variabel giver adgang til.
Variabel | Beskrivelse |
---|---|
abandoned_visit.* |
Denne variabel giver adgang til følgende egenskaber for en forladt indkøbskurv eller browsing:
|
Brug af påkrævede variabler
Når du opretter en tilpasset Liquid-mail, er variablen unsubscribe_link
eller unsubscribe_url
påkrævet. Hvis du har aktiveret sporing af åbninger, er variablen open_tracking
også påkrævet.
Selv om disse variabler kan indsættes et vilkårligt sted i koden for din mail, er det mest almindelige sted at tilføje dem i sidefodsafsnittet i en mail, som f.eks. i følgende eksempel:
<div id="footer">{{ unsubscribe_link }} {{ open_tracking_block }}</div>
Eksempel på tilpasset Liquid-kode
Du kan indsætte din tilpassede Liquid- eller HTML-kode i kodeeditoren. Følgende kode er et eksempel på, hvordan du kan tilføje Liquid-kode for at få vist dit butiksnavn, en tilpasset knap og et tilpasset billede i en mailbesked.
<!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>