[Resolved] Different header

Home Forums Support Different header

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #1425387
    Jan Pecenka

    Hi, is possible have two header for one content?
    I mean – for desktop have fullscreen feature image and for mobile not.
    Thanks. Maybe I wrong described it.

    #1425433
    Leo
    Staff
    Customer Support

    Hi there,

    Tough to tell without seeing your current set up.

    Any chance you can link us to the site in question?

    You can edit the original topic and use the private URL field.

    Let me know 🙂

    #1428323
    Jan Pecenka

    Hi, I add a webpage.

    #1428357
    Leo
    Staff
    Customer Support

    Are you referring to the header element/page hero?

    You can hide that entire element by adding hide-on-mobile class in the custom CSS field:
    https://docs.generatepress.com/article/header-element-overview/#element-classes

    Let me know if this helps 🙂

    #1431262
    Jan Pecenka

    Hi, it works but I need something else.
    For desktop as fullscrenn, for tablet and mobile like homepage.
    It is possible?

    #1431726
    David
    Staff
    Customer Support

    Hi there,

    add this CSS:

    @media(max-width: 1024px) {
        .single-post .page-hero {
            min-height: 300px;
        }
    }

    Change the 300px to set the height you want for mobile and tablet.

    #1432277
    Jan Pecenka

    It works. I add these breakpoints:

    @media
    (max-width: 567px) {
    .single-post .page-hero {
    min-height: 240px;
    }
    }

    @media
    (min-width: 568px) and (max-width: 768px) {
    .single-post .page-hero {
    min-height: 360px;
    }
    }

    @media
    (min-width: 769px) and (max-width: 1024px) {
    .single-post .page-hero {
    min-height: 480px;
    }
    }

    @media
    (min-width: 1025px) and (max-width: 1279px) {
    .single-post .page-hero {
    min-height: 720px;
    }
    }

    THANK YOU

    #1432717
    David
    Staff
    Customer Support
    #1435741
    Jan Pecenka

    Sorry for re-open. I have a little question. How i set this on specific page via element. I try .single-page but not work. I updated website link in first post.

    #1435804
    Elvin
    Customer Support

    Hi Jan,

    You can try making a GP Hook Element containing your <style> ... </style> and set the Display rule to the specific page you want it to apply to.

    Here’s a demo video.
    https://share.getcloudapp.com/mXuyQNGw

    What basically happens here is we only applied the styling to the homepage/frontpage by placing the <style> inside the wp_head or <head> tag of the homepage/frontpage.

    #1438415
    Jan Pecenka

    Yes. This is it. Thanks!

    #1438486
    Elvin
    Customer Support

    No problem.:)

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