WordPress: Get the smaller sidebar of iNove theme
In my blog I decided to use WordPress with iNove theme, and it seems that sidebar of this theme is too wide. I decided to decrease the width of the sidebar by 70px. To do this we should make changes in style.css of iNove theme. Below are the places in style.css where the changes should be done.
Here we increase the width of main content placeholder:
/* main START */
#main {
background:#FFF url(img/main_shadow.gif) top repeat-x;
width:675px; /* <------ the original value is 605px */
padding:13px 15px 15px;
float:left;
overflow:hidden;
}
Here we decrease the width of sidebar:
/* sidebar START */
#sidebar {
background:#F7F7F7 url(img/sidebar_shadow.gif) top repeat-x;
width:230px; /* <------ the original value is 300px */
float:right;
font-size:95%;
line-height:145%;
overflow:hidden;
padding-top:8px;
}
Initially in the center of sidebar we have two widgets – Categories and Blogroll, which follow one after another horizontally. After getting sidebar smaller, they won’t have enough space. That is why we should place Blogroll-widget right after Categories-widget vertically. To do this we need to remove or comment the following width and float attributes:
#westsidebar {
/* width:121px;
float:left; */
padding-right:5px;
font-size:95%;
overflow:hidden;
}
#eastsidebar {
/* width:129px;
float:right; */
font-size:95%;
overflow:hidden;
}
Here we increase the width of comments:
.comment .info {
background:#EDEFF0 url(img/comment.gif) 0 0 no-repeat;
float:left;
padding:10px 15px 0;
width:564px; /* <------ the initial value is 494 */
}
#comment {
width:671px; /* <------ the initial value is 601 */
}
That’s all with style.css. Also we need to change the image img/sidesep.gif. In my case, I’ve cut off the image at right side from 301px to 231px. That’s all.
You can download revised files (style.css and sidestep.gif) here.