Blogging 101- How to Resize a Blog Button

Even though I have been blogging since 2006, I am no expert blogger by any means! When my site was hosted on Blogger I learned a lot of tips and tricks simply by searching online for tutorials- I never paid anyone to help me with anything and I think I did a pretty good job making my site look nice. (WordPress is another story- I’m still pretty clueless!) But one of the easiest “tricks” I happened upon all by myself was how to resize a blog button. I discovered this trick completely on accident and I was amazed that I didn’t see it sooner- it is so obvious and SO easy!

Until I came across this “trick” I would literally make a new button myself for every button that I grabbed so that it fit on my sidebar exactly how I wanted it to- it was such a pain!!! When my sidebar became the prettiest in blogland (ahem.) I received quite a few comments asking me how I got all my buttons lined up so nicely and all the same size. So for all of you who have been wondering, here is the EASY tutorial:

First, you need to add your html gadget. From your dashboard, click the “Layout Tab” thenĀ  “Add A Gadget”.

how to resize a blog button 1

Clcik on “HTML/JavaScript” from the list of gadgets.

how to resize a blog button 2

A box that looks like this will come up:

how to resize a blog button 3

Add the html code for the button you want to add and it will look something like this:

how to resize a blog button 4

From this page that looks like a foreign language, click on the “rich text” link.

how to resize a blog button 5

It will show you something like this:

how to resize a blog button 6

Now you can then click on the picture of the button and when it is highlighted, you can drag it to make it bigger or smaller. The dimensions will show up too, so you can make it 125×125 or 300×300… whichever you prefer to fit in you sidebar!

how to resize a blog button 7When you are done, click “Save” and your blog will look so nice and pretty!!!


If you can navigate your way through your html code, you can also adjust the size manually by adjusting the numbers of the dimensions right from your code, like this:

how to resize a blog button 7Change the dimension numbers by typing over the existing dimensions. Not all button codes will have their dimensions in the code, but if you go through all of the above steps (dragging the corner of the picture etc.) the button code will automatically change, adding the dimensions into the actual code.


No more overlapping buttons on your sidebar!!!

This tutorial originally published on Somewhat Simple in November 2009 but was updated in October 2013 to show the newest Blogger dashboard images.

Wife, mom of 5, and creator of Somewhat Simple, Stephanie has a passion to create and inspire. She is an Orange County transplant who is now enjoying life in Phoenix, AZ. She enjoys traveling, shopping, organizing, cooking and creating simple projects for her home and family.
How to Add More Fiber to Your Diet #sponsored - 3 hours ago

Latest posts by Stephanie (see all)



  1. Cathy says

    Thanks so much for sharing! For us new bloggers, there is so much to learn. How do you create a button in the first place?

  2. Connie says

    That was a great blog tip. I have had a button that was too big for my sidebar and I never knew you could change the size of such things, now I know. Thanks so much. I love it when others share their knowledge with computer challenged folks like me.

  3. Nancy Jacobs Basketmaster says

    Thank you so much! This is a big help. Now, can you do a tutorial on how to make your own button?
    Thanks and blessings,

  4. says

    Wow…Thank you so much…who knew it was that easy? :) It seems lately more and more link parties want their buttons or links in the post before you can link up. I know there must be an easy way to do that too but I don’t know how…Any chance we could get a tutorial for that too??? :)