Default Theme: moving sidebar to the left side

  • Resolved David Borrink

    (@davidborrink)


    15 years, 5 months ago

    Attempting to move the sidebar in the Default theme from the right side to the left side.

    In style.css, I changed the #sidebar left margin to 25 instead of 545. That moved the sidebar down below the posts. I set the sidebar width to 160. This covers 185px worth of space. Then I changed the post class “narrowcolumn” left margin to 230 to move it right (allowing for the sidebar width, and creating a 45px margin in between), but it stays at the top of the page, while the sidebar starts after the posts are done.

    I would think that changing the margin settings would be enough, but that didn’t work.

    I went into index.php and moved the get_sidebar instruction above the post area and below the get_header instruction. The sidebar is now at the top of the page on the left, but the posts start after the end of the sidebar and are positioned to the right.

    I’ve read many forum posts today, and tried to find how I could resolve this from the codex files, but I’m having a difficult time figuring this out. Nothing is giving me an answer.

    Am I making a css mistake? Or do I need to change all the template files with a get_sidebar code in a specific place?

Viewing 9 replies - 1 through 9 (of 9 total)
  • krembo99

    (@krembo99)

    15 years, 5 months ago

    well.. giving a link (Or the css) would help solving your problem….
    But basically what you have to do is find the bar div and cross change left- right properties.. that’s all (usually – depends on theme)

    Thread Starter David Borrink

    (@davidborrink)

    15 years, 5 months ago

    I’m working on my Mac in MAMP to do this, so I can’t post a link, but here are the two div codes:

    .narrowcolumn {
	float: left;
	padding: 0 0 15px 25px;
	margin: 0px 0 0;
	width: 400px;
	}
    #sidebar
{
	padding: 20px 0 10px 0;
	margin-left: 455px;
	width: 160px;
	}

    These are default codes. I change the sidebar margin-left to 25, and I change the narrowcolumn mmargin to a margin-left: 230px in order to allow 45px between the sidebar and the content area in narrowcolumn.

    Any thoughts? You can look at the Default theme for these numbers.

    krembo99

    (@krembo99)

    15 years, 5 months ago

    those two snippets are not enough .. you might want to consider giving a link to your CSS or template..
    It is quite obvious by your description that it is a CSS calc error.
    But it can also be in the wrapper div , page div, or container.
    looking at those two divs tells me nothing (maybe it does to someone else..)

    chaoskaizer

    (@chaoskaizer)

    15 years, 5 months ago

    Try set the .narrowcolumn float to “right” and remove the #sidebar “margin-left”.

    Thread Starter David Borrink

    (@davidborrink)

    15 years, 5 months ago

    choaskaizer,

    By golly, THAT’S IT! I still need to put a little padding on the left, because the sidebar touches the left side of the page, but both items are now switched and side by side.

    I knew it had to be something simple. THANKS!

    rcpkrc

    (@rcpkrc)

    15 years, 1 month ago

    thats very good, l was looking for a while for this, thanks..
    can anyone tell me how can l add sidebar to right on each page?

    Gunjan Jaswal

    (@parryjaswal)

    14 years, 5 months ago

    Thanks a lot choaskaizer 🙂

    perove

    (@perove)

    14 years, 5 months ago

    Choaskaizer: big thanks, it did the trick for me too.

    rcpkrc: what do you mean? Doesn’t WordPress give you this as default in most themes?

    perove

    (@perove)

    14 years, 5 months ago

    rcpkrc: I think I just stumbled upon you issue, check that <?php get_sidebar(); ?> is called in you page.php (if your theme has this file).

    In my case there is one call for side bar in index.php and one for the pages in page.php. Also other pages like comments.php, archive.php etc would require the same change to show the side bar.

    Your side bar styling is typically reflected on all pages calling it.

    Hope this helps.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Default Theme: moving sidebar to the left side’ is closed to new replies.