Awesome fonts

Hallo

Ik probeer iconen op mijn website te krijgen door gebruik te maken van awesome fonts.
Dit lukt me maar niet om goed in te stellen.

Ik maakte gebruik van:https://www.drupal.org/project/fontawesome
Module succesvol geïnstalleerd. Wat ik wel niet vind, is het knopje van deze font om toe te voegen aan de cke editor.
Ook als ik de icoon invoeg via full html als dit vb:<i class="far fa-envelope"></i> komt er geen icoon op de site. Op de plaats waar de icoon moet staan, staat er een vierkantje ipv een envelop

Wat ik ook probeerde is de directe link gebruiken maar hoe krijg ik dit stukje script tussen de <head> ?
<script defer src="https://use.fontawesome.com/releases/v5.0.1/js/all.js"></script>

Iemand een idee of oplossing?

Drupalversie: 
8.x
Auteur: 
Steven Vandewalle
afbeelding van jo.w
Door jo.w op 19 december, 2017 - 17:13

De library mee geïnstalleerd?

Jo

Door Steven Vandewalle op 19 december, 2017 - 18:39

Nee want in de opties van awesome font kon je een vinkje aanzetten om een external library te gebruiken:
https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css

Ik zal eens proberen om eventueel een library in te stellen

Door Steven Vandewalle op 19 december, 2017 - 19:16

De reden waarom ik het knopje niet vind in de cke editor is me nu duidelijk. Dit is enkel te vinden in de 8.2 dev versie.
Ik had de stable versie 8.1 geinstalleerd

Font Awesome 5.0 (8.x-2.x):
This module provides a CKEditor plugin to allow users to select Font Awesome icons directly from the editor. To install, simply add the Font Awesome button to your editor at /admin/config/content/formats.
Additionally, you can manually insert icons in code by making use of the classes:

See the Font Awesome 'How to Use' guide for more information.
Font Awesome 4.7.0 (8.x-1.x and 7.x-2.x):
This module simply adds the CSS, its up to you to make use of the classes:
Twitter
For latest versions (4.x) of "Font-Awesome" library you need to use "fa" instead of "icon" class e.g. :-
Twitter
See the Font Awesome examples page for further usage information.

Ik heb het eens geprobeerd met een voorbeeld icoontje, het fototoestel, dit toont hij wel. Wellicht iets mis met de code voor het envelopje. Als ik nog even verder zoek lukt het me wel om het probleem op te lossen.

afbeelding van jo.w
Door jo.w op 20 december, 2017 - 02:51

Dat lijkt me een link naar een extern css-bestand, niet naar een library.
Je hebt een library nodig of je moet met CDN werken. De CDN-module geïnstalleerd?

Jo

Door Steven Vandewalle op 21 december, 2017 - 15:46

Probleem opgelost

afbeelding van jo.w
Door jo.w op 22 december, 2017 - 13:21

Voor eventueel toekomstige lezers is het dan wel leuk te weten hoe 't is opgelost.

Jo

Bookmark and Share

Drupal is een geregistreerd merk van Dries Buytaert. | Powered by Pantheon.

Drupal.be/Drupal.nl is de website van de Nederlandstalige Drupalgemeenschap.

onomatopee