Slik legger du til personaliserte bilder i Iterable
Bruk Handlebars-feltene du allerede sender til Iterable for å tegne et navn, bestillingsdetaljer eller saldo på et bilde for hver bruker.
Legg inn dataene du lagrer i Iterable i bildene som brukerne dine ser.
Iterable-maler henter allerede inn profil- og hendelsesdata ved hjelp av Handlebars. Sendtric Personaliserte bilder tar dette ett skritt videre og tegner disse verdiene inn i et bilde, med dine skrifttyper og ditt oppsett: en grafikk i stil med et boardingkort med brukerens reiserute, eller et bonuskort med den siste saldoen. Bildet opprettes når e-posten åpnes.

Iterables dra-og-slipp-redigeringsverktøy har et dynamisk bildealternativ i bildeblokken som laster inn et bilde fra en URL som inneholder Handlebars, og i den egne dokumentasjonen henvises det til eksterne bildetjenester for å lage disse bildene. Sendtric er en av disse tjenestene: du designer bildet, og URL-en inneholder feltene dine fra Iterable.
Hva du kan gjøre med personaliserte bilder i Iterable
- Reise- og bestillingsoversikter: avreiseby, ankomstby og dato fra en bestilling, presentert i én reisegrafikk. Se personlig tekst på bildene for eksempler.
- Milepæler i appen: «Du har fullført 30 treningsøkter» eller «12 leksjoner fullført» fra et tilpasset profilfelt, i en gratulasjons-e-post.
- Lojalitetsoversikter: poeng, nivå og medlemsnavn på et kortbilde i en månedlig e-post om kundereisen.
- Årsoppsummeringer: flere statistikker fra brukerprofilen på én bakgrunn, en vanlig bruk for e-poster med årsoppsummering.
| Bildefunksjon | Free | Micro | Standard | Makt og næringsliv |
|---|---|---|---|---|
| Tilpassede tekstlag for hvert bilde | 1 | 2 | 4 | 20 |
| Dine egne bildelag (logo, produkt) | No | No | Yes | Yes |
| Enfarget bakgrunn | No | No | Yes | Yes |
| Gjennomsiktig bakgrunn | No | No | No | Yes |
Slik legger du til et personlig bilde i Iterable
Trinn 1: Utform bildet
I Sendtric går du til Bildepersonalisering og klikk på Opprett nytt. Velg en bakgrunn fra mediebiblioteket, eller et ensfarget eller gjennomsiktig lerret, og legg deretter til Dynamisk tekst lag for hver verdi. Tilpass størrelsen på hver tekstboks til den lengste verdien du forventer, siden teksten brytes, men ikke krymper.
Trinn 2: Fyll ut feltet «Iterable» for hvert lag
For hvert «Dynamic Text»-lag må du gi variabelen et navn med små bokstaver Variabelnavn og plasser det itererbare Handlebars-uttrykket i ESP-sammenslåingstag, for eksempel {{firstName}}. Feltene er prosjektspesifikke, så bruk de eksakte navnene du ser på en brukerprofil, inkludert punktnotasjon for nestede felt, for eksempel {{address.city}} hvis byen din ligger inne i et adresseobjekt. Legg til Fallback-tekst for brukere uten en verdi.

Trinn 3: Lagre og kopier koden
Lagre bildet. Kodefeltet vises etter den første lagringen, med hver variabel lagt til i bilde-URL-en og fylt ut med ditt Iterable-uttrykk. Velg justering og klikk på Kopier kode.

Trinn 4: Lim det inn i en HTML-blokk
Åpne Iterable-malen din og klikk på Rediger design. I dra-og-slipp-redigeringsverktøyet drar du en HTML fra Innhold til riktig sted, velg den og lim inn koden i HTML-redigeringsverktøyet. I WYSIWYG- eller Side-ved-Side-redigeringsverktøyet limer du inn koden i kildekoden.

Trinn 5: Forhåndsvisning med ekte brukere
Klikk Forhåndsvisning, skriv inn brukerens e-postadresse (eller bruker-ID) og klikk på Last inn brukerdata for å se bildet med verdiene deres. Prøv en bruker med et langt navn og en med et tomt felt. Send deretter en prøve til deg selv, som fyller ut feltene fra din egen profil.
Bruk av «Image»-blokken i stedet for HTML
Hvis du heller vil beholde en bildeblokk, kopierer du bare adressen inne i src Sendtrics kode, dra inn en bildeblokk , slå på Dynamisk bilde og lim inn adressen i Dynamisk URL. Hvis blokken ser tom ut mens du designer, kan du sjekke den i Forhåndsvisning med brukerdata lastet inn.
Reservealternativer i Iterable eller i Sendtric
Du kan la Sendtrics «Fallback Text» håndtere tomme verdier, eller bruke Iterables hjelpefunksjon inne i taggen, for eksempel {{defaultIfEmpty firstName 'there'}}. Bruk enkle anførselstegn for standardverdien, fordi uttrykket står inne i bildets adresse, som er omgitt av doble anførselstegn. Hvis Iterable angir en standardverdi, vises Sendtrics fallback aldri.
Ofte stilte spørsmål om Personaliserte bilder
Kan jeg bruke hendelsesdata, ikke bare profilfelt?
Ja. Enhver Handlebars-verdi som Iterable kan hente frem når e-posten renderes, kan legges inn i et lag, inkludert felt fra hendelsen som utløste en reise eller kampanje. I Iterables dokumentasjon står det at et hendelsesfelt med samme navn som et profilfelt har forrang, og {{profile.fieldName}} leser profilverdien eksplisitt.
Hva om en verdi inneholder mellomrom eller spesialtegn?
Hvis et felt kan inneholde mellomrom eller tegn som & eller #, må du omslutte det med Iterables urlEncode blokkhjelper, for eksempel {{#urlEncode}}{{city}}{{/urlEncode}}, slik at bildeadressen forblir intakt. Sjekk deretter resultatet i forhåndsvisning.
Hva ser brukere som har et tomt felt?
Når «Fallback Text» er angitt, ser de bare erstatningsteksten, så skriv den som en fullstendig setning. Uten denne innstillingen blir hele laget skjult, inkludert eventuelle ord rundt variabelen.
Kan jeg oppdatere bildet etter at jeg har sendt det?
Ja. Når du lagrer i Sendtric, endres bildet i alle utsendte e-poster fra neste gang de åpnes. De renderte versjonene lagres i hurtigbufferen i omtrent en time per verdikombinasjon, og når du lagrer, slettes dette.
Teller forhåndsvisninger med i antall visninger?
Forhåndsvisninger i Sendtric-redigeringsprogrammet gjør ikke det. Hver gang bildet lastes inn på ordentlig, skjer det – inkludert Iterable-korrekturutskrifter du åpner og gjentatte åpninger.
Denne veiledningen omhandler én del av Sendtrics plattform för e-postpersonalisering . For hvert Personaliserte bilder , se hovedsiden.
Flere Iterable-veiledninger
- Nedtellingstimer - Slik legger du til nedtellingstimer i Iterable
- Nedtellingstimer - Legg til dynamiske tidtakere i Iterable
- Live-avstemninger - Slik legger du til live-avstemninger i Iterable
- Regelbaserte bilder - Slik legger du til regelbaserte bilder i Iterable
- Dynamisk Vær - Slik legger du til dynamisk vær i Iterable
- Kritiske varsler - Slik legger du til kritiske varsler i Iterable
- Teller for sosial bekreftelse - Slik legger du til tellere for sosial bekreftelse i Iterable
Bruker du en annen plattform? Se alle Sendtric-integrasjoner.

