Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

different versions of the headline for desktop and mobile

  • Hi there,

    I would like to display different line breaks for the desktop and mobile version of the first and the second headline – which is all the main healdine text above the fold.

    Would prefer the use of continuous text to fit on mobile display and to minimize empty space in the headline. if I change the mobile line breaks, it would also change desktop line breaks.

    How can I adjust this using GP premium and Gblocks?

    thanks,
    Zoltan

  • Hi there,

    line breaks are added using the </br> HTML Tag. So you can’t move them or change how they behave using CSS. All you could do is use some CSS to “remove” them, so you may as well do the following:

    Create 2 separate blocks for that headline; one for the desktop version and one for the mobile version, and use the Advanced > Hide on device options to show only one. Then you can edit the breaks how ever you require

  • Thanks David!

    I have created a separate container for the H1 headline block for mobile only and desktop only. Formatting-wise this works perfectly on both desktop and mobile.

    There is only one issue with this – now the homepage has two (duplicate) H1 tags showing (both in Ahrefs extension/Detailed SEO extension,etc) which is not ideal for SEO – despite using the “Advanced > Hide”.

    Headings: Multiple H1 tags
    H1: Grow ………………………………….
    H1: Grow ………………………………….

    Are the duplicate SEO tags showing expected after hiding a block or I need to change something here?

    Thanks

  • I just did a lighthouse tes for SEO on your site, it scores 100%. So I don’t think Google cares about the two h1.

  • Hi,

    1. Please remove the link which identifies my website. I dont neeed competitors and I never shared my website here on GP support.

    2. A duplicate H1 tag is an onpage SEO error (and should be avoided) – Lightouse is for checking core web vitals, scripts, page blocking, etc and for tech SEO – it does not check your on-page SEO.

    3. Love the shadows – of the duplicate H1 title – it shows up twice if you check it again. Unfortuntely, I have got the same duplicate H1 problem on a mobile device just checked. Despite generateblocks supposedly blocking it. If you check your screenshot you will actually notice the same title twice. Inconvenient? Sure it is. An SEO error? You bet.

    4. I would appreciate a correct response regarding a working solution from David or Leo on this one – and please remove my website screenshoot from the public forum – this is not the way to do premium support…

    thanks
    Zoltan

  • if you think duplicated h1 is a big problem, then I’m out of idea, feel free to use only 1 h1, but you might need to sacrifice the mobile or desktop layout.

    3. Love the shadows – of the duplicate H1 title

    I do not see shadows of h1, do you mean the semi-transparent effect?

    I do see 2 h1 titles, did you toggle the correct hide on option in the advanced panel?

  • Closing this thread, because I did not get a working solution from Ying and she is “out of idea”.

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.