[Support request] Sliding menu push page across

[Spencer]

Hi guys,

Just wondering if it is possible for the slide out menu to push the page content across instead of overlaying it?

Also moving the menu to the left hand side.

Like this example? http://www.jellyfish.net

Many thank,
Spencer

[Tom]

Hi there,

Currently this isn’t possible without some pretty heavy customization. However, we’re working on a slide-out nav re-write that will have this as an option 🙂

For now a plugin like this might be helpful: https://en-ca.wordpress.org/plugins/shiftnav-responsive-mobile-menu/

[Engelbrecht]

Hi Tom,

Is the slide-out nav-push page menu anything that is planned in future releases?

[Tom]

It should actually be possible with some CSS now.

Any chance you share the URL to your site with the current slideout nav?

[Engelbrecht]

Yes sure: http://www.bryllupskuller.dk

I had it on my old theme and i loved it! The current slide also works great but i do find it a bit more profesional with the push-to-side menu.

[Tom]

Ah, not as easy as I was hoping for – I’m sorry! I’ll write up an article on this ASAP and will update this post 🙂

[Engelbrecht]

Great – please let me know when you have it written!

[Engelbrecht]

Hi Tom, are you any closer to having the article done or somewhat done? I have hired a developer for various assignments, here by the push menu. Can i supply him with any code that you May have so he dosent do double work?

[Tom]

Not yet – sorry!

We’re using this JS library: http://toomuchdesign.github.io/offside/demos/single-element/

What GP is missing is the container around all of the content, which can be added using hooks.

Then you’d need to add the missing CSS which we removed from GPP which causes that container to slide.

[Engelbrecht]

Hi Tom, thank you for your response. I appriciate it! Is it possible that you could provide the hooks as well for adding the wrapper for all page element? The developer i hired is inexperienced with GP, unfortunately.

[Tom]

The opening element would go into the before_header hook:

<div class="site-wrapper">

Then the closing element would go into the after_footer hook:

</div>

[Alexandro Dupuis Zorrilla]

Hi Tom, I was wondering if there has been updates on the push content feature or if you have some detailed instructions as to how to add css.

Cheers!

Alex

[Tom]

No update yet, but I’d be happy to try to help implement it if you’d like? If so, you’ll need to start by adding the containing element I mentioned above. You can use the Hook Element to do that: https://docs.generatepress.com/article/hooks-element-overview/

[Author]

Posts