Let op: U hebt deze informatie alleen nodig als u uw eigen sjabloon wilt programmeren of zeer grote wijzigingen wilt aanbrengen aan bestaande sjablonen in de broncode. Deze sjabloontechniek verwijst naar de klassieke editor. Technisch gezien wordt de Classic Editor niet langer ondersteund. We raden u aan uw mailing te maken in onze Nieuwsbriefeditor in de toekomst. Deze editor wordt voortdurend verder ontwikkeld en biedt veel gebruiksvriendelijke functies. Je kunt de sjabloontechniek voor de nieuwsbriefeditor hier vinden. |
Met onze sjabloontechnologie kun je van elke e-mailnieuwsbrief (HTML) een sjabloon maken dat je kunt gebruiken in een Classic editor. Hiervoor moet je speciale sjabloon-tags invoegen in de broncode van je HTML-bestand. Bijna elke tag bestaat uit twee delen - een openend en een sluitend deel. Tussen deze onderdelen kun je standaardtekst invoeren die vooraf wordt ingevuld tijdens het gebruik van de sjabloon en die je vervolgens kunt bewerken. Voor de tags online versie, afmelden en over ons voegt CleverReach automatisch zijn eigen standaardtekst in. Bestaande tekst binnen deze tags wordt volledig genegeerd.
Online versie: | <!--#online_version #--><!--#/online_version#--> |
Nieuwe elementen: | <!--#loop #--><!--#/loop#--> |
Link om af te melden: | <##unsubscribe #--><!--#/unsubscribe#--> |
Wettelijke kennisgeving: | <!--#aboutus #--><!--#/aboutus#--> |
Afbeelding: | <!--#afbeelding #--><!--#/afbeelding#--> |
Link: | <!--#link #--><!--#/link#--> |
HTML-gebied: | <!--#html #--><!--#/html#--> |
Tekstregel: | <!--#text_line #--><!--#/text_line#--> |
Tekstgebied: | <!--#text #--><!--#/text#--> |
Index: | <!--#summary #--><!--#/summary#--> |
Scheidingselement: | <##loopsplit#--> |
Sjabloonelement: | <##my_element name="Name" #--><!--#/my_element#--> |
Stijlen configureren: | data-cr-edit="Naam van Bereichs". |
Stijlen voor aangepaste elementen: | class="bewerkbaar |
Online versie
Met de link naar de online versie geef je ontvangers de mogelijkheid om de e-mail online in hun browser te bekijken.
Voorbeeld met standaardtekst:
<##online_version #-->
Als deze nieuwsbrief niet goed wordt weergegeven, klik dan op <a href="{ONLINE_VERSION}">hier (online)</a>.<>
Belangrijke opmerking: Als u aangepaste inhoud definieert in deze tag, wordt deze overschreven door de standaardtekst van CleverReach. In dit scenario moet je een HTML-gebied definiëren.
Elementen
Met markers in je broncode (loop tag) kun je een nieuw element toevoegen aan je e-mail. Je kunt de Drag & Drop functionaliteit gebruiken om een element te plaatsen in het gebied dat je hebt gedefinieerd met de loop tag.
Voorbeeld met standaardtekst:
<##loop #-->
<h2><!--#text_line #-->Beispiel Titel<!--#/text_line#--></h2><!--#html #-->
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
<!--#/html#-->
<>
Nieuwe elementen kunnen in elk formaat worden toegevoegd. CleverReach biedt een aantal voorgedefinieerde elementen in de editor, maar u kunt ook aangepaste elementen gebruiken voor uw e-mails.
Afmelden
Met de unsubscribe tag voeg je een gebied toe dat een link bevat waarmee de ontvanger zich kan afmelden voor je e-mails.
Voorbeeld met standaardtekst:
<##unsubscribe #-->
<a href="{UNSUBSCRIBE}" >Abmelden</a><>
Belangrijke opmerking: Als u aangepaste inhoud in deze tag definieert, wordt deze overschreven door de standaardtekst van CleverReach. In dit scenario moet je een HTML-gebied definiëren . definieren.
Wettelijke kennisgeving
Met deze tag kun je een juridische kennisgeving toevoegen aan je e-mails.
<##aboutus #-->
<>
Belangrijke opmerking: Als u aangepaste inhoud in deze tag definieert, wordt deze overschreven door de standaardtekst van CleverReach. In dit scenario moet je een HTML-gebied definiëren.
Afbeelding
Gebruik de image tag om een afbeelding in te voegen. De afbeelding kan bewerkt en gelinkt worden.
Voorbeeld met standaardafbeelding:
<midden>
<!--#afbeelding #-->
<>
</center>
Belangrijke opmerking: Als je de afbeelding wilt kunnen centreren in de Classic editor, moet je deze omkaderen met een center tag. Anders kun je alleen kiezen tussen links en rechts uitlijnen.
Link
Gebruik de linktag om een bewerkbare link in te voegen.
Voorbeeld met standaardkoppeling:
<##link #-->
<a href="http://www.ihredomain.de">Link</a><>
Belangrijke opmerking: dit element kan uitsluitend worden gebruikt voor tekstlinks. Als je een afbeelding wilt linken, moet je het element afbeelding gebruiken.
HTML-gebied
Gebruik de HTML-tag om een bewerkbaar HTML-gebied in de editor te plaatsen.
Voorbeeld met standaardtekst:
<#-->
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
<!--#/html#-->
Belangrijke opmerking: Om tekstuitlijning binnen het HTML-gebied (links/rechts/centraal/blok) mogelijk te maken, moet je een blokelement opnemen in je HTML - ofwel een P of een DIV-tag.
Tekstregel
Gebruik de teksttag om een regel tekst in te voegen die bewerkt kan worden (bijvoorbeeld voor koppen). Deze tag staat hyperlinks toe.
Voorbeeld met standaardtekst:
<##text_line #-->
Ik ben een regel tekst die bewerkt kan worden!<>
Tekstgebied
Deze tag kan gebruikt worden om een bewerkbare regel korte tekst in te voegen. De tekst kan niet opgemaakt worden en er is geen hyplerlink-functie.
Voorbeeld met standaardtekst:
<##text #-->
Ik ben een tekstgebied dat kan worden bewerkt!<>
Index
Dit element maakt automatisch een index met interne links naar de individuele artikelelementen die zijn toegevoegd via de Classic editor. Bijna elk nieuw element verschijnt als een apart item in de index. Aangepaste elementen worden standaard weergegeven in de index. Door op de index te klikken kun je afzonderlijke artikelen verbergen door op op het oogsymbool te klikken. Tip: Dit element is al beschikbaar als standaardelement.
Voorbeeld:
<div class="summary">
<!--#summary #-->
<ul>
</ul>
<!--#/summary#-->
</div>
Elementenscheider
Je kunt zoveel bewerkbare elementen als je wilt in een lus plaatsen, ongeacht of het HTML-elementen, afbeeldingen, links of tekstregels zijn. Als je deze elementen wilt kunnen verplaatsen of verwijderen, moet je ze scheiden met de tag loopsplit.
Voorbeeld:
<!--#html #-->Voorbeeldtekst 1<!--#/html#-->
<##loopsplit#-->
<>Voorbeeldtekst 2<!--#/html#--><!--#/loop#-->
Sjabloonelement
Het maken van e-mails met de Classic editor is niet beperkt tot de standaard elementen in CleverReach. Binnen je sjablonen kun je specifieke elementen declareren en invoegen in de editor. Om dit te doen moet je gewoon het gebied in kwestie als een afzonderlijk element markeren.
Voorbeeld:
<##my_element name="Naam Ihres Elementen" #-->
<h2><!--#text_line #-->Titel<!--#/text_line#--></h2> <!--#html #-->Ik ben je eigen element:-)
<!--#/html#-->
<!--#/mijn_element#-->
<!--#loopsplit#-->…
<!--#/loop#-->
Belangrijke opmerking: elk element moet een individuele naam krijgen, anders verschijnt het niet in het overzicht. Deze elementen kunnen worden gebruikt als de bijbehorende sjabloon is geselecteerd voor de e-mail waaraan je werkt. De elementen zijn dus gerelateerd aan een sjabloon. Zorg ervoor dat je het sjabloonelement binnen een lus definieert. Als alternatief kun je naar [E-mails] > [Elementen] gaan in je account en onafhankelijke aangepaste elementen invoegen die beschikbaar zijn in elke sjabloon (aanbevolen).
Stijlen configureren
In de rechterzijbalk van de editor kunt u uw gebieden binnen de sjabloon bewerken, afhankelijk van de gebieden die u zelf hebt gedefinieerd. Via [Ontwerpen] kunt u het gebied in kwestie bewerken. Je kunt ook de stijlen van bepaalde gebieden binnen je eigen sjabloon configureren met behulp van de werkbalk. Om dit in te schakelen kunnen je HTML-elementen (bijvoorbeeld tabellen) de tag cr_edit="Naam van het gebied" bevatten. Je ziet dan de naam in de werkbalk.
Voorbeeld:
<tr>
<td></td>
</tr>
</table>
Stijlen voor aangepaste elementen
Wanneer je de stijlen in je aangepaste elementen bewerkbaar wilt maken, moet je class="bewerkbaar" toevoegen . Ga met de muis over deze elementen en klik op het bewerkingssymbool dat verschijnt om de stijlen te wijzigen.
Voorbeeld:
<tr>
<td></td>
</tr>
</table>
Belangrijke opmerkingen:
- De tags voor de openings- en sluitingslus moeten binnen één gezamenlijke HTML-tag (TD, DIV) met een beperkte breedte worden geplaatst. Een breedte van 100% geeft problemen bij het bewerken van elementen.
- Je kunt geen loop-tags nesten (). Je kunt geen tweede lus invoegen in een lus-tag.
- Als je aangepaste elementen gebruikt, moet je ze altijd maken op basis van HTML-tabellen of DIV-lagen.
- Als uw sjabloon niet voorkomt in uw account, dan bevat de sjabloon geen Wizard-tags of zijn ze onjuist (meer info vindt u hier).
- Als je je eigen sjablonen gebruikt, raden we je aan onze tips en trucs voor HTML-sjablonen te lezen
- CleverReach biedt geen ondersteuning voor aangepaste sjablonen en elementen.