move sidebar to left side
-
How do I get my sidebar onto the left side. OK I know this is a common question so I searched and did find some tips I went into my css file and almost changed everything that said right to left but nothing ever happened, so I put back the css to the way it was and maybe somedoby can help me. I’m ripping my hair out.
v
-
Which theme are you using?
I’m using kubrick.
Ok I got it to the other side, now just some tweeking to do, thanks.
V
Vuzz how did you do it??? I know if I ask i’ll get told to search and I have and haven’t found anything I understand… maybe you (or someone else) can help… I am wanting to adjust the default theme.
Did you follow the link provided above by macmanx? The search is already done FOR you, after all….
Ya I followed the link thanks very much, I got the left sidebar working but had some placment issues, I am still working on it but a a slow pace. I guess one I get it I’ll post it for others.
In Kubrick here’s how to move the sidebar.
1. wp-content\themes\default\index.php
find<?php get_sidebar(); ?>
move it to the top of the page, right under
<?php get_header(); ?>
2. wp-content\themes\default\styles.css
a) ctrl-F to find “Begin Structure” (it’s a comment in grey)
find .narrowcolumn {etc.}
–remove “float:left;”
–change margin tag to this: “margin: 0px 0 0 210px;”b) ctrl-F to find “Begin Sidebar” (it’s a comment in grey)
–find #sidebar (first one on top)
–add “float:left;”
–change margin-left to 5pxThank you so much danadd. Your comment was very useful and the most straight forward I could find in about an hour of blog searching.
Kudos!
I am impressed by the straight answer. And in the v.2 theme – with the following css? How to move the sidebar in that? I have tried modding the margin for #menu, #nav and #content – but can not get it right. Sad to be a designer sometimes (would like to be a coder too):
/*
html,body{
margin: 0;
padding: 0;
background-color: #E6EAD0;
}body {
padding: 0 0 0 0;
font-family: "Lucida Grande", "Lucida Sans Unicode", "Trebuchet MS", Verdana, Helvetica, sans-serif;
font-size: 12px;
color: #333;
text-align: center;
width: 100%;
}#rap{
margin: 0 0 0 0;
padding: 0 0 0 0;
background: url(img/bgfoot.jpg);
background-position: bottom right;
background-repeat: no-repeat;
width: 100%;
min-height: 100%;
height: 100%;
voice-family: "\"}\"";
voice-family: inherit;
height: auto;
text-align: left;
}html>body #rap {
height: auto;
width: 100%;
}#main {
margin: 0 0 0 0;
padding: 0 0 0 0;}
#menu {
float: left;
width: 30%;
}
#nav {
padding-left: 0px;
padding-right: 0px;
float: left;
width: 100%;
text-align: left;
}
#content {
float: left;
width: 68%;
margin: 0;
padding: 0;
text-align: left;
}
#footer {
background: url(img/fbbody-r.gif) no-repeat bottom right;
width: 97%;
color: #E6EAD0;
margin: 0 0 135px 7px;
text-transform: capitalize;
clear: both;
padding: 0 0 0 0;
}
* html #footer{
margin: 0 0 135px 5px;
float: left;
}
#header{
height: 200px;
margin: 0;
}#masthead{
background: url(img/bg.jpg);
background-position: top left;
background-repeat: no-repeat;
background-color: #E6EAD0;
height: 250px;
margin: 0;
padding: 0;
}
#masthead h1{
color: #FA77E6;
margin: 0 0 0 2px;
padding: 105px 0 0 85px;
font-size: 16px;
}
#masthead h1 a{
color: #fff;
text-decoration: none;
text-transform: uppercase;
}
#masthead h2{
color: White;
font-size: 12px;
margin-left: 50px;
padding-left: 40px;
padding-top: 0px;
height: 28px;
margin-top: 0px;
}
* html #masthead h2{
margin-left: 45px;
padding-left: 0;
float: left;
}
a img {
border: none;
}.reset{
clear: both;
height: 1px;
}
.reset2{
clear: both;
height: 20px;
}acronym, abbr {
border-bottom: 1px dotted #B5DCFA;
}acronym, abbr, span.caps {
cursor: help;
font-size: 11px;
letter-spacing: .07em;
}blockquote {
border-left: 5px solid #ccc;
margin-left: 1.5em;
padding-left: 5px;
}cite {
font-size: 11px;
font-weight: bolder;
font-style: normal;
background: url(img/said.gif) no-repeat;
padding-left: 25px;
height: 18px;
}
cite a{
text-decoration: none;
color: White;
border-bottom: 1px solid #94794F;
}
cite a:hover{
background: White;
color: #94794F;
}
h1 {
margin: 25px 10px 20px 0px;
padding: 0px;
text-align: left;
}h2 {
font-size: 13px;
font-weight: normal;
margin: 15px 20px 0 25px;
padding-bottom: 2px;
}h3.fix{
font-size: 20px;
font-weight: bolder;
text-transform: capitalize;
margin: 5px 0 0 20px;
color: #74C0FA;
}
h3 a {
font-size: 20px;
font-weight: bolder;
margin: 0 0 0 20px;
padding: 0;
color: #97C000;
text-transform: capitalize;
}
.date{
font-size: 10px;
font-weight: normal;
color: #74C0FA;
}h1 a:hover, h2 a:hover, h3 a:hover {
color: #74C0FA;
}.meta {
font-size: 10px;
margin-left: 20px;
margin-bottom: 10px;
color: #C2C2C2;
}.meta li, ul.post-meta li {
display: inline;
}.meta ul {
display: inline;
list-style: none;
margin: 0;
padding: 0;
}.meta a {
color: #97C000;
font-weight: normal;
letter-spacing: 0;
}
.meta a:hover{
color: #74C0FA;
}#getit{
margin-left: 10px;
margin-top: -30px;
}h3#respond{
background: url(img/bobble.gif) no-repeat;
height: 80px;
padding: 42px 0 0 48px;
margin: 0 0 0 0;
color: #97C000;
font-size: 16px;
}
h3#comments{
background: url(img/cornerarrow.gif) no-repeat;
height: 80px;
padding: 31px 0 0 153px;
margin: -5px 0 0 0;
color: #fff;
font-size: 14px;
}
span.commentmetadata{
font-size: 10px;
color: White;
}
span.commentmetadata a{
text-decoration: none;
color: #94794F;
}p, li, .feedback {
font-size: 12px;
}
#commentlist{
margin-bottom: 60px;
margin-left: 0;
padding: 0;
color: White;
}.norm{
background: url(img/cobody-r.gif) no-repeat bottom right;
font-size: 100%;
width: 100%;
margin: 0 0 0 0;
}
.alt{
background: url(img/acobody-r.gif) no-repeat bottom right;
font-size: 100%;
width: 100%;
margin: 0 0 0 0;
}
.co-content{
margin-left: 20px;
margin-bottom: 5px;
}
.norm .licomtop{
background: url(img/cohead-r.gif) no-repeat top right;
margin: 0 0 0 0;
padding: 0 0 0 0;
text-align: center;
}
.norm .cheadfill{
background: url(img/cohead-l.gif) no-repeat top left;
margin: 0 0 0 0;
padding: 10px 30px 5px 0;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
}
.norm .licombody{
background: url(img/cobody-l.gif) no-repeat bottom left;
margin: 0 0 0 0;
padding: 5px 30px 31px 20px;
}.alt .licomtop{
background: url(img/acohead-r.gif) no-repeat top right;
margin: 0 0 0 0;
padding: 0 0 0 0;
text-align: center;
}
.alt .cheadfill{
background: url(img/acohead-l.gif) no-repeat top left;
margin: 0 0 0 0;
padding: 10px 30px 5px 0;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
}
.alt .licombody{
background: url(img/acobody-l.gif) no-repeat bottom left;
margin: 0 0 0 0;
padding: 5px 30px 31px 20px;
}.licombody p{
margin: 0;
padding: 0;
}ul.post-meta {
list-style: none;
}ul.post-meta span.post-meta-key {
font-weight: bold;
}.feedback {
color: #ccc;
text-align: left;
font-size: 11px;
float: right;
margin: -20px 20px 0 0;
padding: 0 0 0 0;
}.feedback a{
color: #97C000;
text-decoration: none;
font-size: 11px;
cursor: pointer;
}
.commentlist li ul {
border-left: 3px solid #eee;
font-size: 12px;
list-style-type: none;
}
.commentlist a{
color: #675437;
text-decoration: none;
background: #F2EBE1;
}.commentlist a:hover{
background: #4F402A;
color: White;
}span.nocomment{
background: url(img/nocomment.gif) no-repeat 0 5px;
color: #609706;
font-size: 12px;
margin: 0 0 0 0;
padding: 10px 2px 0 1px;
height: 30px;
width: 28px;
font-size: 11px;
text-align: center;
display: block;
float: left;
}
span.acomment{
background: url(img/comment.gif) no-repeat 0 5px;
color: #fff;
font-size: 12px;
margin: 0 0 0 0;
padding: 10px 2px 0 1px;
height: 30px;
width: 28px;
font-size: 11px;
text-align: center;
display: block;
float: left;
}
span.arecomments{
background: url(img/comments.gif) no-repeat 0 5px;
color: #fff;
font-size: 12px;
margin: 0 0 0 0;
padding: 10px 2px 0 1px;
height: 30px;
width: 28px;
font-size: 11px;
text-align: center;
display: block;
float: left;
}
span.nextcomments{
color: White;
font-size: 11px;
padding: 15px 0 0 0;
margin: 0 0 0 0;
padding: 10px 10px 0 0px;
height: 30px;
display: block;
float: left;
}
span.noflavor{
color: #C5FA6B;
font-weight: bolder;
}
span.oneflavor{
color: #F99454;
font-weight: bolder;
}
span.areflavor{
color: #F94FDF;
font-weight: bolder;
}.comments-post {
margin-top: 5px;
margin-right: 25px;
margin-left: 25px;
margin-bottom: 35px;
color: White;
}/* ----- a in paragraph post comment */
.comments-post p a{
color: #F2EBE1;
text-decoration: none;
background: #8C724B;
}
.comments-post p a:hover{
background: White;
color: #8C724B;
}#clearer {
clear: both;
margin: 0;
padding: 0;
}
.textarea {
width: 200px;
margin: 0;
}#commentform-container{
margin-left: 40px;
}
#commentform-container p{
font-size: 10px;
}
#commentform-container a{
color: #74C0FA;
text-decoration: none;
}
#commentform-container a:hover{
color: #74C0FA;
text-decoration: none;
background: White;
}
#commentform #comment{
width: 450px;
margin: 0 0 0 0;
padding: 10px 0 0 0;
}#commentform #author, #commentform #email, #commentform #url, #commentform textarea {
background: #fff;
color: #4F402A;
border-top: 2px solid #453823;
border-right: 1px solid #3C311D;
border-bottom: 1px solid #3C311D;
border-left: 2px solid #453823;
}
.comments-post .nocomments{
font-size: 10px;
background: url(img/closed.jpg) no-repeat;
padding-left: 20px;
margin-left: 0px;
}#commentform textarea {
width: 100%;
}/* end comments */
/* post content */
#content .post{
background: url(img/csbbody-r.gif) no-repeat bottom right;
font-size: 100%;
width: 100%;
color: #4F402A;
margin: 0 0 0 0;}
#content .postop {
background: url(img/csbhead-r.gif) no-repeat top right;
margin: 0 0 0 0;
padding: 0 0 0 0;
text-align: center;
}
#content .postop .pheadfill {
background: url(img/csbhead-l.gif) no-repeat top left;
margin: 0 0 0 0;
padding: 10px 30px 5px 0;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
}
#content .storycontent{
background: url(img/csbbody-l.gif) no-repeat bottom left;
margin: 0 0 0 0;
padding: 5px 30px 31px 20px;
}.storytitle {
margin: 0 0 0 0;
padding: 0 0 0 0;
}.storytitle a {
text-decoration: none;
}#content .post .storycontent p img{
float: left;
border: none;
margin-right: 10px;
}/* roudn corners */
.post p a{
color: #675437;
text-decoration: none;
background: #F2EBE1;
}
.post p a:hover{
background: #4F402A;
color: White;
}.post p {
margin: 5px 15px 10px 20px;
text-transform: none;
}#updates{
background: url(img/clock.gif) no-repeat;
padding-left: 32px;
padding-top: 6px;
height: 28px;
margin-bottom: 15px;
}
#updates a{
text-decoration: none;
color: White;
}
#updates a:hover{
color: #97C000;
background: White;
}/* side bar */
.sideitemett {
background: url(img/sbbody1-r.gif) no-repeat bottom right;
font-size: 100%;
width: 100%;
margin: 0;
}.boxheadett {
background: url(img/sbhead1-r.gif) no-repeat top right;
margin: 0;
padding: 0;
text-align: center;
}
.boxheadett .headfill {
background: url(img/sbhead1-l.gif) no-repeat top left;
margin: 0;
padding: 10px 30px 5px;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
}
.boxbodyett2 {
background: url(img/sbbody1-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}.boxbodyett {
background: url(img/sbbody1-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}/*-------------*/
.sideitemtva {
background: url(img/sbbody2-r.gif) no-repeat bottom right;
font-size: 100%;
width: 100%;
margin: 0;
}.boxheadtva {
background: url(img/sbhead2-r.gif) no-repeat top right;
margin: 0;
padding: 0;
text-align: center;
}
.boxheadtva .headfill {
background: url(img/sbhead2-l.gif) no-repeat top left;
margin: 0;
padding: 10px 30px 5px;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
}
.boxbodytva2 {
background: url(img/sbbody2-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}.boxbodytva {
background: url(img/sbbody2-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}/*-------------*/
.sideitemtre {
background: url(img/sbbody3-r.gif) no-repeat bottom right;
font-size: 100%;
width: 100%;
margin: 0;
}.boxheadtre {
background: url(img/sbhead3-r.gif) no-repeat top right;
margin: 0;
padding: 0;
text-align: center;
}
.boxheadtre .headfill {
background: url(img/sbhead3-l.gif) no-repeat top left;
margin: 0;
padding: 10px 30px 5px;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
}
.boxbodytre2 {
background: url(img/sbbody3-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}.boxbodytre {
background: url(img/sbbody3-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}/*-------------*/
.sideitem {
background: url(img/sbbody-r.gif) no-repeat bottom right;
font-size: 100%;
width: 100%;
margin: 0;
}.boxhead {
background: url(img/sbhead-r.gif) no-repeat top right;
margin: 0;
padding: 0;
text-align: center;
}
.boxhead .headfill {
background: url(img/sbhead-l.gif) no-repeat top left;
margin: 0;
padding: 10px 30px 5px;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
}
.boxbody2 {
background: url(img/sbbody-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}.boxbody {
background: url(img/sbbody-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}/*-------------*/
.sideitemkandidat {
background: url(img/sbbodyk-r.gif) no-repeat bottom right;
font-size: 100%;
width: 100%;
margin: 0;
}.boxheadkandidat {
background: url(img/sbheadk-r.gif) no-repeat top right;
margin: 0;
padding: 0;
text-align: center;
}
.boxheadkandidat .headfill {
background: url(img/sbheadk-l.gif) no-repeat top left;
margin: 0;
padding: 135px 30px 5px;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
}
.boxbodykandidate2 {
background: url(img/sbbodyk-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}.boxbodykandidat {
background: url(img/sbbodyk-l.gif) no-repeat bottom left;
margin: 0;
padding: 5px 30px 31px;
color: White;
}h2#flickr{
background: url(img/flick-flower.jpg) no-repeat;
padding-left: 116px;
height: 50px;
padding-top: 0px;
}#footercontent{
background: url(img/fbbody-l.gif) no-repeat bottom left;
margin: 0 0 0 0;
padding: 0px 30px 31px 20px;
}
#footer .fboxhead{
background: url(img/fbhead-r.gif) no-repeat top right;
margin: 0 0 0 0;
padding: 0 0 0 0;
text-align: center;
}
#footer .fboxhead .fheadfill{
background: url(img/fbhead-l.gif) no-repeat top left;
margin: 0 0 0 0;
padding: 5px 30px 5px 0;
color: white;
font-weight: bold;
font-size: 1.2em;
line-height: 1em;
}
#footer a{
text-decoration: none;
color: White;
font-weight: bolder;
}
#footer a:hover{
background: White;
color: #74C0FA;
}
#footer p {
margin: 0 10px;
}#footer .rss{
background: url(img/rss.gif) no-repeat left;
padding-left: 15px;
}
#pagination{
margin-left: 35px;
color: White;
}.credit {
color: #fff;
font-size: 11px;
text-align: left;
margin: 0 0 10px 10px;
float: left;
}
.footermeta{
color: #fff;
font-size: 11px;
float: right;
margin: 0 10px 10px 0;
}
.footermeta a{
color: White;
text-decoration: none;
margin-left: 5px;
}
.resetfoot{
height: 10px;
}#header, #header a:link {
font-size: 20px;
font-weight: normal;
color: #ccc;
text-decoration: none;
}#header a:hover {
color: #c00;
}#nav li{
list-style: none;
}
#nav form {
margin: 0 0 0 13px;}
#nav input#s {
width: 70%;
background: #eee;
border-top: 1px solid #828177;
border-left: 1px solid #828177;
color: #000;
}#nav ul {
color: #333;
font-weight: normal;
font-size: 22px;
list-style-type: none;
margin: 0 0 5px 0;
padding-left: 20px;
text-transform: lowercase;
}#nav h2 {
color: #fff;
font-weight: normal;
font-size: 18px;
list-style-type: none;
margin: 0 0 0 0;
padding-left: 18px;
text-transform: lowercase;
}#nav ul li {
font-size: 12px;
padding-bottom: 2px;
color: White;
padding-left: 10px;
}
#nav ul li a{
color: White;
text-decoration: none;
}
#nav ul li a:hover{
color: #74C0FA;
background: #fff;
}#nav ul ul {
font-size: 12px;
font-weight: normal;
line-height: normal;
list-style-type: none;
margin: 0;
padding: 0;
text-align: left;
}#nav ul ul li, #nav ul li ul li {
font-size: 12px;
font-weight: normal;
border: 0;
letter-spacing: 0;
margin-top: 0;
padding: 0;
}#nav ul ul li a {
color: #444;
text-decoration: none;
}#nav ul ul li a:hover {
border-bottom: 1px solid #333;
}#nav ul ul ul.children {
font-size: 11px;
padding-left: 4px;
}#nav li.recentcomments{
color: #503F2B;
padding-left: 15px;
margin-top: 5px;
background: url(img/recentcomments.jpg) no-repeat bottom left;
}#wp-calendar {
border: 1px solid #000;
empty-cells: show;
font-size: 11px;
margin: 0;
width: 95%;
text-align: center;
}#wp-calendar #next a {
padding-right: 10px;
text-align: right;
}#wp-calendar #prev a {
padding-left: 10px;
text-align: left;
}#wp-calendar a {
display: block;
text-decoration: none;
}#wp-calendar a:hover {
background: #eee;
color: #333;
}#wp-calendar caption {
color: #444;
font-size: 18px;
font-weight: normal;
text-align: left;
}#wp-calendar td {
color: #444;
font-weight: normal;
font-size: 11px;
letter-spacing: normal;
padding: 2px 0;
text-align: center;
}#wp-calendar td.pad:hover {
background: #fff;
}#wp-calendar td:hover, #wp-calendar #today {
background: #eee;
color: #000;
}#wp-calendar th {
font-style: normal;
text-transform: capitalize;
}/* tabbed navigation code */
#pagetab {
padding: 30px 0 3px 0;
margin: 200px 20px 0 0;
font-weight: bold;
font-size: 10px;
float: right;
clear: both;
text-transform: Uppercase;
}#pagetab .ltab{
/*background: url(img/lpt.gif) no-repeat;*/
width: 12px;
height: 131px;
float: left;
margin-top: -85px;
}#pagetab .rtab{
/*background: url(img/rpt.gif) no-repeat;*/
width: 12px;
height: 131px;
float: left;
margin-top: -85px;
}
.page_item {
margin: 0 0 0 0;
padding: 0 0 0 0;
float: left;
display: inline;
}#pagetab ul {
list-style: none;
margin: 0 0 0 0;
padding: 0 0 0 0;
display: inline;
float: left;
}#pagetab li {
list-style: none;
margin: 0 0 0 0;
padding: 0 0 0 0;
display: inline;
}#pagetab a {
margin-right: 25px;
text-decoration: none;
color: #015E27;
background: url(img/subitem.gif) repeat-x bottom left;
display: inline;
float: left;
height: 7px;
padding-bottom: 30px;
/*border-left: 1px solid #63B7FA;*/
}
* html #pagetab a{
padding-bottom: 21px;
}
#pagetab li a:hover {
color: #97C000;
}#pagetab li a#current {
color: #97C000;
}/* flickr integration */
#flickr_badge_uber_wrapper{
margin-left: 17px;
margin-top: -30px;
}#flickr_badge_wrapper img{
float: left;
margin-left: 5px;
margin-top: 5px;
border: #A3CE05 3px solid;
}/* widgets */
li a.rsswidget{
margin-left: 10px;
}
a.rsswidget{
text-decoration: none;
color: White;
}
.textwidget{
margin-left: 20px;
text-transform: none;
}
- The topic ‘move sidebar to left side’ is closed to new replies.