Create a sticky wrapper in your WordPress site with Headway

Creating a “sticky” wrapper (one that stays at the top of the screen as a user scrolls) in Headway can be done in 3 clicks!  Many people wanted this feature and typically you see the menu as sticky but that’s not a requirement, of course.

Are you ready to add a Sticky Wrapper? Let’s go!

Step One: Open the wrapper options for the wrapper you want to make sticky


sticky-wrapper-1
Step Two: Click on “Sticky Positioning Tab”

sticky-wrapper-2

Step Three: Click on “Enable Sticky Positioning” and that is it!

sticky-wrapper-3

Save, of course, and then view your site to see the sticky wrapper functionality!

Spread the word!

24 Responses

  1. I’ve tried the sticky positioning for the header on a community Headway template and a made from scratch site and both times although the header sticks the site content scrolls over the header. You can actually see images scroll over the top of my logo in the header instead of disappearing under the header wrapper. Know what I’m sayin’? Am I missing something?

    • Hi Josh,

      This will be addressed in the next release, as far as I know, but for know, a work-around is to select the sticky wrapper in design mode, right click and choose “Edit this instance”, then go to Nudging and ONLY set a z-index of 5 (this number can be higher but so far, 5 has always worked).

  2. Thanks for the helpful article! I am working with the current version of Headway but do not have access to “Sticky Positioning”. It just isn’t there! How do I access it? Thank you!

    • Hi Rebecca,

      Sticky wrappers are in version 3.8.2. If you are using that version and are not seeing the option, please send in a support ticket!

        • Midi,

          The sticky wrapper option is still available in 3.8.7. Be sure you are looking in Grid Mode. If you are, please try temporarily deactivating all plugins to see if one is conflicting.

          If that is not it, please submit a support request through your members dashboard!

  3. I’ve got my header wrapper mirrored across all pages, however, the sticky effect only works on the home page and the blog page. Any thoughts on why this might be?

    Thanks.

    • Hi Levi,

      This was an issue that is fixed in 3.8.2. However, if you mirrored your wrappers before then, simply upgrading to 3.8.2 wouldn’t fix it. You would need to re-mirror.

      If you installed or upgraded to 3.8.2 and then mirrored your sticky wrapper and it is not working, please submit a support ticket.

      https://headwaythemes.com/dashboard/support/

  4. I’ve been playing with sticky nav containers, and I’m wondering how I would go about having it be sticky while on the desktop, but scroll while on mobile/tablet so as to not eat up visual real-estate on smaller devices. Thanks!

    • There’s no option for this in Headway. We use a script for this behavior so I’m not sure it is possible but I will check with our developer. Very sorry for the delay but for official support, please use the support request option in your Members dashboard.

  5. Hi,
    I have enabled the sticky positioning, but my wrapper does not stick. Am I missing something?
    Nothing happens when I do it. I have the latest version (not beta).

    Thanks in advance! Losing my hair over this 😀

  6. Is there any way (built into Headway) to have a sticky footer wrapper? I’d like my footer wrapper with copyright etc. to stick to the bottom of the page when there is a page with very little content and I have a large image as the background for the entire html.

    Thanks Jamie!

  7. Hi! My site is working great overall. 🙂 Thanks Headway. However, the sticky navbar on mobile is going behind the footer. I’ve tried setting the Z-Index to 5 as you suggested, after setting the positioning as mentioned in this article: https://www.smashingmagazine.com/2009/09/the-z-index-css-property-a-comprehensive-look/
    I’m not getting any results at all even tho I futzed around with it for a while. I’d love a helpful and easy solution! 🙂 Thanks in advance. LS

Leave a reply

Copyright © 2016 Vesped Inc. All Rights Reserved. Proudly Powered by Headway and WordPress