Home Forums Pro Themes Education Hub Pro Education HUB with Primary and Secondary Sidebar

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #122389
    Christian Pabst
    Participant

    Can I and HOW can I set up Education HUB Pro with Primnary Sidebar (right side) and Secondary Sidebar (left side) an my Main-Content in the middle using 20% of space for the sidebars each and the rest for the main content in the middle (60%)?

    I tried:
    #sidebar-primary {max-width: 20%;}
    #sidebar-secondary {max-width: 20%;}

    and the sidebars went smaller, but the middle didn’t follow an stayed to small, not using the remaining 60%.

    Thank you. I have only little experiency with CSS.

    #122413
    Christian Pabst
    Participant

    I tried this:

    .home #primary {width : 60%}
    .home #sidebar-primary {width: 20%;}
    .home #sidebar-secondary {width: 20%;}

    …and without any knowledge of CSS it seems to work. So please give me your ok! 🙂 Or show me a better way to do this…

    Thank you

    #122445
    wensolutions
    Keymaster

    Hello,

    Regarding your query, you can set the layout of your pages as per your requirement from the individual page(edited) as shown in the screenshot given below:

    https://prnt.sc/sahfum

    This will help the widget to divide its width to 25% primary and 25% secondary which is managed by the theme.

    Further, managing the sidebar by CSS, you can add below given CSS following the path Admin Panel > Appearance > Customize > Additional CSS

    .home .site-content #primary{
        width: 60%;
    }
    
    .home #sidebar-primary{
         width: 20%;
    }
    
    .home #sidebar-secondary{
        width: 20%;
    }

    Hope this helps.

    If you have further queries, let us know.

    Thank you.

    #122460
    Christian Pabst
    Participant

    Thank you, it works!

    #122466
    wensolutions
    Keymaster

    Hello,

    Glad we could help you.

    Regards.

    #126455
    Lisa Ramish
    Participant

    Hi, When I do this, then I also get a narrow column on my homepage that does have any sidebars. Is there something I can do to adjust the CSS below so that it only applies to pages with sidebars? Thank you!

    `.site-content #primary{
    width: 60%;
    }

    #sidebar-primary{
    width: 20%;
    }

    #sidebar-secondary{
    width: 20%;
    }

    #126456
    Lisa Ramish
    Participant

    Nevermind! I figured it out. I added:

    .global-layout-no-sidebar #primary{
    width: 100%;
    }

    #126476
    wensolutions
    Keymaster

    Hello,

    Glad you found the work around.

    Regards.

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.