Changing font size on title page

If you mean the static front-page title, give this a try in your custom CSS to match the size of your site title:

.home .entry-title {
  font-size: 49px;
}

Don’t edit the theme files directly, otherwise your changes will be overwritten every time the theme is updated.

An easy way to add custom CSS is to use the custom CSS editor included in the Customizer with WordPress 4.7. Head to Appearance > Customize > Additional CSS to add your custom CSS.

Thanks for getting back to me Kathryn.

Unfortunately, adding that code to the Additional CSS didn’t change the size of the site description/front-page title.

An underlying question is why the designers of Publication made the description larger than the site name in the first place. Seems rather backwards from what most people are trying to emphasize on their home page or am I missing something? This should be easier to customize.

Hey there – it didn’t work because you have the CC in between comment tags:

/*
.home .entry-title {
  font-size: 49px;
}
*/

Remove the comment tags and it should work:

.home .entry-title {
  font-size: 49px;
}

An underlying question is why the designers of Publication made the description larger than the site name in the first place. Seems rather backwards from what most people are trying to emphasize on their home page or am I missing something?

That’s how Publication was designed – the featured post title has the largest text, to draw your eye to the latest featured content.

https://publicationdemo.wordpress.com/

If I can help with anything else, just let me know.

Thanks Kathryn! That solved the problem.

Great! I’ll mark this thread as resolved but feel free to start a new one if you need help with anything else.

I just discovered that it works for computers and iPad but not on the iPhone. Is there any way to correct that?

Hmm – it looks like the Neuton Regular font isn’t being picked up on mobile either — I see what looks like Times or Times Roman.

In terms of the font size modification, I’m not sure why it’s not being applied, as the Customizer CSS should apply to the site, regardless of screen size.

Could you try temporarily changing the colour of your site title to confirm that the CSS really isn’t being picked up? It’ll be more obvious that way. So change what I gave you earlier to this:

.home .entry-title {
  font-size: 49px;
  color: #b0b;
}

If your featured post title on mobile does not turn purple we know the custom CSS somehow isn’t being applied.

The next troubleshooting step I’d suggest at that point is to deactivate all your plugins temporarily to make sure there isn’t one interfering with your font and custom CSS on mobile. If the problem goes away, reactivate them one by one to find the culprit.

The font did turn purple on all three devices.

Thanks for confirming, that’s good to know. You can remove the purple code if you haven’t already and I will get back to you tomorrow with some further guidance.

Now that we’ve confirmed that your custom CSS is being picked up on mobile devices – thanks to the purple colour test – let’s try adding an additional piece of CSS to make the font even smaller on mobile than on desktop devices.

Try adding this in addition to the existing CSS:

@media screen and (max-width: 767px) {
  .home .entry-title {
    font-size: 20px;
  }
}

What this does is makes the font size even smaller on screens smaller than 768px.

You can adjust both that maximum screen width as well as the font size as you like.

Thanks Kathryn ~ that works perfectly!

Wonderful!

I’ll mark this thread as resolved but feel free to start a new one if you need help with anything else.