Change the Full Width Template's Width – How to?

Community Forums Forums Design Tips and Tricks Change the Full Width Template's Width – How to?

This topic is: not resolved

This topic contains 3 replies, has 2 voices, and was last updated by  blogjunkie 1 year ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #47613

    works
    Participant
    Post count: 36

    Is it possible to change the full width’s template’s width, but only on some pages?

    Depending on the content, the page is too wide which makes it challenging to read the content.

    One of my sites is in the free TwentyEleven theme, and when i need narrower page, i simply choose the sidebar template… but as i do not use any sidebars on that website, the side-bar template appears like full width (no sidebar) one but only a little bit narrower, which is absolutely perfect for mobile and for wide screen laptops too.

    i can do the same in Genesis. Choose the sidebar template. The page will appear as narrower and having no sidebar if i put and save a text widget with zero text into the sidebar, but the content on the page will look skewed either to the left or to the right depending on which sidebar template is chosen, and i don’t know how to make it centered then.

    So my question is: How to make most pages appear to be on Full-width (no-sidebar) templates; but how to make not all, but only_some pages appear a little bit narrower?

    Thank you in advance!

    • This topic was modified 1 year, 1 month ago by  works.
    • This topic was modified 1 year, 1 month ago by  works.
    #47626

    blogjunkie
    Participant
    Post count: 35

    Here’s how I’ve implemented it here: http://clickwp.com/wordpress-support/

    In the layout settings metabox:

    1. Choose the full width layout
    2. Add a custom body class, e.g. “landingpage” (without the quotes)

    Now in your style.css, you’ll have to add this piece of code:

    .full-width-content.landingpage #content {
    	padding: 0 85px;
    	width: 820px;
    }

    padding: 0 85px; is shorthand for padding: 0 85px 0 85px;, where the 4 values represent top, right, bottom and left (clockwise). padding-left + padding-right + width must equal to the width of your full-width content template.

    If you’re a ninja coder, you can also add a new layout option with the code and examples from these posts:

    http://www.billerickson.net/wordpress-genesis-custom-layout/

    http://designsbynickthegeek.com/tutorials/genesis-explained-layout-functions

    Good luck!


    WordPress evangelist, Nike runner, Apple fanboy.
    Work: ClickWP WordPress Support, Play: adventures of a blogjunkie. Talk to me on Twitter @blogjunkie

    #47953

    works
    Participant
    Post count: 36

    Wow thank you.

    Would that change the width only on some pages, or on all pages that use the full-width template? (i need only on some).

    #50497

    blogjunkie
    Participant
    Post count: 35

    Your custom body class would only affect the pages it’s applied to


    WordPress evangelist, Nike runner, Apple fanboy.
    Work: ClickWP WordPress Support, Play: adventures of a blogjunkie. Talk to me on Twitter @blogjunkie

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

You must be logged in to reply to this topic.