Korektní změna definice @font-face « Fórum podpory WordPressu

Fórum podpory WordPressu » Problémy s WordPressem

Korektní změna definice @font-face

(10 příspěvků) (3 uživatelé)

Téma založil togur (a je staré 11 měsíců)
Naposledy odpověděl togur

Štítky:

togur
Uživatel
V šabloně je definován vlastní font:
```
@font-face {
    font-family: 'ColaborateThinRegular';
    src: url('fonts/ColabThi-webfont.eot');
    src: url('fonts/ColabThi-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ColabThi-webfont.woff') format('woff'),
         url('fonts/ColabThi-webfont.ttf') format('truetype'),
         url('fonts/ColabThi-webfont.svg#ColaborateThinRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
```
Vzhledem k tomu, že font nezobrazuje správně diakritiku, chci předpis změnit tak aby zobrazoval defaultní font definovaný v body.

Korektní řešení asi bude vytvořit child theme a ve style.css změnit definici.
Jak správně zapsat, že zdroj se má rovnat body (Helvetica, Arial, sans-serif)?

Jde to i nějak jinak / lépe?

Dík za každý tip.
Příspěvek je starý 11 měsíců #
Lukenzi
Uživatel

A co to smazat?

Příspěvek je starý 11 měsíců #
togur
Uživatel

Ano to bude fungovat. Do upgrade?

Příspěvek je starý 11 měsíců #
togur
Uživatel

Řešení, které navrhuje Lukenzi je funkční. Ale při prvním upgrade šablony přijdu o úpravy. Tomu se chci vyhnout.

Napadlo mě v css child theme uvést v definici @font-face neexistující url. Pak browser font nenajde a použije definici v body. Je to ale košer? Nedá se to lépe? Co kdybych chtěl ten typ fontu přiřadit na defaultní serif sadu (na rozdíl od body, která je sans-serif)?

Příspěvek je starý 11 měsíců #
Lukenzi
Uživatel

child theme je dobrá volba pokud se bojíš aktualizací, prázdné URL vadit nebude ale košer to rozhodně není :) Je to 1 http dotaz navíc a tedy zpomalení načítání (sice kapka v moři, ale...)

Jiné řešení mě nenapadá.

Příspěvek je starý 11 měsíců #
togur
Uživatel
lukenzi: díky.

Stál při mě Google a tohle jsem našel: http://www.w3.org/TR/css3-fonts/#font-resources

Takže funguje
```
@font-face {
    font-family: 'ColaborateThinRegular';
    src: local(Cambria), local(Times New Roman);
}
```
Uvědomuji si nevýhody ale nic lepšího už asi není (použití názvu rodiny fontů nefunguje). Buď tohle nebo se naučit nedělat si starosti a mít rád aktualizace ;-)
Příspěvek je starý 11 měsíců #
Lukenzi
Uživatel

A podobný font i s háčky se nedá najít na http://www.google.com/webfonts ? Podle názvu jsem nic nenašel ale možná tam bude i pěknější :)

Příspěvek je starý 11 měsíců #
togur
Uživatel

"Vždyť je to tak prosté, milý Watsone!"
Jasně že máš pravdu! Já se snad picnu!
Díky!

Příspěvek je starý 11 měsíců #
admin
Správce

togur: Jaké má přesně nevýhody výše uvedená definice, kdy tomu původně načítanému fontu přiřadíte nějaký lokální (systémový) font?

A ještě mě napadlo, že by se @font-face vlastně nemusel vůbec měnit, ale v odvozené šabloně by se pak musel měnit font u všech definovaných prvků. Tedy neměnilo by se načítání fontu ColaborateThinRegular, ale nikde by se nepoužil, respektive by se všude použil např. font Cambria. Ale to asi záleží na šabloně, na kolika místech by se to muselo měnit.

A všechna řešení mají asi jednu hlavní nevýhodu - stále se bude načítat v původní šabloně definovaný font ColaborateThinRegular, i když to v odvozené šabloně změníme? Takže z hlediska optimalizace webu by asi bylo nejlepší v podstatě to "nejhorší" řešení - umáznout to v původní šabloně :-)

Příspěvek je starý 11 měsíců #
togur
Uživatel

admin: (ad nevýhoda) nelze použít obecný název font family -> jak to ošetřit pro různé platformy. Jistě, nic zásadního.

Důvodem, proč nechci šahat do původní šablony je, že se použití fontu vyskytuje v původním css na více místech.

Ano, umazání definice by bylo asi nejjednoduší. Ale ve všech "best practices" varují před zásahem do původní šablony a upřednostňují child theme. Asi jsem příliš úzkostlivý ;-)

Každopádně díky všem za podnětné připomínky.

Příspěvek je starý 11 měsíců #

RSS zdroj pro toto téma

Odpovědět

Pro odeslání příspěvku musíte být přihlášeni.

Podpořte nás!

Reklama

Korektní změna definice @font-face

Odpovědět