Шрифт Awesome не работает в Firefox и IE

Question

У меня проблема с шрифтом, удивительным, который включен в сайт wordpress. В Firefox и IE значки вообще не отображаются, однако в Chrome & Safari работает нормально.

Я нашел «решения», которые говорят, что мне нужен .htaccess с определенным контентом для поддержки этих браузеров, однако, если я использую этот подход, Safari и Chrome внезапно возникают проблемы, а Firefox и IE все еще не за работой.

У кого-нибудь есть идеи?

Вот сообщение об ошибке потушить журнал ошибок DEV FireFox при загрузке мой сайт:

Fehler: загружаемый шрифт: Ошибка загрузки (семейство шрифтов: «icomoon» стиль: нормальный вес: нормальный стрейч : нормальный индекс ЦСИ: 2): плохой URI или доступ межсайтовое не допускается источник: http://mysite.de/wp-content/themes/heat/fonts/icomoon/icomoon.woff Quelldatei: http://mysite.de/wp-content/themes/heat/style.css Zeile: 0 Quelltext: @ шрифт-слойного {семейство шрифтов: "icomoon"; font-style: normal; font-weight: normal; src: url ("fonts/icomoon/icomoon.eot? #iefix") format ("embedded-opentype"), url ("fonts/icomoon/icomoon.svg # icomoon") format ("svg"), url (" fonts/icomoon/icomoon.woff ") (" woff "), url (" fonts/icomoon/icomoon.ttf ") format (" truetype "); }

Спасибо вам за помощь!

P.S. Кстати, значки на шрифте удивительного веб-сайта отлично работают в FF.

• UPDATE *

хорошо прочитав много сообщений форума по этому вопросу я пришел к следующему выводу: большинство людей с этой проблемой, потому что они загружаются своими шрифтами от внешнего сервера , добавив код .htaccess, чтобы позволить FF делать именно это, они решают свою проблему. теперь, поскольку я загружаю свои шрифты с моего собственного сервера, подход .htaccess не помог мне. то, что избавилось от сообщения об ошибке, показанного выше, однако, изменило путь к шрифту в css от относительного к абсолютному пути. теперь самое смешное - сообщение об ошибке больше не появляется при загрузке сайта, но значки тоже не отображаются! все еще нет изменений, но нет сообщения об ошибке. Я смущен!

• UPDATE 2 *

Я нашел починку -

После изменения всех путей в CSS от по отношению к абсолютной (т.е. www.mysite.de/fonts/... вместо того, чтобы просто/шрифты/...) и добавив файл .htaccess, содержащий следующие строки:

<FilesMatch ".(ttf|otf|eot|woff)$"> 
<IfModule mod_headers.c> 
Header set Access-Control-Allow-Origin "*" 
</IfModule> 
</FilesMatch> 

в каталог/шрифты, все отлично работает в Firefox, Chrome и Safari. У меня еще не было возможности проверить IE, но, похоже, это было проблемой.

Надеюсь, что кто-то, столкнувшись с теми же проблемами, получит некоторую помощь от этого.

Answer 1

Если вы похожи на меня, изменение файла web.config - это то, к чему вы не можете прикасаться.

Попробуйте сохранить все файлы шрифтов (.eot, .ttf и т. Д.) В их собственную локальную папку и связать их локально, а не с FontAwesome CDN. Сбрасывал его в IE и FF для меня каждый раз.

@font-face{ font-family:'FontAwesome'; src:url('../_fonts/fontawesome-webfont.eot'); } 

Answer 2

Я знаю, что это старый пост, но это помогло мне выяснить некоторые проблемы.

У меня есть стандартная конфигурация apache и mod_headers.

У меня есть /font/ папку в DOCUMENT_ROOT, добавив .htaccess в такой папке (<DOCUMENT_ROOT>/font/.htaccess) с содержанием предложенной Markus работал на всех браузерах:

<FilesMatch ".(ttf|otf|eot|woff)$"> 
    <IfModule mod_headers.c> 
    Header set Access-Control-Allow-Origin "*" 
    </IfModule> 
</FilesMatch> 

Answer 3

Вы должны добавить локальное правило, если вам хотите, чтобы Firefox использовал шрифт при установке на компьютер. См. https://developer.mozilla.org/Web/CSS/@font-face.

@font-face { font-family: 'FontAwesome'; src: local(''FontAwesome'); } 

Answer 4

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/3.2.1/css/font-awesome.min.css" media="all" rel="stylesheet" type="text/css"> 

Добавьте эту строку в header.php файл темы, которую вы используете. Это исправление сработало для меня.