Lägga till ett anpassat Liquid-avsnitt för Shopify Email

Få din verksamhet att växa

Om du behöver hjälp med att skapa anpassad kod för dina Shopify Email-meddelanden kan du anlita en Shopify-expert.

Om du lägger till ett anpassat Liquid-avsnitt kan du ange anpassad Liquid eller HTML i dina Shopify e-postmeddelanden.

Liquid är Shopifys enkla och lättanvända programmeringsspråk och är samma programmeringsspråk som teman från Shopifys temabutik är byggda med.

Du kan använda det anpassade Liquid-avsnittet för att visa anpassade tillgångar, till exempel bilder sida vid sida, anpassade knappar, bilder i anpassad storlek och anpassade avsnittsstorlekar.

Överväganden

Granska följande överväganden innan du börjar lägga till anpassad Liquid i dina Shopify e-post-meddelanden.

• Variablerna som du inkluderar i din kod måste stödjas av avsnittet anpassad Liquid.
• Koden du anger får inte vara större än 50 KB.
• Du kan bara använda en stationär enhet för att skapa ett anpassat Liquid-avsnitt.

Liquid-variabler stöds i det anpassade Liquid-avsnittet

Du kan använda följande variabler för att anpassa dina Shopify-e-postmeddelanden i det anpassade Liquid-avsnittet.

Beskrivning av Liquid-variabler som stöds av Shopify e-post

Variabel	Beskrivning
abandoned_checkout	Denna variabel ger åtkomst till följande egenskaper för en övergiven varukorg: url visar URL för den övergivna varukorgen. line_items visar de första fem posterna i den övergivna varukorgen.Dessutom innehåller varje line_items objekt följande egenskaper för varje produkt: product_title variant_title kvantitet remaining_products_count visar återstående radobjektantal om det finns fler än fem radobjekt i den övergivna varukorgen. Variabeln abandoned_checkout fylls endast i om ett e-postmeddelande är en del av en automatiserad marknadsföringsautomatisering för övergiven varukorg. Annars kommer variabeln att vara null.
abandoned_visit	Denna variabel ger åtkomst till följande egenskaper för en övergiven varukorg eller bläddra: url visar URL för den övergivna varukorgen. products_added_to_cart visar de fem första produktradsartiklarna som lagts till i varukorgen vid det övergivna besöket.Dessutom innehåller varje products_added_to_cart/objekt följande egenskaper för varje produkt: Titel image_url variant_title kvantitet products_viewed visar de första fem produkterna som visades under det övergivna besöket.Dessutom innehåller varje products_viewed objekt följande egenskaper för varje produkt: Titel beskrivning image_url url remaining_cart_products_count visar återstående radobjektsantal om det finns fler än fem radobjekt i den övergivna varukorgen. Variabeln abandoned_visit fylls endast i om ett e-postmeddelande är en del av en övergiven varukorg eller en övergiven produkt som bläddrar i marknadsföringsautomation. Annars kommer variabeln att vara null.
data.customer.*	Variabeln ger åtkomst till följande egenskaper för kunddata: förnamn efternamn e-post stad delstat land Dessa egenskaper kan inte användas inuti Liquid-filter eller Liquid-villkor.
email.*	Den här variabeln ger åtkomst till följande e-postegenskaper: subject visar ämnesraden i e-postmeddelandet. preview_text visar förhandsgranskningstexten i e-postmeddelandet.
shop.*	Den här variabeln ger åtkomst till följande butiksegenskaper: name visar butiksnamnet. domain visar butikens huvuddomän. url visar butikens URL. shopify_domain visar butiekns Shopify-domän. address visar butiksadressen, vilket utsätter följande adressegenskaper: adress1 adress2 stad land telefon provins postnummer branding visar butiksvarumärket, vilket innehåller följande 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 återges direkt som en img/tagg.

Exempel på anpassad Liquid-kod

När du har lagt till ett anpassat Liquid-avsnitt i din e-postmall kan du lägga till din anpassade Liquid eller HTML i kodredigeraren.

Följande kod är ett exempel på hur du kan lägga till Liquid-kod för att visa ditt butiksnamn, en anpassad knapp och en anpassad bild i ett e-postmeddelande.

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