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!!!

ALTERNATIVE:

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.

THAT IS IT!!!

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.

Stephanie
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.
Stephanie
Holiday Bucket List http://t.co/FM8WjyrUSs - 5 hours ago
Stephanie
Stephanie

Latest posts by Stephanie (see all)

Comments

  1. 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. Good tip! Are you using the New Blogger Editor? — not sure it works with the older/default editor.

  3. AWESOME!!! Thanks!

  4. 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.

  5. this is good to know. thanks a bunch

  6. cool! Thanks for sharing!

  7. 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,
    Nancy

  8. WOW – i NEVER knew you could do that, haaha. Thanks!

  9. 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??? :)
    Thanks!
    Denise