Vormgeving - CSS

CSS stylesheets beheren

Binnen Marketing Suite kun je in de vormgevings-module CSS stylesheets beheren. Dit is een centrale plaats om stylesheets op te slaan en te bewerken. Je kunt vervolgens in verschillende HTML-templates (voor mailings en websites) naar deze stylesheets verwijzen, waardoor je niet in elke template opnieuw dezelfde CSS-code hoeft aan te maken. Dit is handig, omdat je als organisatie vaak vaste regels hebt over lettertypes en kleurgebruik: dit kun je dan op een centrale plek opslaan.

Bij het versturen van de e-mail zorgt Copernica er voor dat de template en de stylesheet worden samengevoegd, zodat ze samen in dezelfde e-mail komen te staan.

Hoe gaat dit in zijn werk?

Stap 1: In de module "vormgeving" kun je een stylesheet aanmaken, en deze vullen met CSS regels. Deze stylesheet geef je een naam, bijvoorbeeld "mijn_stylesheet". Vervolgens kun je hier met CSS aangeven welke lettertypes, kleuren en andere stijlelementen je zoal gebruikt.

Omdat stylesheets vaak voor meerdere templates bedoeld zijn, raden we aan om de styling beperkt te houden tot algemene huisstijlelementen, zoals het lettertype en kleurgebruik. Voor zaken die heel template-specifiek zijn, kun je je CSS-code vaak beter gewoon binnen je template plaatsen.

We gaan er hierbij vanuit dat je kennis hebt van CSS. Mocht je geen kennis hebben, bekijk, bekijk dan bijvoorbeeld deze website.

Stap 2: Als je een HTML-template aanmaakt, kun je in de configuratie onder 'Stijl' aangeven welke stylesheet op de template van toepassing is. Hier kies je voor de optie "mijn_stylesheet". Hierdoor worden alle stijlelementen automatisch toegepast op je mailing.

Alleen voor HTML-templates en Publisher websites

De stylesheets worden alleen gebruikt voor HTML-mailings. Drag-and-drop-templates hanteren een eigen systeem voor opmaak en styling en maken geen gebruik van de CSS-module. De websites die je kunt aanmaken in het onderdeel "Websites" onder Publisher maken gebruik van dezelfde technologie als HTML-mailings, en kunnen daarom ook van dezelfde stylesheets gebruik maken.

De verschillende onderdelen van een stylesheet

Als je een stylesheet aanmaakt, dan zie je dat de stylesheet is onderverdeeld in een aantal onderdelen. Het belangrijkste onderdeel is de Algemene stylesheet waar je de CSS regels invoert die van toepassing zijn op je mailing template en websites. Maar je kunt ook CSS-regels invoeren voor andere onderdelen. Dit zijn de beschikbare onderdelen:

  • Algemene stylesheet.
  • RSS-stylesheet.
  • Atom-stylesheet.
  • Enquete-stylesheet.
  • Webformulier-stylesheet.

De algemene stylesheet is het belangrijkste. De CSS-code die hierin is opgeslagen wordt toegepast op alle templates en websites die naar deze stylesheet verwijzen. De andere onderdelen worden alleen gebruikt indien je van bepaalde features gebruikmaakt. Als je in een mailing of website bijvoorbeeld een RSS- of ATOM-feed inlaadt (zie {loadfeed}), dan worden niet alleen de CSS-regels van de algemene stylesheet ingeladen, maar ook die van de RSS-en/of ATOM-stylesheet.

Enquêtes en webformulieren kun je alleen inladen in websites, en werken niet voor mailings. De bijbehorende stylesheets zijn dus ook alleen van toepassing op websites, en dan alleen als er daadwerkelijk van een enquête of formulier gebruik wordt gemaakt (zie {survey} en {webform}). Doordat het stylesheet in onderdelen is opgesplitst, kunnen mailings wat kleiner worden gehouden: als er geen content-feed in een mailing staat, kan de styling voor content-feeds worden weggelaten.

Omdat de meeste gebruikers stylesheets enkel inzetten voor algemene stijlelementen als lettertypes en kleurgebruik, is het gebruikelijk dat alleen de algemene stylesheet wordt gebruikt.