Tudom, hogyan kell csinálni elvileg, ne hivatkozzatok az eddigi fórum-bejegyzésekre :)
A sminkem css mappájába beteszem a négyféle fontfile-t (eot, svg, ttf, woff), az ugyanebben a mappában található style.css-be pedig a font-face meghívását:
@font-face {
font-family: 'solomon_bold_decoregular';
src: url('solomon_bold_deco-webfont.eot');
src: url('solomon_bold_deco-webfont.eot?#iefix') format('embedded-opentype'),
url('solomon_bold_deco-webfont.woff') format('woff'),
url('solomon_bold_deco-webfont.ttf') format('truetype'),
url('solomon_bold_deco-webfont.svg#solomon_bold_decoregular') format('svg');
font-weight: normal;
font-style: normal;
}
Közben ugyanebben a style.css-ben hivatkozok a fontra:
font-family: 'solomon_bold_decoregular';
Mégsem történik semmi. Ugyanennél a selectornál a fontméretet is állítom, az működik, de a fonttípus nem. A saját gépen ugyanez a játék simán működik. Milyen hibalehetőségek lehetnek, amire nem gondoltam? Próbálkoztam cache ürítéssel, de más vajákolás nem jut az eszembe.
Valakinek valamilyen ötlete a jelenség magyarázatára?
Ha a helyin működik, a
Ha a helyin működik, a távolin nem, akkor:
- nincsenek ott a fájlok
- nem olvashatóak
- nem megfelelő fejléccel (MIME-type) van kiszolgálva.
pp
Palócz István
https://palocz.hu | https://tanarurkerem.hu
nem megfelelő MIME-type típus
Az első kettő kizárható, pontosan ugyanabba a folderbe másoltam mind a négy fájltípust, és ugyanezek a fájlok olvashatók a saját gépemen.
Pontosan mit jelent ez a nem megfelelő MIME-type típus?
apróság
Egy apróság, ami nem fogja megoldani a problémádat, de szebb lesz tőle a sminked. :)
Szóval ne a CSS könyvtárba tedd a fontokat, mert azok nem CSS fájlok. Csinálj a CSS könyvtárral egy szinten egy másik könyvtárat, mondjuk „fonts” néven, oda pakold, a CSS-ben pedig így hivatkozz rá: url(../fonts/valami_font_file.eot)
Választ szeretnél? - Új kérdés, új téma - Tesztoldal - Trollkezelés - Frissítés
Szebb? Hmm? Hát pedig a megfelelő MIME type fontos lehet.
A smink ugyan mitől lenne már szebb egy megfelelő MIME-type-pal kapcsolatos fejléctől? :D
Ez egy abszolúte szerveroldali dolog, és a rossz MIME type eléggé működésképtelenné tud tenni dolgokat, például videóformátumokat, svg-t (például letöltésre kínálja fel kiszolgálás helyett), és még sorolhatnám... szóval a MIME type-pal kapcsolatos megjegyzés egyáltalán nem volt rossz ötlet. Nem egyszer fordul elő, hogy a megfelelő kiszolgáláshoz vagy módosítani kell a szerver alapkonfigurációját, vagy pedig helyi .htaccess vagy web.config (vagy más szervernek megfelelő) fájlban, site-ra vonatkozó beállítás-felülbírálásokat kell megadni (amennyiben ez engedélyezett, működőképessé is teheti pl. az általam előbb említett dolgokat).
Éppen ezért nagyon nem mindegy, hogy a szerver hogyan is szolgálja ki ezeket a fájlokat, ezt mindenképp meg kellene nézni.
Példák:
http://stackoverflow.com/questions/2871655/proper-mime-type-for-fonts
http://stackoverflow.com/questions/3594823/mime-type-for-woff-fonts
http://codingstill.com/2013/01/set-mime-types-for-web-fonts-in-iis/
stb.
Aztán simán lehet, hogy nem ez a probléma, lehet például elérési úttal kapcsolatos gond, amire utaltál. DE ha jó az elérési út a CSS-ben megadott fájlokra (pl. amit Kata megadott), akkor elméletben teljesen mindegy, hova teszi ezeket a fájlokat, amíg ezekre jól hivatkozik (amennyiben a szerver onnan képes publikusan kiszolgálni), tehát az sem fogja megoldani, ha áthelyezgeti. Az már másik kérdés, hogy hogyan logikus vagy jól strukturált a smink könyvtára.
Távolról, fórumban debuggolni mindenesetre így látatlanban, ilyen kevés információ birtokában nagyon nehéz lesz.
Nem értelmeztél megfelelően
Nem értelmeztél megfelelően, vagyis megpróbáltad. :)
Amikor azt írtam, hogy „szebb lesz tőle a sminked”, nyilván nem arra gondoltam, hogy jobban fog kinézni az oldal, hanem arra, hogy a forrása átláthatóbb és karbantarthatóbb lesz.
A MIME típusra pedig én nem reagáltam, ha megnézed.
lc? :)
Választ szeretnél? - Új kérdés, új téma - Tesztoldal - Trollkezelés - Frissítés
"rendes" smink mappái :)
+1
'css' mappában nem sok keresnivalója van font-file-oknak; compass-szal dolgozva pedig, mikor "összelőtt" 'sass' és 'css' mappák vannak, akkor pedig szerintem a 'ccs' mappában végképp ne legyen már semmi, amit nem a 'compass compile' tesz bele.
(off-illatot hordoz a szél, de hát akkor már ideírtam) :)
Bocsánat, tényleg félreértettelek
Jaaa, hát én azt hittem, hogy magára a "Pontosan mit jelent ez a nem megfelelő MIME-type típus?" kérdésre reagáltál, mert a kommentált hsz. maga egy egész kérdés volt :D
Akkor bocsánat, úgy látszik, már kicsit betompultam estére, tényleg félreértettelek.
Azzal pedig természetesen teljesen egyetértek, hogy ne a CSS-fájlokkal egy könyvtárban legyenek a betűtípus-fájlok.
ez a modul szerintem erre való
https://drupal.org/project/fontyourface
Ha jól értem a problémádat, szerintem ez megoldás. Én a saját fontkészleteimet simán ezzel feltöltöm és a sminkben be lehet állítani többnyire, hol legyen ez a betűtípus hegesztés nélkül is pl zircon sminknél.
tamoca
1. ötlet
1. ötlet
Az betegeskedő site-ot nézve Chrome developer tools-ban (F12) ránéznék a 'Resources' tab-ra (balról a második a "fejlécében"), az megmondja, hogy az oldalnak sikerült-e definiálnia a fontokat vagy sem: van benne balra egy fa-nézet, abban egy 'mappa' aminek a neve vagy a domain, vagy aloldal esetén az URI legutolsó "argumentuma", és azon belül lesznek lenyitható 'Fonts' meg 'Stylesheets' szekciók.
EDIT: a 'Frames' mappa látszik csak alapból, azt kell kinyitni, hogy amiről itt szó volt, az látsszon.
Ha sikerült definiálni a fontot, és a weben keresztül hozzáférhető a file, akkor a 'Fonts' szekcióban, ha rákattintasz egy font-nevére, akkor a Chrome dev tools odatesz egy preview-et is az ábécé betűiből, tehát kipipálható.
Ha nem találtad itt a 'Fonts' szekciót, akkor pedig lejjebb kell menni lenyitni a 'Stylesheets' szekciót; minden stíluslap mellett írja sárgával, hogy hány hibát talál bennük. Meg kell nézni azt a css-t, amiben definiálod a fontot, hogy nem ír-e valami hibát e körül.
2. ötlet
Úgy is próbálnám, hogy webcímnek megadnám egy font elérési útját a böngésző címsorában, ha ott a font, akkor a böngésző így felkínálja letöltésre/mentésre.
3. ötlet
Megnézném az /admin/reports/status oldalt, lehet hogy ide nem sok köze lesz, de ez csak ilyen alapreflex, sose árt...
4. ötlet
Hát nem vagyok ilyen .htaccess guru, de azért belenéznék, hogy mi minden van benne...
EDIT: 5. ötlet
Megnézném alaposabban a readme-t azon az oldalon, ahonnan a fontot vásároltam, hogy nem fogalmaznak-e meg valami technikai restrikciót (bár ha nálad vannak a fontok és a te szerveredről kell érkezzenek, akkor abba már nem tudom, hogy hogy szólhatna bele bárki (meg localon is ment), de... mindenesetre hasznosak azok a tájékoztatók azért (ha másért nem, hát mert adhatnak még egy plusz ötletet)).
Köszönöm, ez nagyon hasznos volt
Mutat hibákat a CSS-ben és nem látszik a fonts szekció. Úgyhogy nyomozok.
.htaccess írás kicsit javított, de még mindig nem látszik a font
Szia!
A font readme-jében nincs semmi extra.
Az /admin/reports/status oldalon semmi nyomravezető.
A .htaccess-be viszont beírtam a következőket:
AddType application/vnd.ms-fontobject .eot
AddType application/x-font-opentype .otf
AddType image/svg+xml .svg
AddType application/x-font-ttf .ttf
AddType application/font-woff .woff
Ez annyit eredményezett, hogy a fontfile-ok direkt útvonalát (a szerveren) a böngészőbe írva, felkínálja letöltésre a fontot (eddig ez sem működött).
Azonban a Chrome developer tools-ban továbbra sem látszik a fonts szekció, és nem is működik az oldalon a font (history törlés után sem).
Ugyan a Chrome jelez a style.css-ben 3 hibát, DW-ben megnyitva nincs szintaktikai hiba. Meg lehet esetleg valahogy tudni, pontosan mit érzékel a Chrome hibának? Első pillantásra nem találtam.
Valószínű MIME type probléma lesz
Természetesen én is a fonts mappában szándékozom majd tartani a fontjaimat, de első lépésként mindig ki szoktam próbálni a legegyszerűbb felállást, hogy ha hiba van, akkor ne kelljen lokalizálni (jelen esetben például azonnal tudom, hogy nem az elérési úttal van a baj).
A szolgáltatóm nagyon szar, épp leváltom, ezért a MIME type-nál kutakodom tovább.
Igyekszem minél kevesebb modult használni, egyszerűnek tűnik a font family direkt bemásolása, ezért nem ugrottam rá az ezzel foglalkozó modulokra.