Saturday, July 4, 2009

How To Get Your Blog Just Right!
Hello fellow bloggers! I've been introduced to the world of blogging and Html a little while back and wanted to share with you all a series of posts dedicated to learning the tips and tricks of the blogging community!

It isn't easy starting off in this world called blogger. It takes much time to learn everything you can do! Along the way I've found plenty of resources that I want to share with all of you. This post is dedicated to one of the most important things: your blog design!

All About Backgrounds
A background is one of the first things a visitor sees. It should sum up what your site is all about! There's tons of blog backgrounds out there that are totally free for you to use! Most of the blog backgrounds requires your template to be on Minima.

To change your template to Minima, sign into Blogger, click on Layout, then Pick New Template. Pick the first thumbnail created by Douglas Bowman. Choose the first Minima option. It should look like this:

O Minima
O Minima Dark
O Minima Blue
O Minima Orchard

Get Free Backgrounds
Next, you are ready to start looking for backgrounds! These are my favourite sites (I've tested them all out) to find top quality, free backgrounds:

Shabby Blogs has one of the best crafted and nicest looking blogs! They feature white middles, perfect if you upload lots of pictures on your blog. Our blog background comes from this site! Here's a sample or two!


The Cutest Blog on the Block is one of the most popular blogging sites for free backgrounds. They've got tons and tons of pages! Check out some of the designs.


Scrap-e-blog has tons of wonderful, scrapbook inspired blogs! Take a peek at some of them!


Simply Chic also has tons of cute blogs! You will need to edit your HTML code in your actual template to use her blog backgrounds (don't worry she explains how to do this on her site), but they are definitely worth a look!

Change your Background
Finally, the last thing you need to know about backgrounds is how to change yours! It's simple! Most of these sites will give you the Html code to put onto blogger. First, copy the Html code (Ctrl + C, or highlight the code and right-click and press copy). Second, navigate on blogger by clicking on:
Layout, then Page Elements, then Add a Gadget, then the Html/Javascript option. Finally, just paste the codes (Ctrl + V, or right-click and press paste) from the following websites into the box, click Save and voila, instant prettiness!

10 comments:

Endah said...

just wanna try this...asking your permission. thanks

tineegirl03 said...

you're cool!!! i've tried your suggestions on my site and it turns out fine. thanks.

lalay1976 said...

hi tina!
i am a follower of your blogs.

i tried doing the 3 cloumn but i can't get it right..please help me. :)
my problem is on the part where i have to edit the sidebar..instead of the word "right", what's on it is $endSide..

i still did what you said but its not right.. please try to visit my blog (http://clickingthatclicks-lalay1976.blogspot.com/)
it is still on the making, so please bear with me..:)

i want to show it to my co clickers when its really beautiful.

i wanted to give up already but when i saw today that you had new posts about blogging, i got inspired again. i wanted to do a lot already but i want to resolve about my 3 column format yet.

lalay1976/sheila

tututina said...

Hi Lalay! I have visited your blog and have made a comment. In case you don't get it, here is my response to your question:

First of all, your background looks like it is too small to fit 3 columns. Double check that your background is in fact a 3 column design from Shabby blogs (she's got 2-columns and 3-columns of the same blogs). Don't worry about sidebar wrapper saying float: $endSide. Sometimes it does not say Right because of your settings. This is what my HTML looks like after I've saved it (it says $endSide too)..hope it doesn't disappear on me:

#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#left-sidebar-wrapper { width: 220px; float: left ; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }

So make sure your background is a 3column blog (has wider white area in the middle) and double check your code is the same as mine. Hope that helps!!

lalay1976 said...

hi tina!
thank you very much!
that was a really prompt reply from you. :)

okay, i will check on it now.

whenever i check trekpay, your blog is the last thing that i check..why? because once i start with it, i get tied to it already..:)

thank you blog fairy!
(by the way, my daughter's name is also tina..:)
mwah! :)

mrnowrench said...

Hey can you check out my site I want something different any suggestions? I tried the background and the mimima setting very easy. Does it look alright I want something good and different. Great site Thanks!

pp said...

thank you very much...these are very nice. but hehe, i copied them, not really for my blog, but for my daughter's scrapbook. thanks again! :D

tututina said...

Thanks everyone for such nice comments as always!!! In response to mrnowrench: Your blog is looking great! It takes a while to learn all the tips and tricks of blogland but there is always so many things you can do with it. If you want to add a second sidebar, you can make your blog 3 columns. When you do that, you need to make sure your background is also suited for 3 columns. Scrap-e-blog is a great site for background and Im sure they have 3 column backgrounds! Or if you aren't happy with that background, there are TONS of sites that provide free backgrounds...just google them! You can also add a unique header at the top of your site that has your blog name on it. You may want to shorten your title. Finally, once youre set on a title, and happy with your colors and layout, you can start to "brand your blog" by adding a button! Hope this helps get you started!

platinum said...

Hello. I want to change my template, I want it in three column can you show me some?

And I want to change my headers too, I want it to look like as wide or as I want, is there some headers layout that available for free?

avonrepbarb said...

I am now following your blog. I wanted to say thank you for the tutorial on backgrounds. I love my new template and background on Blogger.

Barbara Vidal
Avon Independent Sales Rep.
http://wwwavonrepbarb.blogspot.com
www.youravon.com/bvidal