Home › Forums › Pro Themes › Education Hub Pro › Education HUB with Primary and Secondary Sidebar
- This topic has 7 replies, 3 voices, and was last updated 5 years, 4 months ago by
wensolutions.
-
AuthorPosts
-
May 3, 2020 at 9:53 am #122389
Christian Pabst
ParticipantCan 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.
May 3, 2020 at 3:14 pm #122413Christian Pabst
ParticipantI 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
May 4, 2020 at 1:45 am #122445wensolutions
KeymasterHello,
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:
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.
May 4, 2020 at 6:08 am #122460Christian Pabst
ParticipantThank you, it works!
May 4, 2020 at 7:03 am #122466wensolutions
KeymasterHello,
Glad we could help you.
Regards.
June 16, 2020 at 2:11 pm #126455Lisa Ramish
ParticipantHi, 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%;
}June 16, 2020 at 2:13 pm #126456Lisa Ramish
ParticipantNevermind! I figured it out. I added:
.global-layout-no-sidebar #primary{
width: 100%;
}June 16, 2020 at 11:33 pm #126476wensolutions
KeymasterHello,
Glad you found the work around.
Regards.
-
AuthorPosts
- You must be logged in to reply to this topic.





