Support » Theme: OceanWP » Multi Sidebar width

  • Hi, I was wondering is there a way to make sidebars different widths without using CSS? I would like the Social sharing widget to be vertical and the widget area to be a lot smaller? Is this possible or is it something I will have to figure out in CSS :/

    The page I need help with: [log in to see the link]

Viewing 13 replies - 1 through 13 (of 13 total)
  • Hello,

    Go to Customize > General Options > General Settings and adjust the sidebar width as per your need.

    Thread Starter mattyboyzhere

    (@mattyboyzhere)

    This doesn’t work when you have two Sidebars turned on that you want to manipulate separately, like I said I need the left sidebar to be say 100px and the right sidebar to be 500px. Or preferably a %, so like 10% for left sidebar, 60% for main content and 30% for right sidebar.

    Add the below code to the Customize > Custom CSS section to do it and check it works or not.

    aside#left-sidebar {
        width: 10%;
        left: -32%;
    }
    div#primary {
        width: 30%;
        left: 6%;
    }
    aside#right-sidebar {
        width: 60%;
    }

    Did you add any CSS code for the sticky sidebar?

    Thread Starter mattyboyzhere

    (@mattyboyzhere)

    This works wonderfully, had to mess around with some of the percentages but thanks! aside#left-sidebar {
    width: 5%;
    left: -70%;
    }
    div#primary {
    width: 70%;
    left: 5%;
    }
    aside#right-sidebar {
    width: 25%;
    }

    & Yeah although I was still having issues with the sticky left side-bar

    Try to add another widget in the left sidebar and check it also works or not.

    Thread Starter mattyboyzhere

    (@mattyboyzhere)

    I only wanted the Social sharing in the left widget/sidebar. Is there any reason why I can’t get it to stick when using #left-sidebar ?

    No, I am just asking to add a widget temporarily to troubleshoot the issue only?

    Thread Starter mattyboyzhere

    (@mattyboyzhere)

    I’ve added one, now what?

    I didn’t see the sticky class as well as other widgets on the left sidebar. Did you remove it?

    Thread Starter mattyboyzhere

    (@mattyboyzhere)

    Done, sorry was experimenting with creating a new sidebar, didn’t work.

    Try to use the below code and check it fixes the issue or not.

    aside#left-sidebar.is_stuck {
        position: relative !important;
        left: -200vh !important;
    }
    • This reply was modified 3 years, 9 months ago by Amit Singh.
    Thread Starter mattyboyzhere

    (@mattyboyzhere)

    Didn’t work

    It’s very weird. Try to remove all the CSS related to the sticky sidebar and only use the Stick Anything plugin to stick it. It seems there is some code conflcit, therefore, it is not working properly.

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Multi Sidebar width’ is closed to new replies.