Design instellingen

In de design instellingen zal je twee tabbladen zien: Site style en Fonts.

Tabblad: Site style

Kleurenpalet

Tekststijlen

Je hebt de mogelijkheid om 8 kleuren in te stellen bij het kleurenpalet. Je kan de kleuren aanpassen door te dubbelklikken op een kleur en vervolgens de HEX code in te geven.

Je hebt ook de mogelijkheid om kleuren te gebruiken buiten het kleurenpalet. Dit raad ik echter niet aan, want het is beter om consistent te blijven in je kleuren!

Showit werkt met tekststijlen: je kan een stijl toewijzen aan titels, headings (koppen), subheadings (subkoppen) en paragrafen. Voor elke soort tekst kan je dus een kleur instellen, het lettertype kiezen, de regelafstand, de kleur van linkjes, ... etc. 

Tekststijlen stel je apart in voor de mobile en desktop versie van je website.

Tabblad: Fonts (lettertypes)

Google fonts

Custom fonts

Standaard kan je kiezen uit alle gratis Google Fonts die Showit aanbiedt. Wil je alle Google lettertypes al eens bekijken? Surf dan naar fonts.google.com!

Wil je liever je eigen lettertypes gebruiken op je website? Dat kan! Bij Custom Fonts zie je de lettertypes staan die je hebt geupload in je bibliotheek.

Je eigen lettertypes uploaden in Showit

Stap 1: Download of koop je favoriete lettertype

Er zijn verschillende sites waar je mooie lettertypes kan downloaden of aanschaffen. Hier zijn een aantal van mijn favorieten:

FONTESK (GRATIS)

Myfonts (betalend / gratis)

Etsy (betalend)

Creative Market (betalend)

dafont (gratis)

Let op: om een lettertype in Showit te kunnen gebruiken, moet je een .woff bestand hebben. Kies bij het aanschaffen van een lettertype voor de optie 'Webfont' of volg de stapjes hieronder om het bestand te converteren.

Mijn favo lettertypes:

Fontspace (gratis)

Stap 2: Converteer het lettertype naar een .woff bestand

Is het lettertype dat je wilt gebruiken een .otf of .ttf bestand? Dan zal je dit eerst moeten omzetten naar een .woff bestand. Je kan hiervoor online webfont generators gebruiken zoals Fontsquirrel Webfont Generator of Transfonter. 

Stap 3: Upload het lettertype in je mediabibliotheek

Wanneer je het ZIP-bestand hebt uitgepakt en de .woff file ziet, sleep je de .woff file (let op: niet .woff2) in de mediabibliotheek. Tip: maak een aparte folder voor je lettertypes! 

Stap 4: Voeg het lettertype toe bij design instellingen - fonts

Ga nu naar Design settings linksboven in je scherm en ga vervolgens naar het tabblad Fonts. Bij Custom fonts kan je vervolgens het lettertype selecteren dat je zonet hebt geupload in je mediabibliotheek.

Geef het lettertype een naam en vink het vakje aan dat je een licentie hebt om het te gebruiken op je website (psst: let er op dat dit ook écht zo is!).

All done? Klik dan nu op 'Add custom font'. Je zal het lettertype zien verschijnen aan de rechterkant bij de geactiveerde lettertypes. Wanneer je op 'Save' hebt geklikt zal je het lettertype kunnen gebruiken op je site!

Stap 5: Pas het lettertype toe als tekststijl

✍🏻 Uitleg bij de video