Archived topic
When click-on Mobile menu , content was sliding
15 replies · Started by Bruce Wayne on January 17, 2021
is there anyway to click-on Mobile menu and the content still there and not sliding.
Hi Bruce,
I just checked your website on my phone, it seems all normal, nothing is sliding.
Can you specify the issue here? Thanks!
if you see here from below link , the page content was sliding down after i click menu
can we sticky all content there without sliding ?
Oh I see what you mean, then off canvas panel will be what you are looking for.
https://docs.generatepress.com/article/off-canvas-panel-overview/
Let me know :)
sound great , how to add facebook icon like this
https://docs.generatepress.com/wp-content/uploads/2019/03/overlay-1024x647.png
also how to center text menu ?
Hi,
The image you've linked doesn't seem to work.
But if what you meant with it is to add the icons inside the off-canvas panel, you can use the Off canvas panel widget area which is also within the page Ying linked.
https://docs.generatepress.com/article/off-canvas-panel-overview/#off-canvas-panel-widget-area
ok then check this link picture below
how to
- LOGO at the top
- center the text menu
- adding icon below like left side
thanks.
If you want to fully replicate this off canvas menu, go to Appearance > Customize > Layout > Off Canvas Panel and set the "Style" to "Overlay".
You then go to Appearance > Customize > Color > Off Canvas Panel and play around with the colors.
– LOGO at the top
You can add this PHP snippet:
add_action( 'generate_inside_slideout_navigation', function() {
generate_construct_logo();
} );
And then add this CSS:
.slideout-navigation .site-logo {
width: 110px;
margin: 20px auto;
text-align: center;
}
– center the text menu
Things will be automatically centered when off canvas style is set to "Overlay".
– adding icon below like left side
You can add your icons through the widget area on Appearance > Widgets. The widget area within the off canvas is labeled "Off Canvas Panel widget area".
https://share.getcloudapp.com/YEuQn7PP
https://docs.generatepress.com/article/off-canvas-panel-overview/#off-canvas-panel-widget-area
where can i add this
You can add this PHP snippet:
add_action( 'generate_inside_slideout_navigation', function() {
generate_construct_logo();
} );
Here's how to add PHP snippets:
https://docs.generatepress.com/article/adding-php/
As mentioned in the documentation, you can either use a child theme's functions.php or the Code Snippet plugin.
can you check my dummy site here.
it's show logo now but look like it's not at the center
also for the text menu not at the center.
about adding facebook icon , i try to searching any widget relate with the icon but i dont see anything there. can you advise ?
thanks.
Hi there,
you can use this CSS to center the log and the menu items:
html {
font-family: sans-serif;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust:100%
}
#generate-slideout-menu,
#generate-slideout-menu ul li a{
text-align: center;
}
Looks like you're already using Font Awesome icons, so you can simply add a new menu item and sue the FA Icon for the label - see this doc:
https://docs.generatepress.com/article/adding-icons-to-menu-items/
not working , but fine i will add another widget for images
thanks David