In dit artikel een tot in de puntjes uitgedacht Mailchimp template. Je kunt hiermee een Mailchimp template zelf maken. Het thema gaat uit van kennisdeling op basis van zichtbare thema’s, zodat je per nieuwsbrief bijvoorbeeld 3 thema’s laat zien. Alle plaatjes die je nodig hebt, kun je downloaden. Waarbij het nog aan jouw creativiteit ligt om de plaatjes opmaak te geven via gratis infographic tools of Photoshop.

Doordat ik je dit Mailchimp template aanbied, is een Mailchimp ontwerper inhuren niet nodig. Je hebt nu alle juiste elementen en maten gevonden. Ook de pixelmaten van witruimten (dividers e.d.) kun je letterlijk overnemen uit dit standaard mailchimp template met thema’s.

Bijgaand Mailchimp nieuwsbrief ontwerp gaat uit van een nieuwsbrief opzet voor projecten in de non-profit. Er is ook plek voor plaatsen van logo’s van partners in de footer.

Ps. Voor 20 Euro kan ik je het template ook sturen via ‘Mailchimp sharing’; dan kun je makkelijker verder mee. Mail nu naar Gerben.

free-template-mailchimp-handleiding-Nederlandstalig-2020

Voorbeeld Mailchimp template. Met de bouwstenen op deze pagina kun je zelf een Mailchimp template maken waarbij elk bericht een themaplaatje (balk) heeft. Voor Euro 15 Euro kan ik je het template ook sturen. Mail nu naar Gerben.

Mailchimp template maken / zelf je Mailchimp nieuwsbrief ontwerpen

Volg deze stap-voor-stap Mailchimp Nieuwsbrief opzet voor de non-profit. De volgende elementen passen in je nieuwsbrief ontwerp.

Binnen Mailchimp kun je campagnes aanmaken. Een campagne is een versie van je nieuwsbrief. Alvorens je dit kunt doen, moet je onder “Brand”, je merkontwerpen, eerst een template aanmaken voor je nieuwsbrief dat je vaker kunt aanroepen. Je Mailchimp nieuwsbriefontwerp sla je op in Saved Templates uiteindelijk. Dus creëer eerst je standaard email template door naar “Brand/Merk” te gaan.

Onderdelen nieuwsbrief template, 1 t/m 27 Mailchimp elementen

De opbouw van je Mailchimp nieuwsbrief, kun je hier zien.

16 elementen nieuwsbrief non-profit

 

arbo werkplek inrichten thuis bol com kopen

 

Waarbij de volgorde van boven naar beneden gaat. Alle elementen worden genoemd. Waar nodig, zie je wat je kunt oploaden. Ik ga er daarbij van uit dat je elk plaatje zelf van een afbeelding voorziet / dus opmaakt. Dit kan in gratis software zoals Infographic software Canva of Visme, via gratis Photo editor, dan wel via Adobe Photoshop.

1. TEXT blok met link: “Bekijk deze nieuwsbrief in je browser”

En de Mailchimp instellingen voor deze strook met klikbare tekst.

Dit blok zit al in Mailchimp. Dit zijn de instellingen, HTML code luidt:
Open <> om deze code te kunnen inplakken:
<a href=”*|ARCHIVE|*” target=”_blank”>Bekijk deze nieuwsbrief in je browser</a>

 

 

Vormgeving instelling:

  • 1 column element

2. IMAGE blok voor headerafbeelding

Ik geef hier 2 standaardmaten voor een headerfoto in Mailchimp. Groot als je een header met smoel wilt gebruiken, met logo en echte foto voor imago. Maten hieronder. Je kunt ook zakelijker, met ondiepere header in huis vallen, zodat mensen het eerste bericht sneller zien. Een foto zoeken kan via een gratis of betaalde fotobank. Ga voor een catchy foto in je header die niet te vol/druk is, maar wel de kern overbrengt.

Header hoog (1200 – 589 px):

mailchimp header maat hoog

Mailchimp header maat hoog voor met foto en logo erin. Header hoog 1200 – 589 px logo met daarbij echte foto, let erop om onderstrook wit te laten (8 pixels hoog)

 

 

Header ondiep (1200×340):

mailchimp header maat laag voor alleen logo erin

Mailchimp header maat laag voor alleen logo erin. Header laag 1200 – 340 pixels (logo en woord nieuwsbrief en kleurvlakken e.d.)

3. TEXT blok, 1 kolom. Mailchimp instellingen: strook met daarin de publicatiedatum

Open <> om deze code te kunnen inplakken:

<h3 class=”null” style=”text-align: right;”><em>zomer 2020</em></h3>
(op regel 2 witruimte, geen tekens erin zetten maar rij wel open laten, regel 2 bestaat dus)

 

 

Style/Settings:

  • no font specified
  • no size
  • no color
  • no styles
  • no align
  • no line height
  • 1 column

4. TEXT blok voor kernboodschap over project (1 kolom)

Kernzin/kernboodschap: introductie nieuwsbrief door te openen met uitleg of slogan over wat het project inhoudt of beoogt.

De in te voeren HTML en de benodigde instellingen voor vormgeving, volgen nu.

 

Voeg 1 column element toe. Open <> om deze code te kunnen inplakken:

<h4 class=”null”><strong><em>Samen aan de slag voor een betere toekomst.</em></strong></h4>

Style/Settings:

  • no font specified
  • – no size
  • no color
  • – no styles
  • no align
  • – no line height
  • 1 column

N.B. Doordat zojuist een <h4> kop gebruikt is, geeft dit wat witruimte erna. Dit is de reden dat hierna geen witruimte devider nodig is. Maar in de rest van dit gratis Mailchimp template gaat een divider (14 pixels) vooraf aan de Thema aanduiding (zie element 5. hieronder). Dit om enige witruimte toe te voegen om elementen visueel beter en mooier te scheiden.

 

 

5. IMAGE blok. Themastrook 1 (plaatje)(1200×140)

Voeg element toe waar plaatje in kan. 1 column.

Thema streamer mailchimp nieuwsbrief template maken

Thema strook, icoon links erin, rechts de verklarende tekst. 1200 x 140 pixels.

Style/Setting (1200×140)

  • border none
  • center

6. IMAGE+TEXT blok. Eerste bericht (plaatje rechts, tekst links)(600x400px)

Voeg element toe waar plaatje in kan. 2 column. Maat voor plaatje is bijvoorbeeld. 600 x 400 px. Binnen Mailchimp kun je nadat plaatje in je template zit. Kiezen voor Edit. Je kunt bijsnijden met wat standaardvormen. Een Headerafbeelding kun je bijsnijden via Pixlr.com/e .

foto voor in Mailchimp bericht, links of rechts van tekst te plaatsen

foto voor in Mailchimp bericht, links of rechts van tekst te plaatsen. (600 x 400 px)

Titel

<h1 class=”null”>We zijn weer begonnen?!</h1>

Style/Settings:

arbo werkplek inrichten thuis bol com kopen
  • no font no color
  • 1column

Text & Image

Gebruik element voor Image & text

Style/Settings:

  • settings voor tekst: no colour, no align, no font specified (font stel je in op template niveau, niet in elk onderdeel van de nieuwsbrief, leeg laten dus)
  • settings voor plaatje/image: right, 1/2 kolom, align=right

7. DIVIDER STREEP. Mailchimp instellingen: divider/witruimte met streep van 1 px erdoorheen

Witruimte strookje

Divider met lijn erin

Style/Setting

  • (lijn is “border top”)
  • 18 px
  • 18 px
  • solid, 1 px
  • #8d92af (pas kleur aan)
  • backround no color

8. DIVIDER WIT.  Alleen wit, dus geen streep in deze divider.

Voeg 1 column element Divider in.

Settings Divider / witruimte

  • Padding top 7 px, bottom 7 px.
  • Border top none
  • backround none
  • colour no color

9. Themastrook 2 (plaatje)(1200×140)

Voeg element toe waar plaatje in kan. 1 column.

Thema streamer mailchimp nieuwsbrief template maken

Thema strook, icoon links erin, rechts de verklarende tekst. 1200×140 pixels

Style/Setting (1200×140)

  • border none
  • center

10. IMAGE+TEXT blok. Tweede bericht (plaatje links, tekst rechts)(600x400px)

Voeg element toe waar plaatje in kan. 2 column.

foto voor in Mailchimp bericht, links of rechts van tekst te plaatsen

foto voor in Mailchimp bericht, links of rechts van tekst te plaatsen (600x400px)

Titel

<h1 class=”null”>We zijn weer begonnen?!</h1>

Style/Settings:

  • no font, no color
  • 1column

Text & Image

Gebruik element voor Image & text

Style/Settings:

  • settings voor tekst: no colour, no align, no font specified (font stel je in op template niveau, niet in elk onderdeel van de nieuwsbrief, leeg laten dus)
  • settings voor plaatje/image: left, 1/2 kolom, align=left

11. DIVIDER STREEP. Witruimte doorbroken door streep 1 px.

Witruimte strookje

Divider met lijn erin

Style/Setting

  • (lijn is “border top”)
  • 18 px
  • 18 px
  • solid, 1 px
  • #8d92af (pas kleur aan)
  • backround no color

12. DIVIDER WITRUIMTE blok. Zonder streep/lijn erin.

Voeg 1 column element Devider in.

Settings Divider / witruimte

  • Padding top 7 px, bottom 7 px.
  • Border top none
  • backround none
  • colour, no color

13. IMAGE blok. Themastrook 3 (plaatje)(1200×140)

Voeg element toe waar plaatje in kan. 1 column.

Thema streamer mailchimp nieuwsbrief template maken

Thema strook, icoon links erin, rechts de verklarende tekst. 1200×140 px

Style/Setting (1200×140)

  • border none
  • center

14. TITLE blok + TEXT+IMAGE blok + TEXT blok. Derde bericht (plaatje op top, 1 alinea blok er nog onder voor tekst)(1000 x 346)

We gaan nu berichtopzet maken waarin heel lang stuk tekst kan. Waarbij introtekst met foto ernaast het begin vormt. 3 blokken nodig.
Ten eerste. je hebt apart blok nodig om daarin de titel te zetten. (bij voorgaande berichten, zat H1-titel in Text gedeelte, nu in apart blok)

TITEL blok. Instellingen Mailchimp:

<h1 class=”null”>We zijn weer begonnen (voorbeeld)?!</h1>

TEXT+IMAGE blok

Ten tweede, voeg nu element toe waar plaatje in kan. 2 column. Dus Image+Text blok er direct onder zetten. Plaatje rechts uitlijnen. Zie fotomaat die eerder al is gebruikt binnen element TEXT+IMAGE.

Ten derde, nog een TEXT BLOK, 1 column. Zodat je daar alle rest van de tekst in kwijt kan bij plaatsing van tekstrijk bericht.

0. DIVIDER STREEP. Witruimte doorbroken door streep 1 px.

Witruimte strookje

Divider met lijn erin

Style/Setting

  • (lijn is “border top”)
  • 18 px
  • 18 px
  • solid, 1 px
  • #8d92af (pas kleur aan)
  • backround no color

15. DIVIDER WITRUIMTE blok. Zonder streep/lijn erin.

Voeg 1 column element Devider in.

Settings Divider / witruimte

  • Padding top 7 px, bottom 7 px.
  • Border top none
  • backround none
  • colour, no color

16. IMAGE blok. Themastrook 3 (plaatje)(1200×140)

Voeg element toe waar plaatje in kan. 1 column.

Thema streamer mailchimp nieuwsbrief template maken

Thema strook, icoon links erin, rechts de verklarende tekst. 1200×140 px

Style/Setting (1200×140)

  • border none
  • center

17. TEXT blok. Vierde bericht.

Dit is nog een aardige variatie. Alleen tekst, voor als je geen foto hebt of erbij wilt gebruiken. TEXT Blok, 1 kolom.

18. DIVIDER STREEP. Witruimte doorbroken door streep 1 px.

Witruimte strookje

Divider met lijn erin

Style/Setting

  • (lijn is “border top”)
  • 18 px
  • 18 px
  • solid, 1 px
  • #8d92af (pas kleur aan)
  • backround no color

19. DIVIDER WITRUIMTE blok. Zonder streep/lijn erin.

Voeg 1 column element Devider in.

Settings Divider / witruimte

  • Padding top 7 px, bottom 7 px.
  • Border top none
  • backround none
  • colour, no color

20. IMAGE blok. Themastrook 3 (plaatje)(1200×140)

Voeg element toe waar plaatje in kan. 1 column.

Thema streamer mailchimp nieuwsbrief template maken

Thema strook, icoon links erin, rechts de verklarende tekst. 1200×140 px

Style/Setting (1200×140)

  • border none
  • center

21. IMAGE+TEXT blok. Vijfde bericht.

Dit is nog een aardige variatie. Nu de aandacht vangen met brede foto (op top), en daaronder pas het artkel, dan in 2 kolommen.
Alles blijft 1-kolom. Dit plaatje toevoegen. Plaatje uitlijnen als boven het artikel (met 1 kolom aan tekst).

foto in mailchimp bericht links of rechts te gebruiken

Fotoformaat in Mailchimp voor bovenop (foto on top), daaronder 2 alinea’s tekst. (1000 x 346 pixels)

Style/Settings:

  • no font, no color
  • 1column

Foto

Voeg bovenstaand plaatje in, maar dan met inhoud erin.

Style/Settings 

  • instelling=top
  • alignment is center

Tekstblok (Image+Text heeft hier 1 kolom)

1 column.

Style/Settings

  • no color
  • no align setting
  • 1 column

22. DIVIDER STREEP (kopiëer wat je al gemaakt hebt via het plusje in de template)

Witruimte strookje

Divider met lijn erin

Style/Setting

  • (lijn is “border top”)
  • 18 px
  • 18 px
  • solid, 1 px
  • #8d92af (pas kleur aan)
  • backround no color

23. DIVIDER. Alleen wit, geen streep erin.

Voeg 1 column element Divider in.

Settings Divider / witruimte

  • Padding top 7 px, bottom 7 px.
  • Border top none
  • backround none
  • colour no color

24. Mailchimp Instellingen: blok “Belangrijke data”, deel tot slot in je nieuwsbrief komende bijeenkomsten (als je die hebt).

Invoegen Bijeenkomsten strook (tekst kun je erin typen), 1 kolom breed

Stijl/Instellingen Mailchimp:

  • 14 font verdana #202020
  • center
  • container style: #e5edf1, border none
  • setting 1 column

25. Footer (1174 – 217 px)

Voeg element toe waar plaatje in kan. 1 column.

Footer Mailchimp, met daarin meerdere logo’s, of zeer beknopte info over financiers. “Dit project wordt mede mogelijk gemaakt door”… etc.. (1174 – 217 px)

Style/Settings

  • Center
  • vink aan “Edge to edge” 

26. Sociale media deelknoppen Mailchimp toevoegen

Invoegen Sociale media links, kies voor speciaal element voor socials, dus liggende balk uit elementen menu in Mailchimp.

Style/Settings:

  • #656565 font not specified
  • background no colour
  • icon only
  • center
  • full width

27. Afzender info & in- en uitschrijven opties, logo Mailchimp (bij gratis versie)(automatisch blok)

Dit blok komt onderin je Mailchimp nieuwbrief en laat je automatisch aanmaken. Je ziet allerlei codes en hekjes (#), nu niet aankomen! Als je klaar bent, kies dan voor “Continue” en opslaan van je template.

28. Template opslaan in Saved Templates (menu Brand)

Mailchimp template opslaan en je acties daarna

Je Mailchimp Template sla je op bij Saved Templates. Daarna komen nog een paar acties om alles goed in te regelen, zodat je regelmatig nieuwsbrieven gaat verzenden en nieuwe lezers erbij krijgt. 

  • Bij elke nieuwe nieuwsbrief maken, kies je voor “Create Campaign”, dan kies je voor “E-mail” en ga je naar je Saved Templates voor invoegen van je standaard nieuwsbrief ontwerp.
  • De nieuwsbrief heeft van Mailchimp een fysiek postadres nodig. Deze kun je instellen via Audience. Dus voor de lijst die je wilt koppelen aan je template. Je postadres toevoegen kan dus niet binnen je template. Dit wordt ingevoegd bij verzenden van een nieuwsbrief editie. Elke nieuwe editie is een “nieuwe campagne”. Dit gaat via de keuze “email” en dan “Saved Templates”.
  • Pas dan ga je kijken bij je gebruikersgegevens, of je postadres dus is ingevoerd bij je gebruikersgegevens.
  • Maak 1 extra Audience aan met jouw emailadres erin als doelgroep. Dus een verzendlijst met alleen jij erin.
  • Je hoofdverzendlijst kun je daarnaast vullen met alle emails van personen die toestemming gaven.
  • Na eerste verzending van de nieuwsbrief, kun je ook zien hoe afzenderblok zich gedraagt. Dit blok is dan automatisch gevuld.
  • Je kunt binnen Mailchimp een inschrijfformulier maken, of inschrijflink aanmaken, je kunt inschrijfformulier als code embedden in je website pagina, bericht of WordPress widget.

Meer over Mailchimp nieuwsbrieven software

Mogelijk kom je hiermee een stuk dichterbij het maken van je eigen Mailchimp Template. Zie ook Mailchimp handleiding. En alle artikelen op Webredactie Blog over Mailchimp nieuwsbrieven.

Succes.

Gerben G van Dijk.