WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Sidebar merge with column (5 posts)

  1. Emphasis
    Member
    Posted 3 years ago #

    Hey,

    I'm using the Karappo theme and removed a lot of stuff from the code to make it as minimalistic as possible. Everything from the sidebar is now gone, but I actually need the space.

    So although sidebar isnt showing, is there a way to remove it completely so my page width of my posts becomes bigger (for a gallery).

    http://www.niceflowertrading66.com
    Thanks ahead for anyone who can help, I'm such a noob

  2. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    From the Karappo Style Theme's stylesheet, you need to modify the CSS - specifically, the #main ID selector and related, e.g.:

    #main {
    	float: left;
    	width: 470px;
    }
    
    #main .entry {
    	position: relative;
    	width: 470px;
    }

    Even though you've removed the sidebar from the template, the #main content area won't resize automatically.

    Note that the #side sidebar area has a defined width of 230px:

    #side {
    	float: right;
    	margin: 20px 0 0 0;
    	width: 230px;
    }

    Try adding that width to the #main content area, and to the #main .entry class (470px + 230px = 700px, though you might need to account for any margins/padding):

    #main {
    	float: left;
    	width: 700px;
    }
    
    #main .entry {
    	position: relative;
    	width: 700px;
    }
  3. Emphasis
    Member
    Posted 3 years ago #

    Very simple + works, I like it. If I don't want to change it for all pages, should I make a second stylesheet or something?

  4. Emphasis
    Member
    Posted 3 years ago #

    Answer to my second question:

    Header:

    <body<?php if ( is_page(array('somepage1', 'somepage2', 'somepage3'))) {
    echo ' class="myclass" '; } ?>>

    replace somepage1 with the page slug of the pages you want the special CSS applied to.

    now, when those pages are viewed, you have this
    <body class="myclass">

    now you can add CSS to the stylesheet to override the default styling

    .myclass #content { background-color: #123456; }
    .myclass #content p { color: #987654; }

    because that styling is more specific than the default styling, it overrides the default styling whenever the class on the body tag is "myclass"

    (source)

    Thanks Chip!

  5. Chip Bennett
    Theme Review Admin
    Posted 3 years ago #

    You should be using the body_class() tag inside of the BODY tag:

    <body <?php body_class(); ?>>

    If you need to customize according to current location, either use one of the classes output by body_class(), or add an ID to the BODY tag, based on location.

Topic Closed

This topic has been closed to new replies.

About this Topic