Dit toevoegen aan de style.css werkt: 

* { font-family: "Courier New", Courier, monospace; }

Waarschijnlijk omdat Courier New alom populair is en wordt ondersteund. Dit gebruiken in mijn aangepaste lettertype werkt echter niet: 

@font-face { font-family: "new-baskerville"; font-style: normal; src: url("/wp-content/uploads/useanyfont/190811081519New-Baskerville.eot"); src: local("new-baskerville"), url("/wp-content/uploads/useanyfont/190811081519New-Baskerville.eot") format("embedded-opentype"), url("/wp-content/uploads/useanyfont/190811081519New-Baskerville.woff") format("woff"); }

Of verander @font-face naar * werkt ook niet. De bestanden bestaan in het pad. Weet je waarom dat is?

Opmerkingen

  • Je moet ofwel met een absolute URL werken of de relatieve URL juist krijgen, zoals het stylesheet is waarschijnlijk niet ' t in de documentroot van uw WP-installatie. CSS-vragen zijn over het algemeen off-topic in WordPress Development , neem een kijkje in het helpcentrum om vertrouwd te raken met de siterichtlijnen.

Antwoord

Dit artikel bevat zeer nuttige informatie over @font-face, en compatibiliteitsproblemen … voor het geval dat.

Hier zijn enkele mogelijke verbeteringen in uw @ font-face-sectie:

  • Een van uw src-vermeldingen vermeldt “lokaal”. Probeer dat te verwijderen.
  • Gebruik expliciete adressering voor uw bestanden.
  • Zorg ervoor dat u uw lettertypebestanden daadwerkelijk kunt openen, anders krijgt u in ieder geval geen 404-foutmelding.
  • Probeer uw bestanden op dezelfde manier op te sommen als ik, met twee src-vermeldingen: een voor IE en een voor moderne browsers.
  • Kijk of uw lettertypebestanden een TTF-bestand bieden voor Safari en mobiele browsers.

`

@font-face { font-family: "newBaskerville"; src: url("https://{your-domain}.com/wp-content/uploads/useanyfont/190811081519New-Baskerville.eot"); src: url("https://{your-domain}.com/wp-content/uploads/useanyfont/190811081519New-Baskerville.eot?#iefix") format("embedded-opentype"), url("https://{your-domain}.com/wp-content/uploads/useanyfont/190811081519New-Baskerville.woff") format("woff"); }

Pas tenslotte het lettertype toe op je body met fallback-stijlen, zoals je hebt gedaan in je Courier-voorbeeld hierboven: 

body{ font-family: "newBaskerville", Courier, monospace; }

opmerking: Zorg ervoor dat u dezelfde naam bij het toepassen van de naam zoals u deed bij het definiëren ervan. In mijn geval “newBaskerville”, om problemen met spaties en / of interpunctie te voorkomen.

Opmerkingen

  • Als u uw lettertypebestanden niet kunt openen of downloaden via de adresbalk van de browser ', moet u ervoor zorgen dat uw server is geconfigureerd met de juiste mime-typen, zoals ik in uw andere vraagthread suggereerde, voor hetzelfde probleem.
  • Heel erg bedankt. Weet je waarom @font-face alleen het lettertype niet kan wijzigen, en body moet worden gespecificeerd? Hoe zit het met andere lettertypevariatiebestanden, zoals vet of cursief? Is er ook een manier om een tekst die rechtstreeks in header.php is ingevoegd, deze instelling te laten gebruiken? En weet je hoe je het lettertype moet gebruiken bij het bewerken van berichten?

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *