Innehållsblock: produkt, rabatt, nedräkning, spårning och mer

I version 1.17 har tretton innehållsblock och två layoutblock lagts till i den visuella byggaren. Alla textfält i dessa block stöder Liquid, vilket innebär att en produkttitel eller ett spårningsnummer kan hämtas från arbetsflödet via {{ variables.xxx }}, och arbetsytan visar varje block renderat med dina testvariabler.

Block tillverkade av delar

Produktkortet, rabattrutan, kundrecensionen, signaturen, videon och blocket för orderspårning är uppbyggda av de grundläggande blocken som du redan känner till, på samma sätt som blocket ”Bild + Text”. Öppna ett av dem så visar inställningspanelen dess delar: en bild, en rubrik, en text, ett pris och en knapp. Klicka på en del för att redigera den med blockets alla inställningar (bildbredd och justering, rubriknivå, formatering av rik text, knappstil och hörnradie); använd ögonikonen för att dölja en del du inte behöver. Under delarna finns inställningarna för själva blocket, till exempel kortlayouten eller ramstilen.

Produkt

Ett produktkort. Delar: bild (ladda upp eller ange en länk, t.ex. {{ variables.product_image }}), titel, beskrivning (dold tills du aktiverar den), pris med ett valfritt jämförelsepris som visas genomstruket samt en knapp. Länken omfattar bilden och titeln; knappen har sin egen länk. Layouten placerar bilden ovanför texten eller bredvid den, med bildens bredd och den vertikala justeringen för raden. Använd den för en utvald produkt i ett beställnings- eller återvinningsmejl.

Pris

En prisrad för sig: priset i fetstil, ett valfritt jämförelsepris som är överstruket framför det, storlek, färg och justering. Det är prisdelen av produktkortet, som finns överallt.

Produktrutnät

Två eller tre kort per rad från en lista i dina variabler, på samma sätt som tabellen med orderrader fungerar. Peka ”List” mot variabeln (till exempel variables.products) och ange sedan namnet på den egenskap som innehåller respektive fält: title, price, compare_at_price, image, url. Varje post blir ett kort med en knapp i den stil och med den hörnradie du väljer; en saknad bild eller länk utelämnas helt enkelt. Fyll i listan från Shopify Flow med ett kodsteg av typen ”Kör” eller med orderns radposter.

Rabattkod

En kodruta med en rubrik, en beskrivning och en knapp som delar, inramad med en streckad, heldragen eller vanlig ram. Två sätt att fylla i den:

• En kod som redan finns: skriv in den (eller en variabel). Knappen länkar till din butik med koden tillämpad vid kassan, såvida du inte anger en egen länk för den.
• Skapa en unik kod för varje e-postmeddelande: appen genererar en engångskod för rabatt i din butik när e-postmeddelandet skickas, med namnet PREFIX-XXXXXX, tillsammans med den procentandel eller det belopp, giltighetstiden i dagar, minimisumman och regeln om en gång per kund som du har ställt in. Koden visas i Historik tillsammans med utskicket, och funktionen ”Skicka igen” för e-postmeddelandet visar samma kod. Ett marknadsföringsmejl får en kod per mottagare.

För att skapa koder krävs behörigheten ”Rabatter”, som blocket begär direkt och som du kan återkalla på sidan Behörigheter (Behörigheter: vad appen kan läsa från din butik). Appen skapar endast koder; den läser, ändrar eller raderar aldrig andra rabatter. I ett testmejl visas en platshållare istället för att en kod skapas.

Nedräkning

En realtidsnedräkning till ett datum och en tidpunkt. I e-postmeddelandet visas en animerad bild som appen renderar när meddelandet öppnas, så nedräkningen sker direkt i inkorgen; en klient som blockerar bilder visar texten bredvid bilden. Parametern ”Ends at” tar emot ett datum med tidszon (2026-12-24T23:59:00+01:00) eller en variabel. Fyra stilar: rutor, vändkort, minimalistisk och text; tre storlekar; egna etiketter och färger; samt en text som ersätter nedräkningen när tiden har gått ut.

Spåra din beställning

Transportör och spårningsnummer, en statusindikator samt två delar: en ”Spåra”-knapp (den öppnar spårningslänken om du inte anger en annan) och en anteckning, till exempel beräknad leveranstid, som är dold tills du behöver den. Leveransstatusen hämtar Shopifys status från Shopify Flow (IN_TRANSIT, OUT_FOR_DELIVERY, DELIVERED och övriga) eller ett stegnummer, och markerar stegen fram till den. Stegetiketterna är dina egna; två till sex stycken.

Stjärnbetyg

Stjärnor utifrån ett tal ({{ variables.rating }}), avrundat till hela stjärnor, där resten är gråmarkerade, med en text bredvid och en valfri länk, till exempel till din recensionssida. Kombinera detta med ett e-postmeddelande där du ber om en recension.

Kundutlåtande

Ett citat och en författartext som textdelar, samt ett valfritt foto, i form av ett kort, med en färgad accentlist eller utan.

Sociala länkar

En rad med nätverksikoner (Instagram, Facebook, X, LinkedIn, YouTube, TikTok, Pinterest och fler), med olika storlek och avstånd. Samma ikoner som används i sidfoten.

Video

E-postmeddelanden kan inte spela upp videor, så det här blocket visar en miniatyrbild med en uppspelningsknapp som länkar till videosidan, samt en valfri bildtext nedanför. Uppspelningsknappen kan vara mörk, ljus eller i företagets färg, och miniatyrbildens höjd och bredd kan anpassas. I Outlook för Windows visas inte miniatyrbilden bakom uppspelningsknappen, men länken fungerar ändå.

Signatur

Ett foto, ett namn (en rubrik) och uppgifterna (en text: befattning, företag, telefonnummer, e-postadress, webbplats), där fotot kan vara runt eller fyrkantigt och placeras till vänster eller ovanför. Standardvärdena är {{ shop.name }} och {{ shop.email }}.

Tabell

En liten datatabell för orderuppgifter eller specifikationer. Varje cell innehåller en variabel, den första raden kan vara en rubrik och raderna kan vara alternerande.

Visa i webbläsaren

Den vanliga raden ”Visa det här e-postmeddelandet i din webbläsare”. Länken öppnar en webbversion av just det e-postmeddelandet, som återges utifrån avsändarens layout och data, och är tillgänglig i 30 dagar. Ett testmeddelande innehåller en länk till layouten med dess testvariabler.

Kolumner

Två, tre eller fyra lika stora kolumner, var och en med sina egna block: tre produktkort bredvid varandra, eller ikoner med en textrad under varje.

Visa om

Ett avsnitt som endast skickas när ett villkor för dina variabler är sant. Skriv villkoret på det sätt som Liquid tolkar det: variables.total > 100, language == "de", variables.tags contains "vip". Canvas utvärderar det med dina testvariabler och dämpar avsnittet när det skulle utelämnas. Placera blocken inuti det på samma sätt som du skulle göra i en kolumn.

Relaterat

• Skapa en e-postlayout - byggverktyget och alla andra block.
• Överföring av data från Shopify Flow - ange värdena.
• Behörigheter: vad appen kan läsa från din butik - behörigheten ”Rabatter”.