How to make a blog badge

Tuesday, January 26, 2010

1. Prepare a picture that you like to use as your badge.

2. Resize the picture, preferably 100x100 pixels or depends on your choice and save in your computer.
3. After resizing the picture, upload the picture at Photobucket. If ever you don’t have an account yet, then you have no choice but need to sign up for new account.
4. Once you’re done uploading the picture. Click the picture, click share and click get link code.

5. Copy the HTML code that I highlight.
6. The code appeared as like this. As you notice in the code, I apply some colored text.

<a href="" target="_blank"><img src="" border="0" alt="Photobucket"></a>

7. Edit the following code by following the sample that I show below. The red text means, you need to replace that with your own URL. And the blue text means need to delete. The result should be like this.

<a href=""><img src="" /></a>

8. Go to your blog layout, add gadget and HTML/JavaScript. Then paste the final HTML code that you edit. Don’t save yet because it’s not done yet.
9. Go Here. Erase what is already there except for this sign </em>that you can see in both side. Paste your HTML code between the sign. Click Encode.
10. After you click the encode, there’s a new code that will appear, copy that and paste it below in your HTML/JavaScript that you previously open.
11. Now you have to insert in the middle the code below to make a scroll bar for your code. And click save.

<div style="WIDTH: 130px; HEIGHT: 90px; OVERFLOW: auto"><table style="HEIGHT: 200px" cellspacing="0" cellpadding="0"><tbody><tr><td><ul>


Blog Archive

Follow me and I'll follow U


Married countdown

Daisypath - Personal pictureDaisypath Anniversary tickers

We started as "friends"

Daisypath - Personal pictureDaisypath Friendship tickers