AccueilConnexion
Derniers sujets
[TOUTES VERSIONS] Installer des polices supplémentaires à l'éditeur
Page 1 sur 1 • Partagez
- Splash
Milouzien
Splash le Sam 6 Oct 2018 - 7:50
Hi,
Rendez-vous sur ce site et choisissez la/les polices à installer : https://fonts.google.com
Ajoutons 2 polices supplémentaires au forum, sans modifier le Template, mais en utilisant des codes javascript
Les 2 polices ajoutées sont les polices Coiny et Wallpoet
Panneau d'administration / Modules / HTML & JAVASCRIPT / Gestion des codes javascript
Mettre ce code javascript Sur toutes les pages pour la première police :
Et ce code pour la seconde police :
Ensuite mettre ce nouveau code javascript Sur toutes les pages (ce code correspondra aux polices de l'éditeur) :
Cette partie du code sert à inscrire les 2 nouvelles polices :
Polices qu'il faut également ajouter à cette ligne (en fin de code) :
![[TOUTES VERSIONS] Installer des polices supplémentaires à l'éditeur Police10](https://i.servimg.com/u/f90/19/89/22/92/police10.jpg)
Et ainsi de suite pour chaque nouvelle police à ajouter
Si vous rencontrez un problème avec l'ajout des polices par javascript
Sélectionnez vos polices sur la page Google Fonts en cliquant sur le petit rond rouge "Select this font"
![[TOUTES VERSIONS] Installer des polices supplémentaires à l'éditeur Select10](https://i.servimg.com/u/f90/19/89/22/92/select10.png)
Une fois vos polices sélectionnées, vous verrez en bas de page ce rectangle noir :
![[TOUTES VERSIONS] Installer des polices supplémentaires à l'éditeur Select11](https://i.servimg.com/u/f90/19/89/22/92/select11.png)
Déployez le en cliquant sur le petit tiret blanc (sur la gauche) :
![[TOUTES VERSIONS] Installer des polices supplémentaires à l'éditeur Select12](https://i.servimg.com/u/f90/19/89/22/92/select12.png)
Copier le code qui se trouve après Embed Font, pour nos 2 polices c'est celui-ci :
Coller ce code dans le template overall_header (juste après la balise head) :
Panneau d'administration / Affichage / Templates / Général
Votre début de template ressemblera à ça :
Ensuite ajouter le code javascript pour l'ajout à l'éditeur :
A bientôt
Rendez-vous sur ce site et choisissez la/les polices à installer : https://fonts.google.com
Ajoutons 2 polices supplémentaires au forum, sans modifier le Template, mais en utilisant des codes javascript
Les 2 polices ajoutées sont les polices Coiny et Wallpoet
-Astuce des Forums Milouze14&Compagnie-
Pour toute information,merci de contacter un Membre du Staff | ![[TOUTES VERSIONS] Installer des polices supplémentaires à l'éditeur Staff10](https://i.servimg.com/u/f37/11/26/21/37/staff10.png) |
Panneau d'administration / Modules / HTML & JAVASCRIPT / Gestion des codes javascript
Mettre ce code javascript Sur toutes les pages pour la première police :
- Code:
WebFontConfig = {
google: { families: [ 'Coiny' ] }
};
(function() {
var wf = document.createElement('script');
wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
'://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
wf.type = 'text/javascript';
wf.async = 'true';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(wf, s);
})();
Et ce code pour la seconde police :
- Code:
WebFontConfig = {
google: { families: [ 'Wallpoet' ] }
};
(function() {
var wf = document.createElement('script');
wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
'://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
wf.type = 'text/javascript';
wf.async = 'true';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(wf, s);
})();
Ensuite mettre ce nouveau code javascript Sur toutes les pages (ce code correspondra aux polices de l'éditeur) :
- Code:
WebFontConfig = {
google: { families: [ 'Coiny','Wallpoet' ] }
};
(function() {
var wf = document.createElement('script');
wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
'://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
wf.type = 'text/javascript';
wf.async = 'true';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(wf, s);
})();
$(function(){
if(!$["sceditor"]) return;
$.sceditor.defaultOptions.fonts= 'Arial, Arial Black, Comic Sans MS, Courier New, Georgia, Impact, Sans-serif, Serif, Times New Roman, Trebuchet MS, Verdana, Coiny, Wallpoet'
});
Cette partie du code sert à inscrire les 2 nouvelles polices :
- Code:
WebFontConfig = {
google: { families: [ 'Coiny','Wallpoet' ] }
};
Polices qu'il faut également ajouter à cette ligne (en fin de code) :
- Code:
$.sceditor.defaultOptions.fonts= 'Arial, Arial Black, Comic Sans MS, Courier New, Georgia, Impact, Sans-serif, Serif, Times New Roman, Trebuchet MS, Verdana, Coiny, Wallpoet';
Et ainsi de suite pour chaque nouvelle police à ajouter
Si vous rencontrez un problème avec l'ajout des polices par javascript
Sélectionnez vos polices sur la page Google Fonts en cliquant sur le petit rond rouge "Select this font"
Une fois vos polices sélectionnées, vous verrez en bas de page ce rectangle noir :
Déployez le en cliquant sur le petit tiret blanc (sur la gauche) :
Copier le code qui se trouve après Embed Font, pour nos 2 polices c'est celui-ci :
- Code:
<link href="https://fonts.googleapis.com/css?family=Coiny|Wallpoet" rel="stylesheet">
Coller ce code dans le template overall_header (juste après la balise head) :
Panneau d'administration / Affichage / Templates / Général
Votre début de template ressemblera à ça :
- Code:
<!DOCTYPE HTML>
<html lang="{L_LANG_HTML}">
<head>
<link href="https://fonts.googleapis.com/css?family=Coiny|Wallpoet" rel="stylesheet">
Ensuite ajouter le code javascript pour l'ajout à l'éditeur :
- Code:
WebFontConfig = {
google: { families: [ 'Coiny','Wallpoet' ] }
};
(function() {
var wf = document.createElement('script');
wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
'://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
wf.type = 'text/javascript';
wf.async = 'true';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(wf, s);
})();
$(function(){
if(!$["sceditor"]) return;
$.sceditor.defaultOptions.fonts= 'Arial, Arial Black, Comic Sans MS, Courier New, Georgia, Impact, Sans-serif, Serif, Times New Roman, Trebuchet MS, Verdana, Coiny, Wallpoet'
});
| :u1677: |
Dernière édition par Splash le Sam 6 Oct 2018 - 21:21, édité 3 fois
- Lilas
Milouzien
Lilas le Sam 6 Oct 2018 - 13:52
Kikou Splash,
Je m'intéresse à ta petite astuce, aujourd'hui.
Bonne journée forum,
Je m'intéresse à ta petite astuce, aujourd'hui.
Bonne journée forum,
- Milouze14
Fondateur
Milouze14 le Dim 7 Oct 2018 - 6:50
- Invité
Invité
Invité le Ven 12 Oct 2018 - 3:12
Merci beaucoup !
- ThunderTB
Milouzien
ThunderTB le Mar 6 Nov 2018 - 5:26
Merci beaucoup !
- Kaeyla
Milouzien
Kaeyla le Sam 26 Jan 2019 - 21:14
Merci pour ce superbe partage 
- HeroxAquariophile
Milouzien
HeroxAquariophile le Jeu 28 Mar 2019 - 17:25
MERCI !
- Ptite_Perle
Milouzien
Ptite_Perle le Ven 29 Mar 2019 - 14:51
Merci
- xewupMilouzien
xewup le Sam 30 Mar 2019 - 10:53
Merci beaucoup
Sujets similaires
» [TOUTES VERSIONS] Installer Filepicker - Un gestionnaire d'upload de fichiers multi-sources gratuit
» Infos supplémentaires à propos du curseur
» Problème avec le tuto Installer et utiliser plusieurs versions de MapSource
» installer un fichier poi sur le gps.
» installer les aires de camping car info
» Infos supplémentaires à propos du curseur
» Problème avec le tuto Installer et utiliser plusieurs versions de MapSource
» installer un fichier poi sur le gps.
» installer les aires de camping car info
Créer un compte ou se connecter pour répondre
Vous devez être membre pour répondre.
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum
» Les mots croisés
» Note de service " Blagounette"
» Petite annonce "histoire"
» Paris-Lyon "histoire"
» Disparu "histoire"
» La pendule "histoire"
» [PHPBB3]Afficher une navigation rapide sur les messages
» [PhpBB3]Aspect de la réception d'une newsletter ...
» [TOUTES VERSIONS] Afficher les outils de modération via la liste des sujets
» [PHPBB2] Ajouter un id à partir de l'attribut de l'image
» [PhpBB2] Problème encodage avec un script
» [Blague]Histoire courte mais très courte ....
» Sommes-nous tous sur écoute ? "blague"
» Règlement de l'entraide Forumactif
» Les calculettes
» [PHPBB2] Afficher le règlement du forum en haut de sujet
» [PHPBB2] Remplacer le mot Invité
» [TOUTES VERSIONS]Message de confirmation de fermeture de la page pour les membres distraits
» Le ventriloque "Blagounette"