[Resolved] Issues with Secondary menu

[Juhana]

Hi,
I’m trying to make a secondary menu to some of the pages.
1. Now it drops after the content in mobile. How I get it over the page header?
2. How could I place it without white space above it or on the left?
3. Is it possible to use Sections with left sidebar navigation? Now the whole navigation disappears when I add a section to the page.

Thanks!

[David]

Hi there,

1. you could use CSS Flexbox to re-order the content on mobile – like so:

@media (max-width: 768px) {
    .site-content {
        display: flex;
        flex-direction: column-reverse;
    }

    .inside-left-sidebar {
        margin-top: 0 !important;
    }
}

2. The above CSS will place it fill width and no gap above on mobile. Let me know if thats what you mean.

3. Sections being a simple pagebuilder removes all theme elements from the content, but there is this PHP Filter to allow them to be displayed:

https://docs.generatepress.com/article/allow-sidebars-sections/

[Juhana]

Excellent! Thanks a lot! In addition, would it be possible to get the whole secondary menu to the left on wide desktops? I mean so that the menu would always start from the browser’s left edge without any margin because of the container width…

[David]

Try this:

@media (min-width: 769px) {
    #left-sidebar {
        position: absolute;
        left: 0;
        max-width: 330px;
    }
}

[Juhana]

Thanks David!!!

[David]

You’re welcome

[Author]

Posts