Сайт не загружается в Safari iOS после добавления шрифта - PullRequest
1 голос
/ 01 апреля 2020

Я добавил новый шрифт на свой сайт WordPress. Шрифт отображается правильно, и сайт загружается в chrome и firefox как на настольном, так и на мобильном устройствах. Он загружается и на настольном сафари, однако на сафари iOS сайт не загружается. это просто как бы застревает в состоянии загрузки с горизонтальной синей полосой в верхней части четверти пути. Если я удалю шрифт, то проблема исчезнет. Кто-нибудь сталкивался с такой проблемой? Я не смог найти каких-либо решений в Интернете.

Я следовал советам этой статьи

И этой статье говорится, что мне нужно указать вес шрифта, но даже когда Я сделал так, что проблема сохраняется

Вот мой код:

    @font-face {
    font-family: 'Boston Light';  
    src: url('custom-styles/fonts/Boston-Light.woff') format('woff');
}
@font-face {
    font-family: 'Boston Regular';
    src: url('custom-styles/fonts/Boston-Regular.woff') format('woff'); 
}
@font-face {
    font-family: 'Boston SemiBold';  
    src: url('custom-styles/fonts/Boston-SemiBold.woff') format('woff');
}
@font-face {
    font-family: 'Boston Bold';  
    src: url('custom-styles/fonts/Boston-Bold.woff') format('woff');
}
body, button, input, select, textarea, h1, h2, h3, h4, h5, h6, p, .tagcloud a {
    font-family: 'Boston Regular', 'Open Sans', Georgia, sans-serif;
}
.menu-main-navigation-container a,
.menu-main-navigation-container a:hover,
.menu-main-navigation-container a:focus {/*nav items*/
    color: #744364;
    font-family: 'Boston Light', Montserrat, "Helvetica Neue", sans-serif;
}

Ответы [ 2 ]

1 голос
/ 01 апреля 2020

Попробуйте использовать формат woff2 этих шрифтов.

Я нашел пример Boston Regular здесь .

0 голосов
/ 01 апреля 2020

У меня нет более глубоких внутренностей в этом, но у меня когда-то была похожая проблема. Я изменил путь, добавив / перед папкой, и это помогло. Возможно, вы захотите попробовать.

Попробуйте добавить / в начале ко всем URL, как это:

src: url('/custom-styles/fonts/Boston-Light.woff') format('woff');
...