Blog Community Info and Updates

Information about changes to the Service
posts - 7, comments - 0, trackbacks - 0

Using the Custom CSS Feature in blogs, Part 1

When you get to the point where you want to go beyond our existing skins available to you in your PipeTrader blog, you can use the Custom CSS feature to modify the behavior of your skin to make it more to your liking.

A perfect example of this is image replacement in skins like "Rain" and "Leafy". If you wanted use a different image, go ahead and insert the following code into your Custom CSS window on the Options|Configure page:

#logo
{
    background-image: url("/images/blogname/image.jpg");
}

Where the portion in quotation marks is the relative URL to an image that is uploaded to the blog using the admin web page. (note: your actual URL will differ). I could also have linked directly to an image hosted elsewhere by using a full URL (http://domain.com/images/image.jpg) If I were to

For example, I could turn this:

image

Into this:

image

by adding the above code. You'll notice that the background watermark hasn't changed in the No More Tobacco Taxes website shown above. I could have easily done that by adding in the following code:

#post
{
    background-image: url("/images/blogname/fadedimage.jpg");
}

Note, you wouldn't want to use the exact same image, you would need to use a faded version of the image to keep the image looking like a watermark in the background.

If anyone has questions about how to modify something on a skin using the Custom CSS feature, make sure you leave a comment on this post and I'll create another tutorial as a continuation of this series.

MJG

Print | posted on Saturday, July 14, 2007 6:29 PM | Filed Under [ Instructional ]

Feedback

No comments posted yet.

Post Comment

Title  
Name  
Email
Url
Comment   
Please add 4 and 1 and type the answer here:

Powered by: