9.21.2009

Tutorial on How to Add a Super Cute Header to Your Blog!

I decided that I needed to figure out a way for EVERYONE to have a Super Cute Header, even if you don't know how to make one yourself. So I am now going to start designing cute Headers and they will be available FREE on my Blog Accessories Page. It is soooo simple!



Step #1:
Go to the Blog Accessories Page and pick out a header and copy the text in the box below it, or if you have one of your own that is great too!

Step #2: Go to Layout, and Page Elements, and Click on Edit (next to Header).


Step #3: Paste the text that you copied from step #1 in the "From the web" spot, and make sure that you have selected "Behind Title and Description". Then Click Save.


Step #4: Then you will notice that Your Title is not centered in the image, it is on the top. To fix this, we are going to go to the "Edit HTML" Page. (When you are finished with this tutorial Click Here to learn how to get rid of the border around your header)


Scroll Down until you see #header h1 { and change the 15px to 130px. Then Click Save Template. (Note, you do not have to change it to 130 exactly, that is just the best number for centering your text on my Headers, if you have a header that is sized differently, you will have to play with different numbers until you find one that centers it well.)

And that's It! You have a beautiful header! Just another way to Makeover your Blog!

Photobucket

15 comments:

linda said...

Thank you so much for the tutorial! I'll have to do one soon!!!
diaryofacraftaholic.blogspot.com

linda said...

I just added that super cute header to my blog. Thanks a bunch!!

Maritza said...

So cool! I did it!!! yay!

Kenna said...

I can't seem to get it to work. I follow your steps & my entire header disappears. Maybe you know what I am doing wrong.

GuiltyMom said...

You are awesome! I have been searching everywhere on how to do this and you have the best explanation. Not to mention the best backgrounds!! Keep 'em coming and Thank you!

Steffi G Rohn said...

In step 3, I don't see "from the web" anywhere??
-Steffi

Captivated Candids said...

Thank you! I love it! I just posted it onto my blog! www.captivatedcandids.blogspot.com

mesmerizeme said...

hye! how can i put the words in the header towards centre? i have tried but i never found any code like you have showed in that tutorial.oh please help me,i'm going to have headache looking at those code :(

CA Farrells said...

How do I add a picture too?
THANKS!

KD said...

thanks a million!!!!

Erin Kearina said...

In step 4, I don't see
"#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
and so on.." anywhere??
-Erin

Kelly said...

I am having the same problem as Erin. I don't have that information in my edit html list.

Terra said...

I am with Erin and Kelly. Super cute stuff but I don't have that information in my html list either. Disappointed. Please tell me how to center it!

Einazx Ae-reyna Siigadiszpinkkawaii'eporeba said...

heyy .. thx 4 that tutorial ...
my blog was cute with it ..
follow me -->> misxeinazxaereyna@blogspot.com

kerker said...

thanks for the tutorial =) really appreciate it, struggling big time to create a cute one on my site