How to Make a Customized Widget

I am not an expert on computer programming and all those HTML voodoo. But one thing I like about myself is my love for explorations and experiments. And they have become easier through the help of the world wide web.

Yesterday, I was able to make my own Bloglovin’ widget using my own picture. Huzzah!

I already got bored of having the same widgets as everyone else’s. Aside from that, widgets provided by varied social networking sites are very inflexible, makes it difficult for users (who do not know anything about HTML) to edit and tweak the codes to suit their preferences.

Today, I tried to make another widget for my Plurk account using only link html (or whatever it is called). I was a little skeptical at first if it will work, but I tried it anyhow. Below are the steps:

  1. Of course, you have to have first the photo you’d like to make as widget:
  2. Have the image hosted. Flickr and Photobucket are the widely used ones. But for convenience, your WordPress can also serve as the host. Just make a new post (/wp-admin/post-new.php) and upload your photo. Then copy the link (do not forget to hit “insert to post” and “save draft”):
  3. In another tab or window, open Widgets (/wp-admin/widgets.php). I mentioned that I used the link html, and inserted the image source html as well: <a href=”website“><img alt=”I dunno what to put here but I placed plurk” border=”0″ src=”image link“></a>. Choose a TEXT widget, place it on the sidebar and copy and paste the link html you see above. Insert your website link and the image source link (what you copied on step no. 2):
  4. And you’re done. To even out the margins, you can have your customized widget centered by just typing <CENTER> before and after the code:
  5. Now, you have your custom-made widget! Yay! Try experimenting them with other sites, too. One advice I have to give you though is  to always keep a back-up copy of the original codes just in case the new ones won’t work.

Enjoy! 🙂

Join the List

  • Great info! Thanks so much for this. How long did it take you to do the customized widgets? 🙂

    • daphne

      Hi, ma’am. 15 minutes max including the editing of photo. 🙂

  • Wow, 15 minutes! That’s fast! =)

    • daphne

      The editing I did was very minimal po kasi (posterized/filtered them using photoshop). And the codes are pretty simple, I’m sure anyone can do what I did. 🙂

  • Hey gorgeous, tnx for the info! I’ll be making my own widget soon! Lolz!

    • daphne

      go, go, go. it’s fun. 🙂

FOLLOW @DAFNYDUCK

Copyright © 2017 · Hosted by Jehzlau