Is there a way to adjust width of sidebars in Prose?

Community Forums Forums Design Tips and Tricks Is there a way to adjust width of sidebars in Prose?

This topic is: not resolved

This topic contains 6 replies, has 3 voices, and was last updated by  tylerholloway 1 year, 3 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #12005

    tylerholloway
    Participant
    Post count: 10

    I got the Prose theme, and I was wondering if there was a way to make my sidebars a bit narrower than they are by default.  I didn’t see an option for it in the design settings.  Thanks in advance.

    #12048

    Jon Bellah
    Participant
    Post count: 109

    You would have to edit the CSS in style.css. Just adjust the width: property. The default is:

    .sidebar {
    display: inline;
    float: right;
    font-size: 14px;
    padding: 10px 0 0;
    width: 280px;
    }
    

    Just adjust where it says 280px down to your liking; i.e., 250px.


    Follow me on the Twitters at @JonBellah. I blog about web design, development and a lot about Genesis at CSSForge.com

    #12131

    wendycholbi
    Participant
    Post count: 120

    Tyler, if you are using Prose, do not edit style.css.

    Instead, copy the code provided by Jon above into the Custom CSS field in Genesis –> Custom Code. Then you can tweak your sidebar widths to suit you, and your changes will not be overwritten the next time a new version of Prose is released.


    I love WordPress, Genesis, and the Prose child theme (my complete guide to using Prose is here: SiteSetupKit.com). Say hi on Twitter: @wendycholbi

    #12162

    tylerholloway
    Participant
    Post count: 10

    Thanks.  I added that to my custom code and it worked great.  The only thing is that it didn’t extend the area used by the main section.  Can you give me an idea on what code I would need to add for that?

    #12211

    wendycholbi
    Participant
    Post count: 120

    Yep, try this:

    .content-sidebar #content, .sidebar-content #content {
    width: 620px;
    }

    I believe the default width is 590 pixels. Increase this width by the same number of pixels you decreased your sidebar by. So if your sidebar went from 280 pixels wide to 250 pixels wide, that’s a decrease of 30 pixels, so to compensate, you’d want to add 30 to the default content width, so it would be 620 pixels as in my example code above.

    And keep in mind that this code will be specific to pages that are displaying the Primary Sidebar only. If you are going to have any pages that use both the Primary and Secondary sidebars, you’ll need additional code-tweaking.

    Hope this helps! I’d love to see a link to your site to see how it’s working.


    I love WordPress, Genesis, and the Prose child theme (my complete guide to using Prose is here: SiteSetupKit.com). Say hi on Twitter: @wendycholbi

    #13590

    tylerholloway
    Participant
    Post count: 10

    Thanks, both of those work.  One final question: how do you get the right side of the sidebar to align with the right side of the page?

    I want the widgets to align with the right edge of the header logo, but I can’t quite them there.  I changed the “display” value from inline to “right”, but that didn’t seem to help.  Any ideas?

    The website is http://tylerholloway.net.

    Thanks!

    #13946

    tylerholloway
    Participant
    Post count: 10

    Bump.  Any advice?

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.