Legge til en egendefinert Liquid-seksjon for Shopify Email

Skap vekst for virksomheten din

Hvis du trenger hjelp med å opprette tilpasset kode for Shopify Email-meldinger kan du leie inn en Shopify-ekspert.

Ved å legge til en egendefinert Liquid-seksjon kan du legge inn egendefinert Liquid- eller HTML-kode i Shopify Email-meldinger.

Liquid er Shopifys enkle og brukervennlige programmeringsspråk, og er det samme programmeringsspråket som brukes for å bygge temaer fra Shopify Theme Store.

Du kan bruke seksjonen for egendefinert Liquid-kode til å vise egendefinerte ressurser som bilder side om side, tilpassede knapper samt bilder og seksjoner med egendefinerte størrelser.

Hensyn

Gå gjennom følgende vurderinger før du begynner å legge til egendefinert Liquid-kode i Shopify Email-meldinger.

• Variablene du bruker i koden må støttes av seksjonen for egendefinert Liquid-kode.
• Koden du skriver inn kan ikke overstige 50 KB i størrelse.
• Du kan bare bruke en datamaskin til å opprette en seksjon for egendefinert Liquid-kode.

Liquid-variabler som støttes i seksjonen for egendefinert Liquid

Du kan bruke følgende variabler til å tilpasse Shopify Email-meldinger i seksjonen for egendefinert Liquid-kode.

Beskrivelse av Shopify Email-støttede Liquid-variabler

Variabel	Beskrivelse
abandoned_checkout	Denne variabelen gir tilgang til følgende egenskaper for en forlatt kasse: url viser URL-adressen til den forlatte kassen. line_items viser de fem første varelinjene i den forlatte kassen. I tillegg inneholder hvert line_items-objekt følgende egenskaper om hvert produkt: product_title variant_title antall remaining_products_count viser gjenstående antall varelinjer, hvis det er mer enn fem varelinjer i den forlatte kassen. Variabelen abandoned_checkout fylles bare ut hvis en e-post er en del av en markedsføringsautomasjon for forlatt kasse. Ellers vil denne variabelen være null.
abandoned_visit	Denne variabelen gir tilgang til følgende egenskaper for en forlatt handlekurv eller et forlatt besøk: url viser URL-adressen til den forlatte kassen. products_added_to_cart viser de fem første produktvarelinjene som er lagt i handlekurven i det forlatte besøket. I tillegg inneholder hvert products_added_to_cart objekt følgende egenskaper for hvert produkt: tittel image_url variant_title antall products_viewed viser de fem første produktene som ble vist under det forlatte besøket. I tillegg inneholder hvert products_viewed-objekt følgende egenskaper om hvert produkt: tittel beskrivelse image_url url remaining_cart_products_count viser gjenstående antall varelinjer, hvis det er mer enn fem varelinjer i den forlatte kassen. Variabelen abandoned_visit fylles bare ut hvis en e-post er en del av en markedsføringsautomasjon for forlatt handlekurv eller forlatt kikking på produkter. Ellers vil denne variabelen være null.
data.customer.*	Denne variabelen gir tilgang til følgende kundeopplysningsegenskaper: first_name last_name e-post city state land Disse egenskapene kan ikke brukes i Liquid-filtre eller Liquid-betingelser.
email.*	Denne variabelen gir tilgang til følgende e-postegenskaper: subject viser emnefeltet for e-postmeldingen. preview_text viser forhåndsvisningsteksten for e-postmeldingen.
shop.*	Denne variabelen gir tilgang til følgende butikkegenskaper: name viser butikkens navn. domain viser butikkens primære domene. url viser butikkens URL-adresse. shopify_domain viser butikkens Shopify-domene. address viser butikkens adresse, som eksponerer følgende adresseegenskaper: address1 address2 city land telefon province postnummer branding viser butikkens merkevarebygging, som inkluderer følgende egenskaper: 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, som gjengis som en img-tagg direkte.

Eksempel på egendefinert Liquid-kode

Når du har lagt til en seksjon for egendefinert Liquid-kode i e-postmalen kan du legge til egendefinert Liquid- eller HTML-kode i redigeringsprogrammet for kode.

Følgende kode er et eksempel på hvordan du kan legge til Liquid-kode for å vise butikknavn, en tilpasset knapp og et bilde med egendefinert størrelse i en e-postmelding.

<style>
  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#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>