WordPress.org

Ready to get started?Download WordPress

Forums

Splitting Existing 3-Column Theme or Need to Move Column Left (4 posts)

  1. tongueandcheek
    Member
    Posted 4 years ago #

    I can get myself around CSS and PHP files though I am certainly no expert, so this is stumping me.

    I am using this theme:
    http://wordpress.org/extend/themes/elements-of-seo

    But would like to split the two sidebars so that one is on either side of the main content. I've looked into the css and php files of other themes that have this set-up and mimicked what they've done but to no ado.

    It doesn't seem to matter if I float the sidebars or the content left/right/none because the two sidebars never want to be apart from each other and the content either goes left, right or floats above and the sidebars hang out below. Any suggestions?

  2. tongueandcheek
    Member
    Posted 4 years ago #

    figured it out!

  3. stmcgill
    Member
    Posted 4 years ago #

    Can I ask how you did it?

  4. Trailmix
    Member
    Posted 4 years ago #

    I had a theme ("Live" by Herdo) with a double sidebar on the right and wanted a single sidebar on the left. Here's what I did, and I'm a total newbie to css: (this took me hours to figure out!)

    1. I found that in sidebar.php there were two basically identical blocks of code that were making the 2 sidebars next to each other, and that's why they couldn't be split apart - so I deleted all of the second block of code (for me this was about line 30 to the end). The result was that one sidebar disappeared but there was still blank space there. *THIS IS A KEY to understanding why the sidebars can't be split apart on the stylesheet.

    2. I figured out that in style.css, the sidebar(s) were called column-1 (yes BOTH of them had the same name and any width adjustment affected both of them) and my main body was column-2. So I changed the width tags on both of those to make up for the extra blank space from the sidebar I deleted. My column-1 went from 180 to 200 and my column-2 went from 520 to 700. (Notice that this adds a total of 200 to the columns - this is because the column I deleted was 180 wide plus a margin of 20).

    4. I added float: right tag to the column-2 and float: left to column-1.

    5. I changed the margins of column-1 to add that extra 20px on the right instead of the left where it was originally.

    OK, I know this doesn't solve the original question here, but hopefully it gives some ideas of where to look for a solution. Obviously you would NOT do step 2 of changing the widths. I think you would need to create an additional sidebar file like sidebar2.php where you put the code you cut in step 1. Then in the index.php you would add code to call that sidebar2 into the page where you want it. I have no idea how to do the css for adding another column and getting the margins right, but I think that's what you need to do. Ummm... just keep in mind that this last paragraph is just my noisy thoughts - no experience!

Topic Closed

This topic has been closed to new replies.

About this Topic