This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Adjusting widths of content and sidebars

  • Creator
    Topic
  • #9918
    jahuron
    Participant

    Thanks again for your help with the category issue before. I have one other question for you. I’ve tried to add several widgets to the 2 sidebars, but the widgets don’t seem to fit in (or correctly in) the widget box. How would I go about widening the left/right sidebars?

    Thanks in advance for any help you can offer, Jason!

    Josh

Viewing 6 replies - 1 through 6 (of 6 total)
  • Author
    Replies
  • #9934
    Jason Bobich
    Keymaster

    This would be a CSS customization you’d need to make to the theme, which my be a bit complicated. You can see all of the framework’s sidebar layout column width CSS at the top of /framework/frontend/assets/css/themeblvd.css, if you want to copy any to your Child theme’s CSS to modify.

    ========

    For CSS changes, it’s a good idea to use a tool like firebug or Google Chrome’s built-in developer tools to locate them and then put the edits either in your child theme or in the “Custom CSS” option on your theme options page.

    Also, here’s a helpful tutorial on how to use Firebug – http://vimeo.com/20917974. The only thing I’d suggest not doing is actually making edits to the theme’s CSS files, as it shows at the end of that video. However, the video serves as a good introduction to Firebug and how it can be used to find what CSS is effecting certain areas of your site without ever digging around in any files.

    #9967
    jahuron
    Participant

    Thanks very much for your reply. I was able to find the code, and look through it You’re right, this is a little complicated. Here is the link to the code you mentioned for the sidebars: http://tinypic.com/r/2a76fdh/5

    If you have a little time, would you mind pointing me in the right direction to widen my 2 sidebars?

    Thanks, Jason!

    Josh

    #9977
    Jason Bobich
    Keymaster

    So, what sidebar layout are you changing?

    #9981
    jahuron
    Participant

    I’m talking about the two sidebars on either side of the article posts in the middle column. The website is http://www.inroadpress.com. I’d like the left sidebar to align with the left hand side of the Auto category on the primary menu and the right sidebar to align with the right hand side of the Blog category. I may have to play with the width a bit after I insert the widgets I want, but if I know how to configure the width, I can play with it on my own.

    Really, REALLY appreciate your help. : )

    Josh

    #9982
    Jason Bobich
    Keymaster

    I’m talking about the two sidebars on either side of the article posts in the middle column.

    So we call this the “Double Sidebar” layout and we reference within the sidebar layout CSS with the class selector .double_sidebar.

    This corresponds to this CSS within themeblvd.css and is what you’re actually copying to change:

    .double_sidebar #content { width: 60.7%; }
    .double_sidebar .fixed-sidebar { width: 16.65%; }

    You’re adjusting the widths here so everything adds up to 100% when all this comes together:

    1% | 16.65% | 1% | 1% | 60.7% | 1% | 1% | 16.65% | 1%

    Essentially, you’ve got three columns with 1% gutters on both side of each, which account for 6% of the added percentages. And so one main content column and the two sidebars should add up to 94%.

    16.65% + 60.7% + 16.65% = 94%

    ========

    Note: Starting with Swagger 2.0 with Theme Blvd framework 2.3, this will be the standard way to change sidebar widths, using the Bootstrap grid system: http://dev.themeblvd.com/tutorial/sidebar-layouts/#widths
    #9983
    Jason Bobich
    Keymaster

    I’ve split this into its own topic.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The forum ‘Swagger Responsive WordPress Theme’ is closed to new topics and replies.