Homepage headers

  • Unknown's avatar
    tomcraddockuk · Member ·

    Hi,

    I have two headers I use across my site: one on my homepage and one on all other pages and posts.

    I am looking for a way to make the second header appear on the homepage once a user has scrolled so far that the first header is no longer visible.

    Is this achievable using CSS code? I am on the explorer plan, so cannot edit .php files.

    Kind regards,
    Tom

    WP.com: Yes
    Jetpack: No
    Correct account: Yes

    The blog I need help with is: (visible only to logged in users)

  • staff-totoro · Staff ·

    Hi there,

    It’s great that you have different headers for your homepage and other pages/posts. To make the second header appear on the homepage once a user has scrolled past the first one, this functionality would typically require a bit more than just CSS code. It would usually involve some custom JavaScript or possibly a plugin to achieve this effect.

    Since you mentioned that you’re on the Explorer plan and cannot edit .php files, one option to consider would be to search for a theme that offers a sticky-header feature. There are also some plugins available that can help you achieve this effect without the need to edit the theme files.

    https://wordpress.com/themes/filter/fixed-menu

    Also if I can make a suggestion, I actually prefer the balanced look of the header you use on your internal pages. Have you considered using that for your homepage as well, and instead using the “Youth Councillor for Cannock Chase within Staffordshire Youth Union” text in a Cover Block instead? This is a block you often see on homepages and allows you to set a “hero image” with text overlayed on top of it.

    Here’s how that might look on your homepage instead:


    This would allow you to use a unified header on your site that is simple enough for any page, along with a way to add extra content to your homepage to set it apart, without requiring multiple headers.

    More info about how to work with cover blocks here:

    WP
    Blocks (The Full List) » Cover Block
    in WordPress.com Support
    8 min read
    The Cover block displays an image or video that you can add text and other content on top of — great for headers and other banner-style displays. This guide will show you how to use the Cover block to give any page or post a sleek, professional look. Video Tutorial Video Transcript The cover block is a great way to add some visual interest to your pages and posts. It allows you to

    I hope this information helps, and if you need further assistance or have any other questions, feel free to ask.

  • The topic ‘Homepage headers’ is closed to new replies.