use any font plugin dinesh karki

Tutoriel : use Any Font est la solution pour customiser tes fonts sur WordPress


Après avoir fais quelques petites recherches et surtout essayer un paquet de plugins WordPress, je me suis arrêté sur un plugin qui tient la route. Use Any Font par Dinesh Karki est un plugin qui te permet de télécharger toutes les fonts que tu veux en payant une licence qui ne coûtera que 10 $ (= env. 8,5 euros).

 
Oui j’ai choisi de te proposer un tutoriel avec une extension payante. Tout simplement car c’est la plus fiable et la plus facile à installer. Je te le promets.

Le plus gin WordPress Use Any Font de Dinesh Karki t’offre 2 choix :

  • 1) Soit tu actives 1 seule font sur ton site gratuitement
  • 2) Soit tu actives une licence key en payant en ligne un montant de 10$ minimum (libre à toi de donner plus) pour télécharger sur ton site des fonts personnalisées en quantité illimitée

Quel est ton choix ?

Pour ma part j’ai choisis la deuxième option à 10$ et je te fais un petit tuto pour voir comment on utilise tout ça.

On commence tout de suite en téléchargeant directement le plugin via ton site WordPress. Va dans Extensions > Ajouter.

Comment installer un plugin WordPress ? Clique ce lien pour voir le Tuto !

Puis dans la barre de recherche tape Use Any Font. Tu tombes directement sur le premier plugin Use Any Font de Dinesh Karki. Clique sur Installer.

use any font plugin wordpress

Ensuite tu l’actives en cliquant à nouveau sur le bouton bleu Activer.

use any font plugin active

OK à présent ton plugin est dispo dans la barre latérale de gauche de ton tableau de bord. Recherche-le et clique sur le lien pour accéder aux paramètres.

use any font plugin wordpress

Comme tu peux le voir sur la capture d’écran ci dessus il y 3 blocs + 1 optionnel à paramétrer.

  • 1 – API Key = Créer une clé de connexion API
  • 2 – Upload Fonts = Téléchager la ou les fonts que tu désires
  • 3 – Assign Font = Assigner les fonts leur attribuer ou pas un état
  • 4 – Additionnal Settings = paramétrages additionnels/optionnel (nous n’aborderons pas ce cette étape)

OK dans un premier temps nous allons créer une clé API. Il suffit simplement de cliquer sur le petit lien bleu here dans la description du premier bloc.

1- API Key

use any font api key

Tu atterris sur le site de Use Any Font de Dinesh Karki pour choisir tes options et t’enregistrer.

use any font api key

  • 1) Sélectionnes le montant que tu souhaites et à partir de 10 $ et + tu peux télécharger une quantité illimitée de font
  • 2) Renseignes tes informations personnelles
  • 3) Choisis un moyen de paiement
  • 4) Valide ton choix en pressant sur “Submit”

Note : si tu as mis le curseur sur Free.
Tu devras néanmoins cliquer une option de paiement mais en pressant submit tu atterriras instantanément sur une page pour copier/coller ta clé API. De plus tu recevras aussi un email de confirmation avec ta clé API. Juste pour te dire que valider un moyen de paiement alors que tu as choisis l’option Free ne t’engage en rien.

use any font api key free

Dès que tu as “SUBMIT”, puis réglé ton du. Rendez-vous dans ta Inbox pour récupérer ta clé API fraîchement envoyée.

use any font api key inbox

Copie/colle ta clé dans le champs requis et presse Verify

use any font plugin verify

Ta clé est bien activée ! Oh yeah !

use any font plugin api key active

Passons maintenant au bloc 2 Upload fonts.

2- Upload Fonts

Une fois la clé activée (free ou payée) et une fois seulement. Tu peux uploader tes fonts.

Au préalable tu en as téléchargé venant de sites comme Font squirrel, Font Fabric ou autres et tu les as a portée de clics, c’est à dire sur ton bureau ou extraite de ton dossier pour télécharger uniquement le fichier.

Va donc dans le bloc Upload Fonts pour télécharger ta ou tes fonts sous tous les formats (.otf, .ttf, .woff).

CLique donc sur le bouton bleu en haut à droite du bloc 2 “Upload Fonts”. Puis télécharge ta première font en cliquant “choisissez un fichier”.

use any font plugin add fonts



use any font wordpress

Une fois sélectionnée, pense à nommer la font et donc reprends le nom exact de cette police.
Dans l’exemple la font “Signature Round” sera nommée ainsi dans WordPress. Presse “Upload”/span> pour confirmer ton choix et enregistrer ta font.

use any font plugin

Si tu as payé tu peux refaire le process pour charger toutes les fonts que tu souhaites sinon tu es limité à une. De mon côté, j’en ai téléchargé 3.

plugin wordpress

Perfect, tu as tes fonts maintenant y a plus qu’à les assigner ou pas.

3- Assign Font

Dans ce 3ème bloc tu vas attribuer tes nouvelles fonts par défaut et de façon automatique aux titres et texte que tu souhaites.
C’est à dire si tu veux que tous les titres <h1>…</h1>, les sous-titres <h2>…</h2> etc… soient présentées avec de cette nouvelle font et bien tu le fais directement ici.

Regarde comment ça se passe. Clique sur le bouton bleu en haut à droite “Assign Font”.

use any font plugin assign font

Puis sélectionne dans un premier temps la font que tu souhaites assigner au différents Titres et paragraphe .

Dans cet exemple nous allons attribuer la “Signature Round” à tous les contenu écrits du site All “body tags”, c’est à dire aux titres et texte confondus. Puis clique sur le bouton bleu tout en bas sur “Assign Font” pour valider ton choix.

use any font wordpress

Et voici donc ce que ça donne. Tout, absolument tout est devenu la font “Signature Round” par défaut : les liens de la barre de navigation en passant par les Titres, les sous-titres, les paragraphe et les listes.

use any font default font

Voilà pour l’exemple donc, je te conseille d’utiliser les fonts en suivant un plan, au préalable à appliquer comme convenu sur votre charte graphique.

Tu as à présent comment istaller ta font en créant une clé API, ensuite en Uploadant tes fonts et si tu souhaites en assignant tes fonts.

Du coup si tu n’assignes pas tes fonts et bien tu peux les exploirer directement via ta zone de texte de tes pages, articles et autres.
Découvrons comment utiliser tes nouvelles fonts directement dans un bloc de texte.

Dans ta page ou dans le bloc texte d’un builder tape ton texte et mets toi sur ta barre d’outils.
. Si ce n’est pas déjà fait ouvre ta barre d’outils pour faire apparaître les 2 niveaux.
Sélectionnes le texte que tu souhaites assigner et choisis ta font dans le fichier déroulant situé sur le 2ème niveau à gauche intitulé “Famille de polices”.

famille de police use any font

En suite cherche la font téléchargée que tu désires elle se trouve en général tout en haut. Tu clique simplement dessus.

use any font choose font

Puis c’est tout bon le texte change de police instantannément. Tu peux en profiter pour modifier la taille qui se situe dans le fichier déroulant à droite intitulé “Tailles de la police”.

use any font dinesh karki

Tu sauvegardes, tu mets à jour ta page ou ton article et le résultat est surprenant !

wordpres font back

any font plugin front

Voici comment tu peux jouer avec Use Any Font la prise en mais se fait très rapidement. Comme, je disais n’aborderai pas le Bloc 4 car il est optionnel et on peut bosser sans à un certain niveau.

D'autres tutos & posts sont à ta dispo :

J'aime partager les apps et les tools que j'utilise au quotidien. J'écris des tutos & des posts qui t'aideront, je l'espère, à faire des trucs tranquillement que tu sois en pyjama dans un Starbucks ou en costume dans ta chambre.

Aucun Commentaire

Poster un commentaire

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.