How to Make a Badge for a Blog (6 Steps)

Go to a free online badge generator where you can pick out the text, size and colors of your badge.
Open a graphic editing program such as Adobe Photoshop. If you don't already have a good graphic editing program, you can download a free trial of Photoshop or a free, open source program such as Paint.NET.
Create a new file in your program that is 125 pixels wide by 125 pixels high. This is the standard size of a blog badge. Do this by choosing the size when you create the new document.
Open the file that holds the logo for your blog, or create one if you don't have it. Right click and 'Copy' the image from your site, or simply type the name of your blog on the new file that you created. Find a freeware image or clip art to add to your badge. Make sure that however you decorate it, it represents the look and theme of your blog.
Save the badge to your computer when you are satisfied with it. Make sure you save it with a file extension of .jpg, .png or .gif. These extensions are the ones that are used the most often for badges. Go to a free image-hosting site and upload your badge. When you upload it, the badge will have a URL so you can put it on the sidebar of your blog for people to use. If you have a domain that is hosted on your own server, you can upload the badge with an FTP program or from the online file directory in your host's control panel.
Put the badge on your side bar with a line of HTML code. If you uploaded your badge to a free image-hosting website, it will most likely give you the code you need for your badge to show up. If you uploaded to your own server, use this code to place your badge on the sidebar of your blog (replacing 'yourdomain' and 'yourbadge' with the correct names):
VPS Hosting

How to Make Custom Buttons for a Blogger

Choose an image for the blog button. For an email contact button, an envelope image works. For a business related blog using their logo along with the text, 'contact us' is optimal. Consider the color of the blog's background so the button will not blend in and the image stands out. Upload the image into a photo editing program, such as Infranview or Photoshop.
Resize the image to 125 pixels X 125 pixels. Upload the new size of the image to a photo hosting website, such as Flickr or Photobucket. Right click the image and copy the location address for the image. Paste the location address in a document to save it.
Use this HTML code to put the button together: . For an email contact button, place 'mailto:' followed by a complete email address in between the first set of quotes in the HTML code. The code should look like this
after inserting the email address. For a link button, place the complete web address in between the first set of quotes, such as http://www.yourbusinesswebsite.com '>.
Add the image properties to the HTML code. Paste the image properties in between the second set of quotes. The HTML code now looks like this: http://img1.photohostingsite.com/img00/1111/yourbutton.jpg'/></a>. The numbers and other information in an image properties are different for each hosted photo, so your information will differ from the properties shown here.
Copy and paste the completed code into the layout of a blog. Place an asterisk at the end of the code, if sending the button via email to a friend or client, to prevent the code from converting into the button. Add a note to the email recipient to remove the asterisk before pasting into a blog.
VPS Hosting