Tarski theme – changing sidebar colors

  • Unknown's avatar

    Just setting up a site and picked the nearest theme I found to what I was looking for – http://theme.wordpress.com/themes/tarski/

    What would really make it perfect though is if I could make the left and right background colour (either side of the central blog area) a particular colour – is this the sort of thing I could do using CSS? There is an option to change the background in this theme but it changes the blog/text area too.

    Ideally looking so that it would have side-colors more like Ocean Mist (solid or gradient)
    http://theme.wordpress.com/themes/ocean-mist/

    I’m still considering a wordpress.org solution to this so is this something that I could do easily if it’s not hosted on wordpress.com?

    ta

  • Unknown's avatar

    You did not specify a blog address or reason for posting when you created this topic.

    This support forum is for blogs hosted at WordPress.com. If your question is about a self-hosted WordPress blog then you’ll find help at the WordPress.org forums.

    If you don’t understand the difference between WordPress.com and WordPress.org, you may find this information helpful.

    If you forgot to include a link to your blog, you can reply and include it below. It’ll help people to answer your question.

    This is an automated message.

  • Unknown's avatar

    Tarski is an older theme so not quite as flexible as newer themes, but you can certainly change the background colors for the content and sidebar area. With Tarski I might suggest doing that as a combined image that could repeat in the “Y” direction (down) and then inserting it into #wrapper and positioning it so that it starts at the top of the sidebar and content area.

  • Unknown's avatar

    OK thanks! Can someone tell me how I would go about this – I haven’t used CSS before except to change an existing variable colour.

  • Unknown's avatar

    Once I actually got into it, I changed things a little. The following will put a background behind the content and sidebar. The total width of the image is 720px and I made it only 20px tall and did the repeat-y. This keeps the image very small so it loads quickly. The colored section behind the sidebar is 210px wide and the section behind the content is 510px wide. You would upload the image to your media library, get the URL of that image and then replace URL OF BG IMG between the single quote marks with that URL.

    One note is that this causes the footer to blow up (actually it is hidden behind the colored image and toward the top of the content area). Tarski CSS looks straight forward, but it behaves bizarrely. I’ll have to play with it some more, but it is time for bed. You can see what the below can look like though on my test blog (don’t mind the colors, I choose obnoxious colors so they stand out when I’m doing the design work.

    http://flippintestblog.wordpress.com/

    #content {
    background:url('URL OF BG IMG') repeat-y scroll center 0 transparent;
    position:absolute;
    width:720px;
    }
    
    #secondary {
    margin-left:10px;
    width:190px;
    }
    
    .entry {
    padding-left:5px;
    padding-right:10px;
    }
  • Unknown's avatar

    Oh wow, thanks so much for doing this. Unfortunately I mean the background colour (either side of the two columns), not the columns/text area themselves – are these areas ones that are easily referred to and colorable?

  • Unknown's avatar

    Ah, that is actually better as the issue with the footer will go away. And sorry for misreading that. On a side note, Tarski needs some CSS tweaking on the original CSS. There are several things messed up with it. Give this a try though and see what you think. The color declared in “body” is the area outside the content. I also had to declare a color for the content area. Both of those colors you can change. The theme-info height is toovercoming the issue with the footer issues.

    Again, you can take a look here: http://flippintestblog.wordpress.com/ to see how it looks.

    body {
    background:none repeat scroll 0 0 #CC0000;
    }
    
    #wrapper {
    background:none repeat scroll 0 0 #FFFFFF;
    }
    
    #theme-info {
    height:45px;
    }
  • Unknown's avatar

    Awesome – exactly what I needed. Thanks! It sounds like I will actually be going the wordpress.org + install route (will apply the css to this) so hopefully the author has fixed some of these issues since WP made it available.

    thanks again.

  • Unknown's avatar

    WordPress.COM has done a lot of tweaking to Tarski, so there is the possibility that the above will not work with that theme for self-hosted sites. You might have to dig into the CSS for it and then make adjustments to it.

    If it needs tweaking you will either have to talk with the theme designer or you will have to try over at http://wordpress.ORG/support/ as that is where the self-hosted version of wordpress is supported.

  • The topic ‘Tarski theme – changing sidebar colors’ is closed to new replies.