• Mettre une autre police que les polices Ekla par défaut

    Yo! Pas mal de personnes ne se contentent pas des polices présentes sur Ekla et souhaitent en choisir une différente.
    Je suis certaine qu'encore une fois, un ou des tutos ont déjà été faits sur le sujet mais voilà une astuce assez simple: le @font-face.

    Il s'agit d'une astuce full CSS, après laquelle vous devrez régler les polices de votre blog directement via CSS, du coup je vous donnerai aussi les sélecteurs des principaux éléments CSS. (Vous pouvez aussi cliquer droit sur l'élément à modifier, choisir "Inspecter" et vous aurez une page qui s'ouvrira où vous pourrez trouver votre sélecteur.)

    1. Hébergez votre police sur un hébergeur externe ou sur votre blog directement.
    Ici, je prendrai l'exemple de la police Scriptina (titre de ce blog). Vu qu'elle est hébergée dessus, je vous donne aussi l'URL d'hébergement, c'est tout bénèf: http://ekladata.com/KZ9FDbMcxNEZ-eYSElSZbrGJZlQ/SCRIPTIN.ttf
    Vous aurez besoin de cette URL, mais aussi du format de la police: souvent .ttf ou .otf -là c'est simple vous regardez l'extension du nom de fichier. Dans l'URL que je vous donne plus haut, c'est .ttf

    2. Allez dans apparence > modifier le thème > ajouter du CSS et copiez le code suivant:

    @font-face {font-family: 'Nom_de_la_police';
    src: url('URL SOURCE') format('extension du fichier');}

    Dans mon cas, avec Scriptina, ça donne ça:

    @font-face{font-family: 'Scriptina';
    src: url('http://ekladata.com/KZ9FDbMcxNEZ-eYSElSZbrGJZlQ/SCRIPTIN.ttf') format ('.ttf');}

    3. Codez les éléments où vous voulez voir apparaître la police :3
    Voici une liste délicate des sélecteurs des principaux éléments de votre blog Ekla (les sélecteurs changent en fonction des plateformes).

    Élément du blog Sélecteur Élément du blog  Sélecteur 
    Menu d'en-tête #menu a Menu de gauche #menu1
    Titre du header  #titre_header Menu de droite #menu2
    Slogan  #slogan_header  Titres du contenu  .module_titre_contenu
    Corps principal (header compris) #background Titres des menus .module_menu_titre
    Contenu #content Titres du menu de gauche #menu1 .module_menu_titre
    Pied de page #footer Titres du menu de droite #menu2 .module_menu_titre
    Sous-menu d'en-tête #menu ul a    

    Ladite liste n'est pas exhaustive, une liste plus complète est à paraître.

    Exemple, si vous voulez que les titres de vos articles apparaissent en Scriptina, vous mettez ça:

    .module_titre_contenu {font-family: Scriptina;}

    4. Voilà, c'est fini :3 j'espère que cet article vous aura servi!


  • Commentaires

    1
    Samedi 12 Novembre 2016 à 12:38

    *lève sa main*

    Comment un héberge une police °^° ?

      • Samedi 12 Novembre 2016 à 18:12

        Soit tu vas dans 'Gérer les fichiers' sur ton blog, soit tu vas sur un autre hébergeur. Y'en a plein, tape juste héberger des fichiers sur google ^^

        Après j'ai pas mentionné, et j'ai pas non plus vérifié avec la police que je donne en exemple (je suis stupide), qu'il faut faire gaffe à ce que la police soit vraiment libre de droits (question de respect et de principes). J'avais trouvé un site qui avait l'air sérieux sur lequel j'ai téléchargé une police toute mignonne qui s'appelle Luna, si ça t'intéresse je peux essayer de te le retrouver ^^

    2
    Samedi 12 Novembre 2016 à 18:26

    J'ai fait '' upload un fichie r '', je sais pas si ça va marcher 

    3
    Samedi 12 Novembre 2016 à 18:32

    Je sais pas, ça dépend des polices, des fois ça va marcher et des fois tu pourras essayer trente hébergeurs sans que rien ne se passe... '^'

    4
    Samedi 12 Novembre 2016 à 18:34

    mais un hébergeur c'est quoi°^° ?

      • Samedi 12 Novembre 2016 à 20:48

        Un endroit sur Internet où tu peux ranger des fichiers pour les utiliser plus tard. :)

    5
    Samedi 12 Novembre 2016 à 21:09

    ouki~

    bon en bref c'est pas demain la veille que je pourrais faire mon truc :')

    6
    Samedi 12 Novembre 2016 à 21:12

    ... ben c'est gratuit en fait en réalité.

    Ca marche pas? #trau2trystaiçe

    7
    Samedi 12 Novembre 2016 à 21:22

    J'vais retenter le truc

    j'ai fait '' gérer le sfichiers '' et j'ai mis mon truc .

    ensuite j'ai l'url '' http://ekladata.com/uh74GMyTE96vH3ObtS4Dyz6DJUQ/Amarillo.ttf ''

     

    Donc  ;

    @font-face {font-family: 'Amarillo';
    src: url('http://ekladata.com/uh74GMyTE96vH3ObtS4Dyz6DJUQ/Amarillo.ttf ') format('ttf');}

    C'est ça ?

    8
    Samedi 12 Novembre 2016 à 21:24

    et si je veux que ce soit les titres ça donne ça ?

    .module_titre_contenu {font-family: Amarillo;}

    9
    Samedi 12 Novembre 2016 à 21:26

    a pa marché

    10
    Samedi 12 Novembre 2016 à 22:25

    Tu as oublié le . du format de la police. Le code ce serait:

    @font-face {font-family: 'Amarillo';
    src: url('http://ekladata.com/uh74GMyTE96vH3ObtS4Dyz6DJUQ/Amarillo.ttf ') format('.ttf');}
    .module_menu_contenu {font-family: Amarillo;}

    Si la police est d'accord '^'

    11
    Samedi 12 Novembre 2016 à 22:31

    ça marche toujorus pas ;-(

    12
    Samedi 12 Novembre 2016 à 22:32
    13
    Samedi 12 Novembre 2016 à 22:33

    nan y veut vraiment pas ce filou

    14
    Samedi 12 Novembre 2016 à 22:47

    Après ça se peut qu'il y aie des problèmes avec le nom ou c'est le navigateur qui ne veut pas. En plus vu que c'est pour des titres d'articles je peux pas juste te dire de faire des images :/

    15
    Samedi 12 Novembre 2016 à 22:52

    tant pis ...arial c'est pas mal non plus x')

    16
    Samedi 12 Novembre 2016 à 22:55

    NAON

    ARIAL IZ NOT GOOD! D:

    • Nom / Pseudo :

      E-mail (facultatif) :

      Site Web (facultatif) :

      Commentaire :


    17
    Samedi 12 Novembre 2016 à 22:57

    :')

    j'vais essayer avec le sliens tiens... avant d ejetter l'éponge et je sauter sur arial

    18
    Samedi 12 Novembre 2016 à 23:12

    Le sliens? '^'
    NON PAS ARIAL
    ça ressemble à Ariel c'est une police de sirène *l'espècisme primaire*

    19
    Samedi 12 Novembre 2016 à 23:24
    Marche pas.... tant pis arial pour l'instant :-')
    Jusqu'a que je trouve la solution
    20
    Samedi 12 Novembre 2016 à 23:53

    Un jour peut-être ;_; trop de trystaice

    21
    Mercredi 23 Novembre 2016 à 19:21

    J'y suis arrivée DAYUM

    avec l'aide de ce tuto 

    Virons le arial !

    22
    Mercredi 23 Novembre 2016 à 19:31

    ohèmjé

    23
    Mercredi 23 Novembre 2016 à 19:40

    sa marcheu !! tro fort

    Suivre le flux RSS des commentaires


    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :