Tagged: x
-
AuthorPosts
-
October 26, 2016 at 4:20 pm #1232124
Hi there,
I know this is a common problem, but I went though the database and still couldn’t find a fix.
I added the following to my global css customizer:
@font-face { font-family: "gotham-bold"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Bold.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Bold.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Bold.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "gotham-book"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Book.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Book.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Book.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "jubilat-bold"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Jubilat-Bold.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Jubilat-Bold.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Jubilat-Bold.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-bold"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-bold-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-bold-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-bold-webfont.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: “gibson-regular”; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-regular-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-regular-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-regular-webfont.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: “gibson-light”; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-light-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-light-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-light-webfont.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-semibold"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-semibold-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-semibold-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-semibold-webfont.ttf') format('truetype'), font-weight: normal; font-style: normal; }
And while all the fonts show up fine on Safari and Chrome, it doesn’t work on iOS (10.1). I’ve cleared cache and opened it on different phones, but still no luck.
My site: http://hsaraid.pointblankstaging.com/home/
Thanks!
October 26, 2016 at 10:07 pm #1232549Hello There,
Thanks for writing in! I have checked your site and it turns out that you have inserted an invalid quotes which invalidates the whole css block. Please see this screenshot: http://prntscr.com/czg6jh
Please have you css code updated and use this instead:
@font-face { font-family: "gotham-bold"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Bold.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Bold.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Bold.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "gotham-book"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Book.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Book.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Book.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "jubilat-bold"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Jubilat-Bold.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Jubilat-Bold.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Jubilat-Bold.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-bold"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-bold-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-bold-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-bold-webfont.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-regular"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-regular-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-regular-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-regular-webfont.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-light"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-light-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-light-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-light-webfont.ttf') format('truetype'), font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-semibold"; url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-semibold-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-semibold-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-semibold-webfont.ttf') format('truetype'), font-weight: normal; font-style: normal; }
Hope this helps. Kindly let us know.
October 28, 2016 at 12:08 pm #1234991Hi there, thanks for catching that. I made the change, but it still doesn’t show up on iOS.
October 28, 2016 at 10:05 pm #1235532Hello Again,
A closer look with your code seems to me that it is invalid. The correct @font-face format should be like this:
@font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('webfont.woff') format('woff'), /* Pretty Modern Browsers */ url('webfont.ttf') format('truetype'), /* Safari, Android, iOS */ url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */ }
– https://css-tricks.com/snippets/css/using-font-face/
So I think the correct code is this;
@font-face { font-family: "gotham-bold"; src: url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Bold.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Bold.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Bold.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: "gotham-book"; src: url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Book.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Book.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Gotham-Book.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: "jubilat-bold"; src: url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Jubilat-Bold.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Jubilat-Bold.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/Jubilat-Bold.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-bold"; src: url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-bold-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-bold-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-bold-webfont.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-regular"; src: url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-regular-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-regular-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-regular-webfont.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-light"; src: url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-light-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-light-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-light-webfont.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: "gibson-semibold"; src: url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-semibold-webfont.woff') format('woff'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-semibold-webfont.woff2') format('woff2'), url('http://hsaraid.pointblankstaging.com/wp-content/themes/x/fonts/gibson-semibold-webfont.ttf') format('truetype'); font-weight: normal; font-style: normal; }
Hope this helps.
October 31, 2016 at 5:07 pm #1238417Amazing! That did it, much appreciated!
October 31, 2016 at 10:07 pm #1238667You are most welcome. 🙂
-
AuthorPosts