Så här lägger du till streckkoder i dina meddelanden

Du kommer att lära dig

Läs mer om hur du använder {% barcode %} -etiketten för att skapa Code 128 -streckkoder i dina e-postmeddelanden, mms-, RCS- och WhatsApp-meddelanden. Streckkodsvärdet kan vara en statisk sträng, en profilegenskap, en händelsevariabel eller en Klaviyo-kupongkod.

Snabbreferens

Innan du börjar

Etiketten {% barcode %} fungerar genom att generera en URL. När den URL:en läses in (i en förhandsgranskning, en inkorg eller på en mobil enhet) renderar den en PNG-bild av streckkoden. Det innebär att streckkodsbilden inte skapas förrän URL:en faktiskt hämtas.

Etiketten {% barcode %} stöds i:

• E-post
• Mms
• RCS
• WhatsApp

Grundläggande användning

Det enklaste sättet att använda streckkodsetiketten är:

{% barcode 'MyCode' %}

Detta genererar en URL som returnerar en PNG-bild av en streckkod. När den skannas innehåller streckkoden värdet MyCode.

Du kan anpassa streckkoden genom att skicka argument till etiketten. Till exempel:

{% barcode 'MyCode' width=200 height=100 %}

Se avsnittet med argumentreferensen nedan för alla tillgängliga alternativ.

Använda streckkoder med olika kanaler

E-post

För e-post har du två alternativ för hur streckkoden renderas:

Alternativ 1: HTML-läge (rekommenderas för e-post)

Ställ in mode=html så att etiketten matar ut ett HTML- <img> -element direkt. Det här är den enklaste metoden för att inkludera en streckkod i ett e-postmeddelande.

{% barcode 'MyCode' mode=html %}

Placera den här etiketten i ett textblock eller HTML-block i e-postmallredigeraren.

Alternativ 2: URL-läge

Lämna läget oinställt (eller ställ in mode=url) för att få en URL och placera sedan den URL:en i ett bildblocks fält för bild-URL. Detta ger dig mer kontroll över bildens formatering.

{% barcode 'MyCode' %}

Mms

För mms-meddelanden lägger du till streckkodsetiketten i avsnittet Dynamisk bild i SMS/MMS-redigeraren, inte i textinnehållet.

1. Öppna ditt mms-meddelande i redigeraren.
2. Klicka på ikonen Lägg till bild i meddelanderutan.
3. Gå till fliken Dynamisk bild.
4. Klistra in din streckkodsetikett, till exempel:

{% barcode person.LoyaltyId %}

1. Klicka på Spara.

Detta följer samma process som att lägga till en dynamisk bild i ett mms. Mer information finns i Så lägger du till en dynamisk bild i ett textmeddelande.

RCS

För RCS-meddelanden använder du mode=rcs för att formatera streckkoden enligt RCS-bildkraven. Det här läget ställer automatiskt in dimensioner som visas korrekt på både Android och iOS.

{% barcode 'MyCode' mode=rcs %}

Lägg till streckkodsetiketten i avsnittet Dynamisk bild i RCS-meddelanderedigeraren, på samma sätt som du skulle göra för mms.

RCS-standardinställningar:

• Bredd: 600 px
• Höjd: 300 px
• Utfyllt till: 1440x720 px

Dessa standardinställningar följer Klaviyo rekommendationer för RCS-bildformatering. Du kan åsidosätta dem med anpassade width, height, padded_width och padded_height -värden om det behövs.

WhatsApp

För WhatsApp-meddelanden lägger du till streckkodsetiketten i avsnittet Dynamisk bild i meddelanderedigeraren, på samma sätt som du skulle göra för mms.

{% barcode person.MembershipId %}

Ingen särskild konfiguration eller något särskilt läge behövs för WhatsApp. Standardinställningen mode=url fungerar korrekt.

Referens för argument för streckkodsetikett

Använda streckkoder med profilegenskaper och händelsedata

Du kan använda profilegenskaper eller händelsevariabler som streckkodsvärde, så att varje mottagare får en unik streckkod.

Exempel på profilegenskaper:

{% barcode person.LoyaltyId %}
{% barcode person.email %}
{% barcode person.MembershipNumber %}

Exempel på händelsevariabler (för mättalsutlösta flöden):

{% barcode event.Code %}
{% barcode event.OrderId %}

Hantera saknade värden:

Om en mottagare inte har egenskapen inställd blir streckkodsadressen ogiltig och bilden laddas inte. Du har två alternativ:

Alternativ 1: Använd ett default filter för att ställa in ett meningsfullt reservvärde:

{% barcode person.BarcodeCode|default:'STORE-MEMBER' %}

Se till att standardvärdet är ett värde som är rimligt om det skannas. En generisk platshållare som ”fallback” skulle ge en skanningsbar men värdelös streckkod.

Alternativ 2: Använd en villkorssats för att dölja streckkoden helt när värdet saknas:

{% if person.BarcodeCode %}
  {% barcode person.BarcodeCode mode=html %}
{% endif %}

Kombinerat exempel för e-post:

{% barcode person.LoyaltyId width=200 height=75 mode=html %}

Använda streckkoder med Klaviyo-kupongkoder

Om du använder Klaviyo-hanterade Kupongkoder och vill rendera dem som streckkoder ställer du in coupon=True. Detta gör att systemet tilldelar en Kupongkod till mottagaren och använder den koden som streckkodsvärde.

{% barcode 'ShopifyCoupon' coupon=True %}

Detta fungerar i alla kanaler. Till exempel, för att skicka en kupongstreckkod via RCS:

{% barcode 'ShopifyCoupon' coupon=True mode=rcs %}

{% barcode person.CouponCode %}

Skalning och storleksanpassning

Som standard skalas streckkodens bredd och höjd med en faktor på 3×. Detta innebär följande:

• En width av 100 renderas med en faktisk bredd på 300px
• A height of 50 återges med 150px faktisk höjd

Undantag: När mode=rcs är skalfaktorn 1x. Detta ger mer exakt kontroll över streckkodsdimensionerna så att de passar RCS-bildformateringskraven.

Utfyllnadsvärden skalas inte. Argumenten padded_width och padded_height representerar alltid faktiska pixelvärden. Eftersom den inre streckkoden är skalad med 3x måste dina utfyllnadsvärden vara större än 3 gånger bredden och höjden. Till exempel:

{% barcode 'Code' width=200 height=100 padded_width=700 padded_height=400 %}

Här återges streckkoden i 600 × 300 px (200 × 3, 100 × 3) inom en vadderad arbetsyta på 700 × 400 px.

Maximal bildstorlek: Streckkodstjänsten genererar inte bilder som är större än 4096x4096 pixlar. Den här gränsen gäller den renderade storleken efter skalning. För streckkoder som inte är RCS (3× skalning) innebär det att det maximala argumentet för width är ungefär 1365 (1365 × 3 = 4095 px). För RCS-streckkoder (1x skalning) är maxgränsen 4096.

Riktlinjer för bredd för Långnummer:

• För streckkoder som inte är RCS: om din kod är längre än 15 tecken, öka bredden till mer än standardvärdet 100 (som renderas som 300 px).
• För RCS-streckkoder: om din kod överskrider 30 tecken ska du öka bredden utöver standardvärdet 600 px.

Om bredden är för smal för att koda data kan streckkodsbilden inte genereras.

Felsökning

Förhandsgranska alltid innan du skickar

Eftersom {% barcode %} -etiketten skapar en URL vid rendering och bilden inte genereras förrän den URL:en hämtas kanske fel inte blir uppenbara förrän du förhandsgranskar eller skickar meddelandet. Följ de här stegen för att upptäcka problem tidigt:

1. Förhandsgranska meddelandet. Om streckkoden inte laddas i förhandsgranskningen kommer den inte att laddas när den skickas.
2. Skanna streckkoden. Använd ett verktyg för att skanna streckkoder (t.ex. imagetotext.info/barcode-scanner) för att verifiera att streckkoden kodar det förväntade värdet.
3. Skicka ett testmeddelande till dig själv innan du skickar till din målgrupp.

Vanliga problem

Streckkodsbilden läses inte in

Den vanligaste orsaken är ett tomt streckkodsvärde. Det här händer när etiketten refererar till en profilegenskap eller en händelsevariabel som mottagaren inte har. Till exempel:

{% barcode person.BarcodeCode %}

Om mottagaren inte har något BarcodeCode -värde kommer den genererade webbadressen att sakna koden och bilden kommer inte att renderas. För att åtgärda detta lägger du till ett default -filter:

{% barcode person.BarcodeCode|default:'defaultCode' %}

Streckkodsbilden kan inte genereras men URL:en ser korrekt ut

Streckkodens bredd är sannolikt för smal för att koda in all data i din kod. Försök att öka värdet width. Som en tumregel:

• Koder som är längre än 15 tecken behöver en större bredd än standardvärdet 100 (återges som 300 px).
• RCS-koder med över 30 tecken behöver en bredd som är större än standardvärdet 600 px.

Streckkoden visas inte i ett textblock (e-post)

Kontrollera om textblocket har logik för att visa/dölja. Om ett villkor döljer blocket renderas inte streckkoden även om etiketten är korrekt. Öppna blockets inställningar för att kontrollera.

Ytterligare resurser

• Komma igång med Kupongkod i Klaviyo – Lär dig hur du skapar och hanterar kupongkoder, inklusive hur du använder den äldre {% barcode_code %} -etiketten för kupongstreckkoder i e-post.
• Så här lägger du till en dynamisk bild i ett textmeddelanden – Lär dig hur du lägger till dynamiska bilder i mms-meddelanden, inklusive var du hittar avsnittet Dynamisk bild i redigeraren.
• Referens för meddelandepersonalisering – Referens för alla personaliseringstagg som finns i Klaviyo, inklusive profilegenskaper, händelsevariabler och filter.
• Förstå bästa praxis för mms-bilder och GIF – Bästa praxis för bildstorlek och formatering i mms-meddelanden.