Vérifiez vos informations

Il semblerait que les informations techniques de votre profil n'aient pas été actualisées depuis un certain temps... Pour que l'aide apportée vous soit efficace, il est important que ces informations soient à jour : prenez quelques secondes pour confirmer ou compléter les informations suivantes.


Lien de votre forum
Version de ce forum
Vous êtes le fondateur de ce forum
Vous avez modifié le CSS de ce forum
Vous avez modifié les templates de ce forum
Votre navigateur

Installer la police google font Roboto Slab

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Installer la police google font Roboto Slab

Message par Kam27 Ven 19 Oct 2018 - 23:17

Détails techniques

Version du forum : ModernBB
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://tavernanna2.forumactif.com/

Description du problème

Bonsoir,
Récemment j'ai voulu installer la police Roboto Slab sur mon forum mais j'ai l'impression que mon code java ne fonctionne pas.
Code:
WebFontConfig = {
    google: { families: [ 'Roboto+Slab::serif' ] }
  };
  (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);
  })();

Aurais-je fait une erreur ? Pourtant j'ai bien suivi les consignes dans ce topic : https://forum.forumactif.com/t343855-utiliser-des-polices-personnalisees-avec-google-web-fonts

Merci de vos réponses Smile

Bonne soirée


Dernière édition par Kam27 le Dim 21 Oct 2018 - 14:43, édité 1 fois
Kam27

Kam27
**

Messages : 95
Inscrit(e) le : 19/12/2016

Voir le profil de l'utilisateur https://firemblemcfe.forum2jeux.com/
Kam27 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par *Splash* Ven 19 Oct 2018 - 23:48

Hi,
Pour en bénéficier il faut la rajouter à l'éditeur, tu l'a fait ?
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3798
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par Kam27 Ven 19 Oct 2018 - 23:52

Je ne compte pas l'installer dans l'éditeur, je veux juste utiliser cette police pour la page css du forum.
Kam27

Kam27
**

Messages : 95
Inscrit(e) le : 19/12/2016

Voir le profil de l'utilisateur https://firemblemcfe.forum2jeux.com/
Kam27 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par *Splash* Sam 20 Oct 2018 - 0:09

Dans ta page HTML tu mets ce code:

Code:
WebFontConfig = {
    google: { families: [ 'Roboto+Slab::serif' ] }
  };
  (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 dans ta CSS celui-ci :

Code:
.element {font-family:"Roboto Slab";}
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3798
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par Kam27 Sam 20 Oct 2018 - 0:49

Cela ne fonctionne toujours pas, il me met la police Times à la place.
Je pense qu'il y a un problème : google: { families: [ 'Roboto+Slab::serif' ] }
Vu que je suis parvenu à installer la Crinsom text en modifiant cet endroit par 'Crinson Text, serif;', mais je n'y arrive toujours pas avec la Roboto Slab.
Kam27

Kam27
**

Messages : 95
Inscrit(e) le : 19/12/2016

Voir le profil de l'utilisateur https://firemblemcfe.forum2jeux.com/
Kam27 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par *Splash* Sam 20 Oct 2018 - 1:51

Sur la page Google Fonts je n'arrive pas à trouver cette référence de police : Roboto+Slab::serif

J'ai tenté en ajoutant ce code après la balise d'ouverture head du template overll_header

Code:
<link href="https://fonts.googleapis.com/css?family=Roboto:700i" rel="stylesheet">

Dans la CSS j'ai ajouté cette ligne

Code:
.element {font-family:"Roboto";}

Et j'ai appliqué cette police au titre du forum

Code:
#site-title h1 {
    font-family:"Roboto";
}

Installer la police google font Roboto Slab Sans_t12
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3798
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par Adam_sfp Sam 20 Oct 2018 - 8:42

@Kam27 a écrit:
Je pense qu'il y a un problème :     google: { families: [ 'Roboto+Slab::serif' ] }

Bonjour

Effectivement un soucis dans cette partie
Code:
[ 'Roboto+Slab::serif' ]

Essayez en mettant
Code:
[ 'Roboto+Slab' ]


puis la règle suivante via le CSS en fonction de l'élément concerné
Code:
font-family: 'Roboto Slab', serif;

Cdt.
Adam_sfp

Adam_sfp
Membre actif

Masculin
Messages : 4465
Inscrit(e) le : 18/04/2008

Voir le profil de l'utilisateur http://antonyadam.kanak.fr
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par Kam27 Sam 20 Oct 2018 - 12:01

@*Splash* a écrit:Sur la page Google Fonts je n'arrive pas à trouver cette référence de police : Roboto+Slab::serif

J'ai tenté en ajoutant ce code après la balise d'ouverture head du template overll_header

Code:
<link href="https://fonts.googleapis.com/css?family=Roboto:700i" rel="stylesheet">

Dans la CSS j'ai ajouté cette ligne

Code:
.element {font-family:"Roboto";}

Et j'ai appliqué cette police au titre du forum

Code:
#site-title h1 {
    font-family:"Roboto";
}


Je crois que tu confonds la Roboto avec la Roboto Slab qui est une police avec empattement.
Leur nom sont trompeurs mais elles sont très différentes : https://fonts.google.com/specimen/Roboto+Slab

@Adam_sfp a écrit:

Bonjour

Effectivement un soucis dans cette partie
Code:
[ 'Roboto+Slab::serif' ]

Essayez en mettant
Code:
[ 'Roboto+Slab' ]


puis la règle suivante via le CSS en fonction de l'élément concerné
Code:
font-family: 'Roboto Slab', serif;

Cdt.

J'ai essayé mais le forum me la remplace encore par la Times New Roman. :/


Dernière édition par Kam27 le Sam 20 Oct 2018 - 12:05, édité 1 fois
Kam27

Kam27
**

Messages : 95
Inscrit(e) le : 19/12/2016

Voir le profil de l'utilisateur https://firemblemcfe.forum2jeux.com/
Kam27 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par *Splash* Sam 20 Oct 2018 - 12:32

Hi,

Au lieu d'utiliser une page HTML, colle cette ligne dans le template, après la balise d'ouverture head :

Code:
 <link href="https://fonts.googleapis.com/css?family=Roboto+Slab" rel="stylesheet">

Et à ta CSS tu ajoutes ceci :

Code:
.element {font-family:"Roboto Slab, serif";}

Testé sur un forum en version ModernBB
*Splash*

*Splash*
Membre actif

Masculin
Messages : 3798
Inscrit(e) le : 25/02/2018

Voir le profil de l'utilisateur https://caforum.fr
*Splash* a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par Adam_sfp Sam 20 Oct 2018 - 13:33

@Kam27 a écrit:
J'ai essayé mais le forum me la remplace encore par la Times New Roman. :/

Bonjour

Vous avez mal copié le code (il manque un bout sur la fin) et du coup il ne fonctionne pas...
http://tavernanna2.forumactif.com/99933.js
vous avez mis
Code:
WebFontConfig={google:{families:['Roboto+Slab']}};(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);
en oubliant ce petit bout sur la fin
Code:
 })();

Cdt.
Adam_sfp

Adam_sfp
Membre actif

Masculin
Messages : 4465
Inscrit(e) le : 18/04/2008

Voir le profil de l'utilisateur http://antonyadam.kanak.fr
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par Lixyr Sam 20 Oct 2018 - 18:36

Bonjour,

Je poste juste pour signaler qu'il serait plutôt préférable d'installer cette police via le lien CSS plutôt qu'avec du JavaScript, surtout que Google font fait ça bien. Suivez les indications de *Splash* ici et la police sera installée sur votre forum.

(ps : n'oubliez pas de valider la template après modification)


ABSENTE LA SEMAINE - RÉPONDS AUX MP
Installer la police google font Roboto Slab G2J0e
Lixyr

Lixyr
Aidactive
Aidactive

Féminin
Messages : 6630
Inscrit(e) le : 22/07/2010

Voir le profil de l'utilisateur https://forum.forumactif.com
Lixyr a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Installer la police google font Roboto Slab

Message par Kam27 Dim 21 Oct 2018 - 14:43

Vous avez raison, je vais attendre le retour du fondateur (je n'ai pas accès aux templates) vu que le code java ne marche qu'une fois sur deux.
Mais merci Adam_sfp pour le code corrigé.
Kam27

Kam27
**

Messages : 95
Inscrit(e) le : 19/12/2016

Voir le profil de l'utilisateur https://firemblemcfe.forum2jeux.com/
Kam27 a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum