Under menupunktet Skabeloner finder du de HTML-skabeloner, der er oprettet i Heyloyalty.
I denne guide lærer du, hvordan du tilpasser logoet i en eksisterende HTML-skabelon. Hvis du først skal oprette en skabelon, kan du læse vores guide til standard-HTML-skabeloner.
Bemærk: Hvis du vil lave mere komplekse ændringer i HTML-skabelonen, anbefaler vi, at du får hjælp fra en udvikler. Du bør kun selv foretage større ændringer, hvis du har erfaring med HTML-kode.
Billeder til denne guide vil komme senere.
Justér logoet i din skabelon
Før du kan ændre logoet i din skabelon, skal du uploade det nye logo til mediearkivet i Heyloyalty. Upload logoet, og kopiér derefter URL’en til billedet. Du skal bruge URL’en, når du redigerer HTML-koden i skabelonen.
Gå til Skabeloner i Heyloyalty. Find den skabelon, du vil tilpasse. Klik på de tre prikker ud for skabelonen, og vælg Rediger skabelon.
Vi anbefaler, at du kopierer hele indholdet fra skabelonen og indsætter det i et tekst-/notesprogram, hvor du nemmere kan søge i HTML-koden. Søg efter ordet logo. Find følgende kommentar i koden: <!-- start logo -->. Under denne kommentar finder du det img-tag, der indeholder logoet. Her skal du finde src-attributten, som indeholder URL’en til det nuværende logo. I eksemplet nedenfor er det URL’en efter src=", du skal erstatte med URL’en til dit nye logo. (Den er markeret med fed.)
<!-- start logo -->
<table width="720" cellpadding="0" cellspacing="0" border="0" class="fullWidth" bgcolor="#FFFFFF">
<tr>
<td height="25" style="font-size:25px; line-height:25px; height:25px;"> </td>
<!-- Spacer -->
</tr>
<tr>
<td width="720" class="wrapper" align="center">
<a href="https://heyloyalty.com/" target="_blank">
<img src="https://images.heyloyalty.dk/uploads/media_image/18011/image/Heyloaylty_logo_orange.png" width="180" style="margin:0; padding:0; border:none; display:block;" border="0" alt="heyloyalty" />Bemærk: Sørg for kun at erstatte URL’en mellem anførselstegnene. Undgå at ændre resten af img-tagget, medmindre du har erfaring med HTML.
Når du har udskiftet URL’en til logoet, anbefaler vi, at du opretter en ny skabelon med den tilpassede HTML-kode. På den måde undgår du at overskrive din eksisterende skabelon.
Når du har gemt den nye skabelon, kan du kontrollere ændringen i previewet og sikre dig, at det nye logo vises korrekt.
Tilpasning af sociale ikoner i skabelonen
Du kan også tilpasse de sociale ikoner i din HTML-skabelon. Du kan både udskifte selve ikonerne og ændre de links, som modtageren sendes videre til, når der klikkes på dem.
Start med at uploade de ikoner, du vil bruge, til mediearkivet i Heyloyalty. Kopiér URL’en til hvert ikon, så du har dem klar, når du skal tilpasse HTML-koden.
Gå til Skabeloner i Heyloyalty. Find den skabelon, du vil tilpasse. Klik på de tre prikker ud for skabelonen, og vælg Rediger skabelon.
Vi anbefaler, at du kopierer hele indholdet fra skabelonen og indsætter det i et tekst-/notesprogram, hvor du nemmere kan søge i HTML-koden. Søg efter navnet på det sociale medie, du vil tilpasse, for eksempel Facebook eller Twitter. Tæt på fx <!– Facebook link finder du både linket til det sociale medie og URL’en til det ikon, der vises i skabelonen. I eksemplet nedenfor er det URL’en efter src=", du skal erstatte med URL’en til ikonet, og efter href=” skal du tilføje den URL, modtageren skal sendes hen til, når vedkommende klikker. Begge URL’er er markeret med fed.
<!-- Facebook link: Change "href" to the url of your Facebook page -->
<a href="https://www.facebook.com/" target="_blank">
<!-- Facebook image: Change "src" if you want a different image -->
<img src="https://img.heyloyalty.com/heyloyalty1/system%2Ffacebook" width="50" style="margin:0 auto; padding:0; border:none; display:block;" border="0" alt="facebook" />
</a>
</td>
<td width="300" class="mobile50" style="font-family:arial; font-size:12px; line-height:18px;" align="center">
<!-- Twitter link: Change "href" to the url of your Twitter page -->
<a href="https://twitter.com/" target="_blank">
<!-- Twitter image: Change "src" if you want a different image -->
<img src="https://img.heyloyalty.com/heyloyalty1/system%2Fx" width="50" style="margin:0 auto; padding:0; border:none; display:block;" border="0" alt="twitter" />
Bemærk: Udskift kun URL’en mellem anførselstegnene. Ændr ikke resten af src og href-tagget, medmindre du har erfaring med HTML.
Når du har udskiftet URL’en til ikonet, anbefaler vi, at du opretter en ny skabelon med den tilpassede HTML-kode. På den måde undgår du at overskrive din eksisterende skabelon.
Når du har gemt den nye skabelon, kan du kontrollere ændringen i previewet og sikre dig, at det nye ikon vises korrekt.
Ændr USP’er i skabelonen
Hvis din HTML-skabelon indeholder 1 til 3 USP’er, kan du ændre teksten på dem direkte i skabelonens HTML-kode. Det gør du ved at gå til Skabeloner i Heyloyalty. Gå til Skabeloner i Heyloyalty, og find den skabelon, du vil tilpasse. Klik på de tre prikker ud for skabelonen, og vælg Rediger skabelon.
Vi anbefaler, at du kopierer hele HTML-koden fra skabelonen og indsætter den i et tekstprogram eller noteprogram. Her kan du nemmere søge efter den tekst, du vil ændre. Søg efter et par ord fra den USP, du vil ændre. På den måde kan du finde den relevante tekst i HTML-koden. Hvis der for eksempel står Gratis fragt over 499 i din USP, kan du søge efter denne tekst i programmet.
Når du har fundet teksten, erstatter du den med den nye tekst, du ønsker at vise. I eksemplet nedenfor er de tre USP’er, der skal ændres i skabelonen, markeret med fed:
<!-- Start USPs -->
<table width="760" cellpadding="0" cellspacing="0" border="0" class="fullWidth" bgcolor="#ffffff">
<tr>
<td align="center">
<!-- Start Container -->
<table width="660" cellpadding="0" cellspacing="0" border="0" class="fullWidth">
<tr>
<th width="220" class="mobileFull" style="font-family: Georgia, 'Times New Roman', Times, serif, Arial, sans-serif; color:#000000;font-size:14px;text-decoration:none; font-weight:normal;" align="center">
✔ Gratis fragt over 499,-
</th>
<th width="220" class="mobileFull paddingTop10" style="font-family: Georgia, 'Times New Roman', Times, serif, Arial, sans-serif; color:#000000;font-size:14px;text-decoration:none; font-weight:normal;" align="center">
✔ Dag til dag levering
</th>
<th width="220" class="mobileFull paddingTop10" style="font-family: Georgia, 'Times New Roman', Times, serif, Arial, sans-serif; color:#000000;font-size:14px;text-decoration:none; font-weight:normal;" align="center">
✔ Afhent i butik inden for 2 timer
</th>
</tr>
</table>Bemærk: Udskift kun selve teksten på USP’en. Du bør ikke ændre indholdet i < >, medmindre du har erfaring med HTML.
Når du har udskiftet teksten på USP’erne, anbefaler vi, at du opretter en ny skabelon med den tilpassede HTML-kode. På den måde undgår du at overskrive din eksisterende skabelon.
Når du har gemt den nye skabelon, kan du kontrollere ændringen i previewet og sikre dig, at det nye ikonet vises korrekt.
Tilpas adresse i footeren i skabelonen
Hvis adressen i footeren på din HTML-skabelon skal ændres, kan du rette den direkte i skabelonens HTML-kode. Gå til Skabeloner i Heyloyalty, og find den skabelon, du vil tilpasse. Klik på de tre prikker ud for skabelonen, og vælg Rediger skabelon.
Vi anbefaler, at du kopierer hele HTML-koden fra skabelonen og indsætter den i et tekstprogram eller noteprogram. Her kan du nemmere søge efter den nuværende adresse og finde det relevante sted i HTML-koden.
Søg efter hele eller dele af den adresse, der vises i footeren. Hvis der for eksempel står Nyvej 89, kan du søge efter denne tekst i programmet. Når du har fundet adressen, erstatter du den med den nye adresse, der skal vises i footeren. I eksemplet nedenfor er adressen, der skal ændres, markeret med fed:
<br style="display: none;" class="mobileOn" /> <a href="https://heyloyalty.com" style="font-family: Georgia, 'Times New Roman', Times, serif, Arial, sans-serif; color:#000000; font-size:14px; font-weight:normal; line-height:18px; text-decoration:none;">Nyvej 89</a>I ovenstående eksempel skal Nyvej 89 erstattes med den nye adresse.
Bemærk: Udskift kun selve adressen. Du bør ikke ændre den øvrige HTML-kode eller indholdet i < >, medmindre du har erfaring med HTML.
Når du har ændret adressen, anbefaler vi, at du opretter en ny skabelon med den tilpassede HTML-kode. På den måde undgår du at overskrive din eksisterende skabelon.
Når du har gemt den nye skabelon, kan du kontrollere ændringen i previewet og sikre dig, at den nye adresse vises korrekt i footeren.
Gør din HTML-skabelon til din egen
Med få tilpasninger kan du få din HTML-skabelon til at passe bedre til din virksomhed og dit visuelle udtryk. Når logo, sociale medier, USP’er og kontaktoplysninger er på plads, har du en skabelon, som er klar til at danne grundlag for dine kommende udsendelser.
Husk altid at kontrollere dine ændringer i previewet, inden du tager skabelonen i brug. Derudover anbefaler vi, at du tester skabelonen både på desktop og på mobil for at se, om skabelonen viser layoutet korrekt på forskellige enheder. Når du tester din skabelon, er du sikker på, at indholdet vises, som du ønsker.