Get inspirational ideas for everyday living right in your inbox. You won't want to miss anything, so subscribe free to the Blog Feed or sign up for Free Email Updates on the latest projects, shop news & more. Check out the Project Gallery, Garden, Eat & Inspirations tabs above, to see what you have missed. Browse through the sidebar for this week's Popular Posts!

How to Center Gadget Titles on Sidebar

Moving along the blog design changes...

How to Center Gadget Titles on your Sidebar on Blogger

As you may or may not know, I accidentally deleted my blog template.
I thought about buying an already made template, but because I am
the type of person that is always making minor changes, I decided to create it myself.

One of the first things I wanted to do was to center my gadget title.  
  1. Using the new version of blogger, click on "design" on the top right corner of your screen, then click  the orange "customize" button under live blog.  
  2. Click on Advance 
  3. Scroll down to "Add CSS"
  4. Add this code in the white box.
          .sidebar .widget h2 {
           text-align: center;
    5.  After you type it in, click the space bar once, so you may view a preview below it.
    6.  Look over your preview, if your gadget titles are centered, and everything looks right, 
         then click on APPLY TO BLOG.

There you have it, now your gadgets are centered.

To Undo
To undo centering, just go back to CSS and delete the code 
or go to HTML, save template before you do anything!
Click " Ctrl & F"
In the search box that pops up, type .sidebar .widget h2

You will see it highlighted on your HTML template code, just delete the code there
and then save template.

How to Center Gadget Titles on your Sidebar on Blogger using HTML

For this tutorial you will need a little HTML knowledge.  To manually change the gadget title
on your side bar you will have to sign into your blogger account.
1. Click on the blog you wish to make changes to.
2. Click on "template" on the left of your screen.
3. Under the "live blog" click on "Edit HTML"
4. You are now on the "Overview" screen, click on "Ctrl" & "F" keys to open your search box.
5. Type in your search box "sidebar" and enter.
6. Sidebar will be highlighted on your HTML blog code
7. Look for this code:
.main-inner .sidebar .widget h2 {

8. Under that code paste this code:
text-align: center;.sidebar {

9. It should now look like this:
.main-inner .sidebar .widget h2 {
text-align: center;.sidebar {

10. Click the Preview template tab to view your blog and see if the changes have been made.
      If the sidebar title is centered, then click "save template".  Your sidebar title is now centered.



  1. Thank you for visiting Inspirations by D. I have added the HTML version to the post at the end to help you make the changes manually on your HTML screen. Hope that it is helpful.

  • Ahh, exactly what I was looking for! Thank you for making this so simple!

  • Thank you for adding your thoughts. I read all of your comments and I reply to all one way or another, mostly by email or on your blog. You brighten up my day & for that I thank you.

    Related Posts Plugin for WordPress, Blogger...
    Pin It button on image hover