WordPress.com

1. hibeverly
   Member
   Aug 5, 2011, 8:54 AM

   I have the Chocco theme and would like to customize the colors. I can change the bg/background solid color in Theme Options or Custom CSS.

   however where can I change the colors/image for the portfolio/folder looking background my entries are on? Assume this is done via Custom CSS but I can't find where it is in the code to amend.

   Thanks

   The blog I need help with is hibeverly.wordpress.com.

2. thesacredpath
   Member
   Aug 5, 2011, 9:21 AM

   The background for the content/sidebar area is made up of three images, top, bottom and middle The middle repeats in the "Y" direction (down) and aligns with the top and bottom image. Here are the three image URLs.

   http://s1.wp.com/wp-content/themes/pub/choco/colors/default/images/main-top.jpg
   http://s1.wp.com/wp-content/themes/pub/choco/colors/default/images/main-bg.jpg
   http://s1.wp.com/wp-content/themes/pub/choco/colors/default/images/main-bot.jpg

   And here is where they are located in the CSS (relative links rather than absolute).

   #main-top {
   background-image: url("images/main-top.jpg");
   }
   
   #main {
   background-image: url("images/main-bg.jpg");
   }
   
   #main-bot {
   background-image: url("images/main-bot.jpg");
   }

   You will have to recreate those images in the colors you want, making sure they align with each other right down to the pixel and then upload them to your media library, get the URLs of those images, put the above into your CSS and then replace the relative URLs in them with the appropriate absolute (full) URL.

3. hibeverly
   Member
   Aug 5, 2011, 10:43 AM

   Thank you, it's EXACTLY what I was after!

   One problem though - after uploading my top image, I put the 'main-top' code in my CSS as such:

   #main-top {
   background-image: url("http://beverlys.net/LJ/WordpressHeader.jpg");
   }

   But now it just shows the missing image (ie. nothing at all where the image should be) :(

4. thesacredpath
   Member
   Aug 5, 2011, 5:43 PM

   I just tried the URL of your image on your site using Firefug and it put it where it should be.

   BTW, I would upload it here at wordpress.com when you are done with the images and then put the URL of those uploaded images into the CSS. The site will load much more quickly that way.

Topic Closed

This topic has been closed to new replies.