February 21, 2011

How to Center Your Header Text

Although, my backgrounds work best for the Minima template, many of you use the new Blogger Templates, which work great. However, those of you that are using the Blogger Templates may have noticed that my tag in the top left corner shows up in weird spots. (That is why I recommend the Minima template.) Some of you have figured out how to remove my tag so that it does not do that. If you have done this, you must give me credit by adding my button to your sidebar. If you would like help switching to the Minima template, please email me and I can help you. Or if you would like help adding my button, email me and I can help you.

Here is the code for my button:

<center><a href=http://www.blogdesignsbydani.com/><img src="http://bdbd.blogdesignsbydani.com/Dani Button.png"/></a></center>

Click here for instructions on how to add my button.

If you do not give me credit, you may not use my backgrounds.

For those of you using these new Blogger Templates, here's how to center your header text:
 1. Log in to your blog and go to Template/Design and then click "Customize" or "Template Designer" (depending on whether you still have the old Blogger interface).
2. In the Template Designer, click "Advanced" and then "Add CSS".
3. Type the following code into the CSS box:

.Header h1 {

If you want both the title and description of your blog to be centered, type the following code into the CSS box:

.Header {

4. Make sure the header text is centered in the Preview window and then save your changes. Then click "View Blog" 

That's it!


  1. I've always wanted my header centered, but couldn't figure it out. Thank you SO much!

    3rd Grade Gridiron

  2. Thanks so much for allt he tutorials. It's really helped me. I still didn't get my text centered. :o( I have your stamp across some text and was wondering if you could tell me how to remove it. I'll be happy to add your button. Also any chance you could help me with why my ads don't show and my facebook link disappeared too.

    1. Hi Tina,
      Try this code:


      The link to my blog should be removed. Just be sure to add my button. I don't know why your ads or Facebook link are missing. Do they show up on your Blogger Layout page? Let me know how you added them and I can try to help you. Send me an email if you haven't already figured it out: blogdesignsbydani [at] gmail [dot] com.

      Also, what have you already tried to center the header text?


  3. Hi Dani..!
    This all worked for us..thanks so much..!
    I've been searching our posts to see if you've addressed the task of spreading blog title to width of banner..? I hope you can assist again..
    many thanks..

    1. Added this to my list of future tutorials. Stay Posted!

  4. Just found your blog and thanks for the help for my header.

  5. Hi Dani,
    my blog title still look odd, would you able to tell me where's the problem? many thanks.


  6. Hi Dani,

    I finally got it, thanks for your posted tutorial as it helping me a lot. Thank you so much!

  7. I've been looking for a header and background for the last four days. I was just about to give up when I found the Yellow Roses. It's beautiful. Thank you for sharing your creativity!

  8. Thank you! This is what I've been looking for :)

  9. Thanks very much Dani! It works. Yay.


Thank you so much for leaving a comment! I would love to answer everyone's questions, but I am a busy mama. I will try my best, but technical questions that require me to study your blog's html are very time consuming for me. I may not be able to answer all of these comments. If you are a reader that knows the answer to a question, please help your fellow readers by offering your advice.