Sådan tilføjer du et tilpasset Liquid-afsnit i Shopify Email

Hvis du tilføjer et tilpasset Liquid-afsnit , kan du indtaste tilpasset Liquid eller HTML i dine beskeder i Shopify Email.

Liquid er Shopifys enkle og brugervenlige programmeringssprog og det samme programmeringssprog, som temaerne fra Shopifys temabutik er udviklet med.

Du kan bruge det tilpassede Liquid-afsnit til at vise tilpassede aktiver, som f.eks. billeder side om side, tilpassede knapper, billeder i tilpasset størrelse og tilpassede afsnitsstørrelser.

Overvejelser

Gennemgå følgende overvejelser, før du begynder at føje tilpasset Liquid til dine beskeder i Shopify Email.

  • De variabler, som du inkluderer i din kode, skal understøttes af afsnittet Tilpasset Liquid.
  • Den kode, du har indtastet, må ikke være større end 50 KB.
  • Du kan kun bruge en computer til at oprette et tilpasset Liquid-afsnit.

Liquid-variabler, der understøttes i afsnittet Tilpasset Liquid

Du kan bruge følgende variabler til at tilpasse dine Shopify-mailbeskeder i afsnittet Tilpasset Liquid.

Beskrivelse af Shopify Email-understøttede Liquid-variabler
Variabel Beskrivelse
abandoned_checkout

Denne variabel giver adgang til følgende egenskaber for en forladt betaling:

  • url viser webadressen for den forladte betaling.
  • line_items viser de første fem varelinjer i den forladte betaling.Derudover indeholder hvert line_items-objekt følgende egenskaber for hvert produkt:
    • product_title
    • variant_title
    • antal
  • remaining_products_count viser antallet af resterende varelinjer, hvis der er mere end fem varelinjer i den forladte betaling.
  • Variablen abandoned_checkout udfyldes kun, hvis en mail er en del af en markedsføringsautomatisering af forladt betaling. Ellers vil variablen være null.

abandoned_visit

Denne variabel giver adgang til følgende egenskaber for en forladt indkøbskurv eller browsing:

  • url viser webadressen for den forladte betaling.
  • products_added_to_cart viser de første fem produktlinjer, der blev lagt i indkøbskurven for det forladte besøg.Derudover indeholder hvert products_added_to_cart-objekt følgende egenskaber for hvert produkt:
    • titel
    • image_url
    • variant_title
    • antal
  • products_viewed viser de første fem produkter, der blev set under det forladte besøg.Derudover indeholder hvert products_viewed-objekt følgende egenskaber for hvert produkt:
    • titel
    • beskrivelse
    • image_url
    • webadresse
  • remaining_cart_products_count viser antallet af resterende varelinjer, hvis der er mere end fem varelinjer i den forladte betaling.
  • Variablen abandoned_visit udfyldes kun, hvis en mail er en del af en markedsføringsautomatisering for forladt indkøbskurv eller forladt produktbrowsing. Ellers vil variablen være null.

data.customer.*

Denne variabel giver adgang til følgende egenskaber for kundedata:

  • first_name
  • last_name
  • mail
  • by
  • status
  • land
  • Disse egenskaber kan ikke bruges i Liquid-filtre eller Liquid-betingelser.

    email.*

    Denne variabel giver adgang til følgende mailegenskaber:

  • subject viser emnelinjen i mailen.
  • preview_text viser forhåndsvisningen af mailen.
  • 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.
    • address viser butikkens adresse med følgende adresseegenskaber:
      • adresse1
      • adresse2
      • by
      • land
      • telefon
      • landsdel
      • postnummer
      • branding viser butikkens branding, hvilket omfatter følgende egenskaber:
        • 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, der gengives direkte som et img-tag.

    Eksempel på tilpasset Liquid-kode

    Når du har føjet et tilpasset Liquid-afsnit til din mailskabelon, kan du tilføje 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.

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

    Er du klar til at begynde at sælge med Shopify?

    Prøv det gratis