WordPress.org

Ready to get started?Download WordPress

Forums

how do i change width of twenty twelve theme (21 posts)

  1. vsr1312
    Member
    Posted 1 year ago #

    My blog is http://www.myapitips.com/ and i want to increase the width of the theme so that i can put 728px leather board google ad. Is there anyway to do this.

  2. Leave Stick
    Member
    Posted 1 year ago #

    At your twenty twelve theme folder find style.css then you may change the line about 1365 before and after.

    Im sure you can see this max-width: 68.571428571rem; The bigger the number the wider.

  3. SiteGround
    Member
    Posted 1 year ago #

    Hello,

    Open /wp-content/themes/twentytwelve/style.css and locate line 1365

    .site {
        margin: 0 auto;
        max-width: 68.5714rem;
        overflow: hidden;
    }

    Replace max-width: 68.5714rem; with the new blog size you want to have. That should do the trick :)

    Best,

    Hristo
    [ Signature moderated. ]

  4. bkeller49
    Member
    Posted 1 year ago #

    I'm new to the concept of "rem." If I adjust the width of my .site does that put me in danger of messing up the responsiveness built into the theme?

  5. SiteGround
    Member
    Posted 1 year ago #

    Rem is a new metric introduced by CSS3. The em unit is relative to the value of the parent. The rem unit, however, is relative to the root—or the html—element. That means that you can define a single size on the html element and define all rem units to be a percentage of that.

    In your case, in order to keep the responsiveness of the theme, keep this value in rems. Simply try lower values until you reach the desired result.

  6. flegmatiq
    Member
    Posted 1 year ago #

  7. Caroline@tasteloveandnourish
    Member
    Posted 1 year ago #

    I've been looking for clear-cut information on how to do this for weeks! Thank you!

  8. persulla
    Member
    Posted 1 year ago #

    thank you very much!!!!

  9. kjodle
    Member
    Posted 1 year ago #

    Keep in mind that you will lose all those customisations when you update the theme. You should use a child theme to make modifications.

  10. stevekimpton
    Member
    Posted 1 year ago #

    But anyone know how to make the editor in the dashboard correspond to the new width? - Or the current width, come to that.

    All the postings I can find seem to be about older versions. The TinyMCE window is wide but the content inside it only takes up about half the available space. (Maybe to match comments of posts with sidebars or something) but all my pages are full width and I'd love to make the editor a bit more realistic.

    Thanks

  11. esmi
    Forum Moderator
    Posted 1 year ago #

  12. AdamGDog
    Member
    Posted 1 year ago #

    I want a fixed width for my site -- It seems to elude me. I have the theme twenty twelve
    http://www.adammakarenko.com. I just want the width to stay the same regardless of browser size

    Anyone know what I can do?

    1) for example what code do I use?
    2) and where do I specifically place it in the style.css?

    Thanks !

  13. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    @AdamGDog - it looks like you are not using the twentytwelve theme - so this thread is not relevant.

    These forums only support themes from the repository on this site, so you'll need to contact your theme's vendors for help:

    http://wpshower.com/themes/sight/

  14. AdamGDog
    Member
    Posted 1 year ago #

    Actually I am using the twenty twelve

  15. AdamGDog
    Member
    Posted 1 year ago #

    oh that is because I switched it momentarily - sorry

  16. AdamGDog
    Member
    Posted 1 year ago #

    I never thought anyone would get back to me -- I am getting tired of trying to make this small change. lack of knowledge :( on my part

  17. saminahisham
    Member
    Posted 1 year ago #

    thank you SiteGround. its helpful.

  18. stevekimpton
    Member
    Posted 1 year ago #

    I think you have to create a child theme that imports the css values of the main theme and adds the rule:

    .site{ max-width:none; width:NNNpx }

    where NNN is the pixel width you want. This way any updates to twentytwelve won't set you back to the original arrangement.

    The rules in the twentytwelve theme for site width start on line 1431 so you could just add this rule immediately below them to check that it works before getting involved in creating your child theme.

  19. chrisjallen
    Member
    Posted 1 year ago #

    Really helpful thread, many thanks. I just found a calculator to work out the Rems for all font sizes:
    http://offroadcode.com/prototypes/rem-calculator/

  20. jackson333
    Member
    Posted 1 year ago #

    Please I want to increase the content width of my blog http://www.dailytipsdiary.com for both homepage and content page.

    The default is 570px for content width I want it to be 630px to close up the space around the Sidebar so that my content can stretch close to the sidebar. I am not t

    I am using the Generate Theme by Genesis Framework

    Any help is highly appreciated

  21. esmi
    Forum Moderator
    Posted 1 year ago #

    As you are using a commercial theme - and NOT Twenty Twelve - , you need to seek support from the theme's developer/vendor. We do not support commercial products here.
    Try http://www.studiopress.com/support

Topic Closed

This topic has been closed to new replies.

About this Topic