hello there! First time visiting? Subscribe to get new posts via email.

Creating Sidebar Gadget Titles

This has been a much requested tutorial, but it’s so easy that I’m a little afraid you’re going to be disappointed– like I’m taking the magic out of Christmas or something.
But you asked, and so I acquiesce :)
Like just about everything else, creating sidebar gadget titles are just knowing how to create an image, copying that image URL, and pasting it into the right bit of code.
1. Create an image (I use Picmonkey) from a white starter image.
  • Make sure the white starter image is sized correctly before adding words or graphics. The width should be about 5px less than the width of your side bar (ie: my sidebar is 300px, so the width of my image is 295px). I usually start out with the height at about 100px to give a little wiggle room, and then crop down to about 65-75px at the end.
2. Get the image URL.
  • You can either get the URL by right clicking on your image in an online album or in a blog post– select “copy image location.”

3. Paste the Image URL into this code:

  • <center><a><img src=”IMAGE URL” /></a></center>

4. Copy and Paste the code from Step 3 into an HTML gadget on your Page Elements (or layout) page.

  • You can sometimes put the code for the gadget title into the same HTML gadget box on the layout page. For example: if your social media icons are in your sidebar (mine are not, so don’t look to my blog as an example)– you can put the title for your icons (like: “Connect With Me”) in the same HTML gadget box as the code for your icons.
  • Sometimes you have to put the code for the gadget title into a separate HTML box. For example, a gadget like a Search Bar (like in my side bar) does not allow you to add any additional coding.

5. Move the HTML box wherever you want the gadget title to appear in your side bar. Be sure to CLICK ON SAVE up top.

  • If the code for the gadget title can’t be in the same HTML box as the gadget itself, just move the HTML box to be right above the gadget box.

Please visit my Party Page for a more complete index of Link Parties.

Ashton Swank

Ashton is the owner and author of Something Swanky. Although first and foremost a wife and mother, she considers herself an online entrepreneur, freelance writer and photographer, and brand ambassador. Her focus is in food styling, food photography and recipe development.

24 comments on “Creating Sidebar Gadget Titles”

  1. Wow no way that easy? thanks for posting, I had tried this before but always had issues with the size. I thought I was missing something but now I know how to fix it.
    Thanks for posting

  2. Oh my gosh, Ashton–thank you SO MUCH for posting this! I’ve been wondering how on earth to do this…now I know! =) Can’t wait to give it a try!!

  3. Love it Ashton. Another great tutorial, as always. :)

  4. This is a great tutorial! I’m glad it’s so easy! I’d love for you to share it at my new Tuesdays Link Party:
    http://naptimedelights.blogspot.ca/2012/05/document.html

    Thanks! Sarah @ http://www.naptimedelights.blogspot.com

  5. Pinning this! So easy to follow! Thanks for sharing http://meijosjoy.blogspot.com/

  6. Great advice, thanks! I would love for you to share this (and any other creations) at Pin It and Win It Wednesday @ http://www.cheapcraftymama.com– where you can win free ad-space on my blog!

  7. Thank you so much for the info! Here from Ginger Snap Crafts, and now following your awesome blog :) Would love it if you followed me back too!

    Tanya @ http://twelveoeight.blogspot.com/

  8. Thanks SO much for this! I’ve been paying with my blog design this week and was trying to figure this out!

  9. I’ve been waiting for this one :) Thanks. Do you think it’s always necessary to have sidebar titles? A lot of my sidebar isn’t labeled and I’m not sure if I should change that.

    We’d love for you to link this tutorial up to our Finished Friday blog party.

    • No, I don’t think it’s always necessary. Or even EVER necessary, really. Just whatever you think would make your sidebar look better and easier to navigate :)

  10. I just wanted to drop by and let you know how much I appreciate your tutorials! I have been having the BEST time working on my blog for the past couple of days. I have had your blog open for three days with PicMonkey open in a tab right next door so that I can easily switch back and forth! It is so exciting to finally be able to get my place fixed up a little bit.

  11. I cannot tell you how amazing your site is and how helpful it has been! YOU ROCK! I can’t stop reading all the DIY. I hired someone to do my blog (its not done yet), but I am not liking what I am seeing so far.. boo to spending all of that money!

  12. #3 is no longer showing. Can you help?

  13. Thanks so much for your blog design tutorials! They have helped me tons! But for some reason, even though I have refreshed this page many times, I cannot get the code to show up that is needed to paste the image url into. Could you please tell what that code is? Thanks so much!

  14. Number 3 is not showing up. Can you please email me that info? Thanks and awesome tutorial!

  15. hi, I am trying to set up a blog for my daughter. I haven’t blog in a while and I wanted to ask some questions. First off, it seems that googles’ site, BlogSpot has changed some. I want to add pictures to the sides as well, and I am not sure how to do that. I never did that on my own blog.
    You can tell I don’t blog much, but it is something that I wish to do better at.

  16. Hey girl, step 3 isn’t showing the code?

  17. Any luck with step #3’s code?

  18. HI THERE! first off thanks so so so much for the tutorial. Also, for the search/categories/archive gadgets – they won’t let you run without a title right? So how can I eliminate the title(when I’ll be putting the gadget title image in a seperate HTML gadget)?
    Help. Pwease.

    -Aish xx

  19. How do you get your social icons so close together?

  20. Ashton, thank you so much for these design posts! My blog would still be a total bore if it wasn’t for these. I do have one question that I don’t believe you’ve posted on yet. How do you get a cute looking search bar?

Comments are closed.