• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

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

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

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

This topic is: not resolved
  • This topic has 6 replies, 3 voices, and was last updated 10 years, 2 months ago by tylerholloway.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • January 14, 2013 at 11:29 pm #12005
    tylerholloway
    Member

    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.

    January 15, 2013 at 8:57 am #12048
    Jon Bellah
    Member

    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

    January 15, 2013 at 3:58 pm #12131
    wendycholbi
    Member

    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

    January 15, 2013 at 6:23 pm #12162
    tylerholloway
    Member

    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?

    January 15, 2013 at 10:46 pm #12211
    wendycholbi
    Member

    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

    January 21, 2013 at 5:04 pm #13590
    tylerholloway
    Member

    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!

    January 22, 2013 at 7:25 pm #13946
    tylerholloway
    Member

    Bump.  Any advice?

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The forum ‘Design Tips and Tricks’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2023 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble