Twentyseventeen title font

manuschwendener · Member · Apr 20, 2017 at 3:43 pm
Copy link

Add topic to favorites
```
* {
	font-family: "Univers Light", sans-serif;
	color: #46505A;
	text-transform: none !important;
}

.wf-active .site-description {
	font-family: "Univers Light", sans-serif;
}
```
If you click around in the menu of https://ubblogtest.wordpress.com the css gets loaded in a second step, making the title jump after each click.

Much better in Firefox (Mac, Win, iOS) than Chrome (Mac) or IE (Win)

The blog I need help with is: (visible only to logged in users)
kathrynwp · Staff · Apr 20, 2017 at 5:09 pm
Copy link
As I mentioned in the other thread you posted in, we display text in the theme’s default font first. This way, people can start reading your content before the custom font loads, instead of waiting while looking at a blank page. This might mean that there’s a flash of a different font before the page finishes loading, but we think overall this is better for folks on slower connections than seeing a blank screen.

The CSS snippet above will display a blank screen instead.
```
.wf-loading body {
  visibility: hidden;
}
```
manuschwendener · Member · Apr 20, 2017 at 5:23 pm
Copy link
As you say: not better (makes the whole site flash instead of just the title).
manuschwendener · Member · Apr 20, 2017 at 5:27 pm
Copy link
But is it necessary to reload the header after each click? It is the same for the whole site.
kathrynwp · Staff · Apr 20, 2017 at 5:34 pm
Copy link
This CSS workaround is the only trick I know, other than sticking with a theme’s default fonts.

I’m not sure I understand your question about reloading the header, can you explain a bit more what you mean?
garysixtyeight · Member · Apr 20, 2017 at 6:00 pm
Copy link
But is it necessary to reload the header after each click? It is the same for the whole site.

If you mean an app-like experience where the content would be loaded without the header section being reloaded each time a different page is clicked, that would require using something like ajax.

That isn’t currently possible.
manuschwendener · Member · Apr 20, 2017 at 7:37 pm
Copy link
> isn’t currently possible

Ok, thank you (and yes, that’s what I meant).
garysixtyeight · Member · Apr 20, 2017 at 7:39 pm
Copy link
You’re welcome.
kathrynwp · Staff · Apr 20, 2017 at 7:58 pm
Copy link
Thanks from me as well, Gary. I’m glad you interpreted that correctly. :)
manuschwendener · Member · Apr 30, 2017 at 8:15 am
Copy link
(Same here: https://en.forums.wordpress.com/topic/font-bug-in-my-site-title-heading)

Would it be possible that you load the CSS for the site title first, then the text, then afterwards the rest of the CSS? The pages would still hop, but not so obviously.

I wouldn’t mind adding separate instructions in the CSS for the site title.

Or is there an instruction for “don’t reload the site title if I’m already on this site”?
kathrynwp · Staff · May 1, 2017 at 2:00 pm
Copy link
We can’t control the load order of elements on the page, nor are we able to specify not to reload the site title if already on the site. If this is something that really bothers you a lot, my suggestion would be to stick with the theme’s default fonts.
manuschwendener · Member · May 1, 2017 at 4:06 pm
Copy link
Ok, thank you, Kathryn.

No items found.