Saturday, May 5, 2007

Step-by-Step Blogger Customizing - Part II

Since last post, I have messed around a bit with the "fonts and colors". There are tons of options to try out here. For example, since I don't like all the dotted lines that were around the post and under each link in the side bar, I changed the "post border color" to white and they all disappeared. I also gave the "post title" and the "sidebar title" contrasting colors.

The other change I made this morning is a bit more complicated to explain. I took off all the rounded corners because they were somewhat incompatible with the photo at the top and will tend to interfere with background changes I'd like to make. You can just leave them alone if this seems too complicated. I'll explain how to do this in more detail in a later post, but the gist of it is to delete all of the image files imbedded in the template. They look something like this:


but you have to take some coding with them and it's not always easy to identify which coding goes. Each line with this coding in it starts with "background:". If there are references to a background color or to margin sizes, then keep those parts of the line, otherwise you can delete the entire line. You can try this out if you check everything out in "preview" mode, but I'll give more detailed examples later.

Important Note: For now, I've left the image file alone in the "comments" section of the template as I haven't gotten comfortable with editing that yet.


Shawna said...

I am learning SO much from you! Thank you! Here's another question that I just cannot figure out: I see some Blogger blogs have 2 sidebars, like
[URL=]This One[/URL]. How'd they do that??

Shawna said...

Oops, I guess the Blogger doesn't accept that HTML in their comments, or maybe I typed it wrong! I meant this:

Melissa Wiley said...


Melissa Wiley said...

LOL, I had to try a link out to make sure what I'm about to say was correct. Shawna, your link didn't work above because it's in bulletin-board-style code, not HTML. You need to use the pointy brackets

<> instead of these []

And put the URL inside quotes. The closing tag is < /a > (minus the spaces before/after the pointy brackets--I had to put them in here or they would just turn to live HTML).

As for your question, you can do a search for "free Blogger templates" and find many 3 column templates you can download and paste into your blog's template. Just make sure you back up your own template before you do that! (Save it to a text file, like in Word.)

Beth: said...

Shawna, you can also find a variety of templates right in blogger. When you log in, go to 'layout' -- at the top of that page there is a tab labeled 'pick new template.' Within that window are all the templates blogger currently has available. You can select various ones in turn, and then click on 'preview template' to see how your blog would look.

If you choose a new one, yes, as Melissa says, make a copy of your current template first.

The Bookworm said...

Ooh! This is so helpful!I finally got brave enough to tackle the html and have managed to change the template on my blog. Thank you :)

Kristen Laurence said...

This is so fun, thank you!

I'm liking my updates, but I can't figure out how to change the background color on my current template. It is a green, but I want it a few shades lighter. My current Blogger template doesn't allow a variation. Any suggestions on how to change it through html?

Love2Learn Mom said...

Yes, I'll do a post on background color soon - probably tomorrow.

Anonymous said...

recently came across your blog and have been reading along. I thought I would leave my first comment. I don't know what to say except that I have enjoyed reading. Nice blog. I will keep visiting this blog very often.