Installer une police d'écriture personnalisée ?

[Heine]

Détails techniques

Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari, Autre
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://eveil-de-cain.forumactif.com/

Description du problème

Bonjour à tous !

Voilà, je cherche à installer une police d'écriture personnalisée pour certains mots, sur mon forum. C'est une police d'écriture précise, qui n'est donc pas présente sur googlefont.

Comment puis-je l'utiliser ?

J'imagine que je dois l'upload d'une manière ou d'une autre, mais je ne vois pas où et comment. Le fichier est au format .ttf, et j'ai essayé de l'upload sur archive-host avant de faire un link en stylesheet que j'ai ajouté au template overall_header, de la même manière qu'avec un googlefont, et ça ne fonctionne pas !

Voilà voilà. Merci d'avoir pris le temps de me lire et en espérant que mon problème ne soit pas trop compliqué ! xD

Des bisous sur vous OWO/

[Invité]

Bonjour Heine, de nombreux tutos sont disponibles en faisant une recherche. Celui-ci peut-être vous aidera t-il.

https://forum.forumactif.com/t387564-font-face-non-actif#3256810

[Heine]

Merci de la réponse !

Après tentative... ça ne marche toujours pas. J'imagine que c'est lié au fait que tout est hébergé sur archive host, et non pas sur un FTP "classique". :/

Le soucis c'est que la quasi totalité des tutoriels demandent ça, chose que je n'ai pas. Et je ne trouve, malheureusement, pas de réels hébergeurs ftp gratuits, donc je suis un peu embêté.

Concernant le message montré voilà ce que j'ai fais :

J'ai hébergé une police d'écriture sur archive-host (url : https://www.aht.li/3234704/vampyr.ttf) puis j'ai créé un fichier css avec cette information :
@font-face {
font-family:"vampyr";
src:url("https://www.aht.li/3234704/vampyr.ttf") format("truetype");
}

Je l'ai upload, et j'ai ensuite ajouté dans le overall_header le
<link href="https://www.aht.li/3234706/css.css" rel="stylesheet" type="text/css">

avec du coup le lien de mon css.

Puis j'ai donc ajouté un font-family:"vampyr" pour avoir la bonne police.

Et du coup... pas de résultats. D:

[w00tw00t]

Bonjour Heine,

C'est effectivement à cause de la politique de sécurité de même origine mise en place chez votre hébergeur ou plutôt l'absence de politique en place (entêtes CORS non définies).

Vous pouvez essayer l'astuce proposée par Walt en effet, c'est à dire de faire référence à un CSS hébergé sur le même nom d'hôte que votre fichier TTF. Néanmoins, bien que vous utilisiez la redirection ath.li, cela semble déjà être le cas.

Selon la politique des navigateurs, et si les entêtes doivent être définies désormais, vous devrez donc probablement poser la question à votre hébergeur (Archive-Host) d'une possible configuration de ces entêtes pour répondre à votre besoin, ou de souscrire à un hébergement gratuit permettant la manipulation des entêtes HTTP de la réponse.

Si cela n'aboutit pas, vous pourrez revenir vers moi pour davantage d'aide.

Cordialement,
w00tw00t

[Heine]

Archive-host ne pourra surement pas malheureusement. :/ Des hébergeurs gratuits à proposer que je puisse utiliser ?

merci d'avance

[w00tw00t]

Bonjour Heine,

Vous pouvez utiliser le service suivant :
https://fonts.rootbb.com

Une fois les liens directs récupérés, exemple :

Code:

https://fonts.rootbb.com/t4p1abz5fu.ttf

Il n'y a plus qu'à les placer dans le CSS de votre forum (et non dans un CSS externe quelconque) :

Code:

/* on fait référence aux fonts externes */

@font-face {
   font-family:"champagne";
   src:url("https://fonts.rootbb.com/t4p1abz5fu.ttf") format("truetype");
}

@font-face {
   font-family:"vampyr";
   src:url("https://fonts.rootbb.com/vo82svh7k1.ttf") format("truetype");
}

/* exemple d'utilisation du nouveau font "vampyr" */

h1 {
 font-family:vampyr;

 color:#530c09;
 font-size:21px;
 font-style:normal;
}

Laissez moi savoir si cela fonctionne.

Cordialement,
w00tw00t

[Heine]

Ohh, ça marche ! Merci beaucoup ! Résolu o/