Xpression Manager/webfontsgebruiken: verschil tussen versies
Geen bewerkingssamenvatting |
|||
Regel 19: | Regel 19: | ||
# Vul in het invoerveld de aanroep in, dit kan op de volgende manier:<br/><pre>font-family: 'Open Sans', sans-serif;</pre><br/> | # Vul in het invoerveld de aanroep in, dit kan op de volgende manier:<br/><pre>font-family: 'Open Sans', sans-serif;</pre><br/> | ||
# Hier zie je dat "Open Sans" als eerste font aangeroepen wordt. Daarnaast wordt "sans-serif" aangeroepen, dit is het fallback font.<br/> Deze dient indezelfde stijl te zijn om te voorkomen dat de tekst er compleet anders uitziet. | # Hier zie je dat "Open Sans" als eerste font aangeroepen wordt. Daarnaast wordt "sans-serif" aangeroepen, dit is het fallback font.<br/> Deze dient indezelfde stijl te zijn om te voorkomen dat de tekst er compleet anders uitziet. | ||
# Klik nu op "Opslaan" om de wijzigingen op te slaan. |
Huidige versie van 14 aug 2015 om 15:09
Webfonts
Wanneer de gebruikte fonts binnen XM niet naar wens zijn is er de mogelijkheid om gebruik te maken van webfonts.
Deze kunnen toegevoegd worden aan een stijlthema en vervolgens in de bijbehorende CSS toegevoegd worden.
Wat zijn webfonts
Webfonts zijn simpel gezegd lettertypes die niet standaard op iemand zijn besturingssysteem zijn geïnstalleerd maar die via een server worden geladen.
Nadat het lettertype geladen is wordt deze via de browser weergegeven.
Mocht het toch voorkomen dat het webfont niet geladen kan worden dan dient er een fallback font ingesteld te zijn, waarop dan teruggevallen kan worden.
Denk aan bijvoorbeeld Georgia bij een serif of Arial bij een sans-serif webfont.
Web fonts gebruiken binnen XM
Volg de onderstaande stappen om webfonts te gebruiken binnen stijlthema's in XM.
- Ga naar het "Onderhoud" menu.
- Klik hier in het linker menu op "Stijlbeheer".
- Bij het gewenste stijlthema dient op het icoontje met potloodje geklikt te worden.
- Klik vervolgens op het tabje "Extra HTML".
- Hier dient het webfont aangeroepen te worden, dit kan op de volgende manier:
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic' rel='stylesheet' type='text/css'>
Het gedeelte achter "href" is het gedeelte waar gedeclareerd wordt welk font(s) aangeroepen worden, in dit geval is dat "Open Sans".
Nu het font aangeroepen is dient het nog gedeclareerd te nog aangeroepen te worden in de stijlsheet (CSS) - Klik op "Extra CSS"
- Vul in het invoerveld de aanroep in, dit kan op de volgende manier:
font-family: 'Open Sans', sans-serif;
- Hier zie je dat "Open Sans" als eerste font aangeroepen wordt. Daarnaast wordt "sans-serif" aangeroepen, dit is het fallback font.
Deze dient indezelfde stijl te zijn om te voorkomen dat de tekst er compleet anders uitziet. - Klik nu op "Opslaan" om de wijzigingen op te slaan.