Archived topic
Blog Post Mobile Title To Big
10 replies · Started by James on January 10, 2022
Hi there,
I believe you were trying to show a sample site to be used as reference but it wasn't showing up on the video.
Can you link us to this reference site so we can check and inspect it and see how it can be implemented on your site?
How can I make the title of my post smaller on Mobile? It is way to big..
How can I make the title of my post smaller on Mobile? It is way to big..
There are 2 parts of why the title is too large.
1st is the most obvious part which is simply because the title is too long. Consider having shorter titles for the posts is possible.
The other part is the font.
This reference site you've linked uses a smaller font size for its post titles on smaller viewports.
You can do this on GeneratePress as well, through the Appearance > Customize > Typography setting.
On this setting, click "Add typography" button and set the target to "Single content title (h1)" and click the mobile icon to select the mobile font size for the post title.
The setting looks like this - https://share.getcloudapp.com/NQuxDNj6
I'd suggest having a custom field specifically for the sub-headline and have it hooked in below the post title.
And then replace the manually typed sub-headline w/ the a shortcode equivalent of the sub-headline custom field so the sub-headline is dynamically displayed on each posts depending on what was typed-in on the field.
You'll need a plugin like ACF for the custom field.
The hooking part will require you creating a Hook element as set it's display rule location to "Post - All posts" with the Hook set to generate_after_entry_title.
Example settings:
- Making the field = https://share.getcloudapp.com/BludZW1q
- Displaying the value of the field right below the title using a Hook element = https://share.getcloudapp.com/d5uNvn6P
- typing in the subheadline when you edit the post - https://share.getcloudapp.com/eDul67lz
I have a similar issue with huge titles on mobile, although in this case they are huge in Safari on desktops as well and now they are also in the newest version of Chrome (on any device). We added a single content title as we built the site, so this is happening despite that. Also in the latest version of Chrome, some posts have the H1 headers turning white, so they are not visible on the white background. Any ideas or suggestions for what might be happening here? Thank you in advance.
Hi Krisztian,
To have a better understanding of the issue, may you kindly start a new topic and provide the link to the site in question?
You may use the private information field for this(only topic starters can use the private information field): https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
Kindly add the description in the new topic as well.
Hope to hear from you soon. :)
Sure, no worries, thank you Fernando.
Thank you Krisztian!
