This is our Blogger FAQ and Help guide on the questions and issues that are commonly raised by Bloggers as well as the readers of our Blog at Tips for New Bloggers. Here, we shall elaborate on the finer details of the customization tips for your Blog template, give further examples, and answer specific queries. For detailed write-ups and discussions on the topics, please refer to the articles in our main Blog. Before changing any template, please remember to save a copy of the current template. After editing the template, preview it, and save it when you are satisfied with the change.
Blogger FAQ and Help

Header
  • Insert an image to the left of Blog Title and Description [read]
  • Add a Horizontal Navigation Bar in Header Image [read]
  • Unable to remove Header Image [read]

Blog Posts
  • Arrange, customize and shift the Blog Posts and Footer elements [read]
  • Insert a picture or image beside the Blog Post Title [read]
  • How to have standard or pre-formatted text in Blog Posts [read]
  • Add Highlighting to Text and Background Color in Text Box [read]
  • Change Blogger Post URL - SEO Tip [read]
  • Change the Post a Comment Link [read]
  • Add scrollbars to text within Blog Posts [read]

Sidebar
  • Add Background color and image to Sidebar Titles [read]
  • Have different Background colors for each widget [read]
  • Style and Position Sidebar Images [read]

Footer
  • How to align Blog Post Footer elements to the left [read]
  • Move Comments Label to below Post Title [read]

Links and Labels
  • How to add Hover, Mouseover and Rollover effects for links [read]
  • Remove automatic number count in Labels widget [read]
  • Remove link underlines in Blog Posts and/or sidebar [read]
  • Be notified by Blogger when there is a Backlink [read]
  • Change and Edit Labels in Multiple Posts [read]

General
  • How to change Background Colour of TicTac Template [read]
  • How to remove the Pencil or Screwdriver and Wrench icons [read]
  • How to add animated graphics in Blogger Post and Sidebar [read]
  • Add Text Box or HTML textarea code in Blogs [read]
  • Know the limits on our Blogger account [read]
  • How to take Screenshots or Screen captures [read]
  • How to change and transfer Blog ownership [read]
  • Change font size and font styles in template [read]
  • How to center align Page Elements [read]
  • How to insert a separator line between each comment [read]

Search Tricks for New Bloggers

banner
We have extended our month-long vacation by a couple of days. We shall be posting articles the moment we return. We noticed that Google had updated the Page Ranks. New bloggers who have been waiting anxiously for this can check their blogs' Page Ranks. We have the PR checker link in our SEO Tools - Search Engine Optimization article.

The blog we created recently in Aug 2007, Blogger FAQ and Help, has also got its first Page Rank, a PR4. All our blogs are now ranked:-

Tips for New Bloggers - PR6
Business Fables and Management Lessons - PR4
Famous Motivational and Inspirational Quotes - PR4
Blogger FAQ and Help - PR4

Thanks to everyone for the support!

Aug 23, 2007

Digg This Story

Background Colour of TicTac Template

This guide shows you how to change the background color of the Blog Posts or Sidebar in a TicTac Template. Changing the background color of a Blogger template is not difficult. You can follow our guide at Background Image for Blogger Template which discusses as well the way to add a background color to the entire Blog, Blog Posts or Sidebar. While this works in most of the Blogger templates, you will not see a change in others. This is because what you see as a background in some templates are actually the result of a background image created by the designer of the template.

One good example is the TicTac Template. What you see as a white background and a grey sidebar is due to this image located in your template:-

#outer-wrapper {
background: url(http://www.blogblog.com/tictac/tile.gif) repeat-y;
}


If you enter that image URL into a browser, this is the picture you see that is repeated vertically.

Background Colour of TicTac Template

To have a different background color to the Blog Posts, you would have to edit this image. Save this image into your computer. Open an image editor software - Photoshop, Paintshop Pro, or download free ones from the net. Open the image file, select the white area and use the Paint Bucket tool to change it to another color.

Background Colour of TicTac Template

After editing the image, upload it onto a free image server. You can use free hosts like Google Page Creator and Google Groups or look up our rather comprehensive list of free Image Hosts and File Hosting Services in the article on Manage Blogger Image Storage Space. Find a site that is fast, reliable and enables hotlinking to the uploaded files. Copy down the IMAGE URL.

Next, go back to the template code at Template -> Edit HTML. Look for this:-

#outer-wrapper {
width: 847px;
margin: 0px auto 0;
text-align: left;
font: $bodyfont;
background: url(http://www.blogblog.com/tictac/tile.gif) repeat-y;
}


Change the background image url to the new IMAGE URL that you have just uploaded.

#outer-wrapper {
width: 847px;
margin: 0px auto 0;
text-align: left;
font: $bodyfont;
background: url(IMAGE URL) repeat-y;
}


Preview the Template. From a white background like this:-

Background Colour of TicTac Template

You will now see a colored Blog Posts background in the TicTac Template like this:-

Background Colour of TicTac Template

Should you want to change the TicTac sidebar color, use the same method but select instead the grey portion to the right side of the image. Change that color using an image editor and upload it onto a free server. Insert this new IMAGE URL into the template as shown above.

If you are satisfied with the new background color of the TicTac Template, save the template and refresh your Blog.

© Tricks for New Bloggers

Found this article useful? Mention us in your post, subscribe to our feed, link to us, or bookmark this site. Thanks for your support!AddThis Social Bookmark Button

1 comments:

VinC said...

Hi Bizwhiz..

Thx for your tips,i've tried and it works.I'm using Tictac Blue template,can I request manual to modified it become 3 column template?Thanks before..