Beschrijving

Gemakkelijk lettertype kiezen

Standaard zijn er natuurlijk al best wat lettertypes (fonts in het Engels) voorhanden, maar het is natuurlijk net de vraag of het lettertype dat door je gekozen webdesign ondersteund wordt ook net past bij het lettertype dat jij wilt.
Dus, ook het lettertype kun – je indien gewenst – gemakkelijk aanpassen. Er zijn er een heleboel standaard te gebruiken. Afhankelijk van pakket / uitbreiding kun je ook lettertypes gebruiken die niet standaard zijn.

Gratis lettertype pakketten

Je kunt gratis lettertypes gebruiken en je kunt er voor betalen.
Gratis lettertypes kun je o.a. vinden op Google fonts

De functionaliteit gemakkelijk lettertype kiezen maakt gebruik van de gratis fonts van Google. Met deze functionaliteit kun je gemakkelijk een lettertype uitzoeken en je kunt eenvoudig aangeven waar je dat lettertype wilt gebruiken (bijv. voor een koptekst). Hiervoor hoef je dus niet in css te coderen (hieronder meer daarover bij implementatie). De functionaliteit gemakkelijk lettertype kiezen zit bij een aantal pakketten ingebouwd.

Er zijn waarschijnlijk ook andere plekken te vinden voor gratis lettertypes. Let er dan wel op of er enige controle is op de bestanden, zodat je niet per ongeluk een virus mee upload!

Betaalde lettertypes

Naast de gratis lettertypes van Google kun je ook gaan voor een betaalde lettertype, of je kunt zelfs een lettertype laten ontwerpen.

Andere voordelen van de betaalde lettertypes zijn:

• ze zijn exclusiever
• ze zijn vaak professioneler gemaakt wat zich onder ander uit in meer glyphes (tekens) en meer font-styles (font-family – dik, dikker, schuin etc.)
• als de link verdwijnt dan verdwijnt ook je lettertype. Bij betaalde versies is die kans kleiner
• in plaats van een link gebruiken kun je een gekochte lettertype ook door ons laten uploaden naar de site
• je kunt de lettertypes ook voor andere doeleinden aanschaffen zodat je heel gemakkelijk en goedkoop een eigen huisstijl kunt samenstellen, bijvoorbeeld voor je brieven, mails en andere externe communicatie.
• het is vaak gemakkelijker om een backup lettertype te vinden, die je gelijk ook aan kunt geven bij het implementeren via css van je lettertype, voor het geval een browser de desbetreffende lettertype niet pakt

Betaalde lettertypes kun je vinden op o.a.:

Zowel bij gratis lettertypes als bij betaalde lettertypes: let goed op de licentie. Bij de betaalde lettertypes is dat zeer duidelijk aangegeven, zodat je daar niet de mist mee in gaat qua schending copyrights.



Je kunt ook je lettertype laten maken. Een andere mogelijkheid is dat je jouw ontwerp laat omzetten naar een lettertype.
Dat kan hier. Let op dat je tijdig reageert anders wordt je order automatisch goedgekeurd!

Ander lettertype gebruiken / implementeren

Het gebruiken van andere lettertypes is afhankelijk van het eigendom / de licentie van het lettertype.
Met onze functionaliteit gemakkelijk lettertype kiezen heb je de beschikking over meer dan 600 lettertypes via https://fonts.google.com/.

Let op: deze functie is beschikbaar in enkele pakketten.

Deze lettertypes zijn met deze functionaliteit gemakkelijk te gebruiken via dashboard > customizer waar een tab staat ‘typography’. Hier kun je voor elk soort kopje, tekstblok etc. aangeven welk lettertype je wilt, in welke stijl (gewoon, vet, schuin), welke kleur je het wilt en hoe groot je het wilt.

Nu kan het ook zijn dat je een ander lettertype wilt dan één van deze. Ook dat kan en wel zo:

• 1. Als het onderdeel is van je layout dan kun je het gebruik van je lettertype aangeven via de css.
  • ga naar dashboard > customizer
  • ga naar custom css
  • Geef daar aan welke lettertype (font family) je voor welke elementen (h1 etc) wilt gebruiken, hoe groot het lettertype moet zijn (font-size) en of de tekst (font-style:) vet gedrukt (bold / strong) moet zijn of schuin (italic) of geen van beiden (normal).
    
    Je kunt gebruik maken van deze code voor je css:
    

    Grote kop
    h1 {
    font-family: verdana;
    font-size: 300%;
    font-style:bold;
    color:(hex-notatie, rgb-notatie, rgba-notatie);
    }
    
    
    Kleinere kop
    h2 {
    font-family: verdana;
    font-size: 300%;
    font-style:bold;
    color:(hex-notatie, rgb-notatie, rgba-notatie);
    }
    
    
    
    Steeds kleiner tot kleinst: zelfde code maar dan h3 – h4 – h5 – h6
    
    

    Gewone tekst
    p {
    font-style:bold;
    font-family: courier;
    font-size: 160%;
    color:(hex-notatie, rgb-notatie, rgba-notatie);
    }
    
    
    Tekst opsommingstekens
    li {
    font-style:bold;
    font-family: courier;
    font-size: 160%;
    color:(hex-notatie, rgb-notatie, rgba-notatie);
    }
    
    
    tekst linkjes
    a {
    font-style:bold;
    font-family: courier;
    font-size: 160%;
    color:(hex-notatie, rgb-notatie, rgba-notatie);
    }
    
    

    Let op: je moet dus wel beschikken over dat lettertype om die te kunnen vertonen!
    
    
    
    

• 2. Maak je gebruik van een gratis font via een link, dan plak je het lettertype in de header. Het gebruik van het lettertype geef je weer aan css (punt 1).
  Via https://fonts.google.com/ kun je een lettertype uitzoeken.

  • Klik op select this style
    
  • Er opent een pop-up aan de zijkant. Kopieer de code
    
  • Plak deze code via Dashboard > Instellingen > Insert headers and footers in je header. Heb je deze functionaliteit niet, dan kun je die hier aanschaffen.

  
  
  

• 3. Koop je een lettertype, dan is het afhankelijk van waar je het koopt.
  
  
  Als je een lettertype hebt gekocht, dan bepaalt die partij min of meer de mogelijkheden voor implementatie. Het kan zijn dat ze een integratie hebben, maar het kan ook zijn dat je een bestand met het lettertype koopt.
  Vervolgens geef je weer aan in css welk lettertype je waar gebruikt (1).
  

  Hoogstwaarschijnlijk zullen wij een gekocht lettertype moeten implementeren. Daarvoor krijgen wij graag tijdelijk toegang tot het account waar je je webfont hebt aangeschaft, zodat wij het kunnen implementeren op je website.
  
  
  Via de customizer maken we je website duidelijk waar het je nieuwe font kan vinden. We doen dit in de customizer omdat je het dan gemakkelijk kunt kopiëren als je van layout wisselt.
  bijv.:

  @font-face {
  font-family: Arvo;
  src: url(https://www.example.com/wp-content/themes/your-theme/fonts/Arvo-Regular.ttf);
  font-weight: normal;
  }
  
  

Let op: Teveel lettertypes gebruiken op je website / webshop en daarmee dus laden van die lettertypes, kan je website / webshop vertragen. Overweeg om gebruik te maken van de versnellingsmodule (link opent op nieuw tabblad) als deze niet al in je pakket is opgenomen.