How to install social network icons onto your blog

By Dana Fox

Happy Friday, friends! I get a lot of questions about how to install image links and buttons and things to blogs, so today I am sharing a little how-to as well as some free graphics for your sites! You will get these cute social networking icons and the matching sidebar widget titles and also learn a thing or two about putting them on your blog. They have transparent backgrounds so will blend in nicely with any layout.


click image to download

After extracting the images, you’ll need to upload them to an image hosting service. You can use Photobucket for this step.

Let’s start with the social network icons.
Once uploaded, all you need to do is copy the full image URLs of each image (the ones that start with <img src=”) and paste them into a new HTML/Javascript widget in your sidebar, side by side like so:

<img src=””><img src=””> …. etc.

Of course using your own image URLs instead of my example ones.

To add links to the social networking icons, you just need to wrap your <a href=> link around each image code like so, and remember to close the code with the ending </a> tag:

<a href=””><img src=””></a><a href=””><img src=””></a> … and so on.

For the sidebar titles, it’s best to place these inside their own HTML/Javascript widgets in Blogger. So, create a new HTML/Javascript widget in your Layout dashboard and paste in the <img src> code of your first graphic title, just as you did above for the first social network icon.

Save your widget and position it properly in your sidebar. Make a new HTML/Javascript widget and do the same for the next. Continue for each title until they are all properly in place. Click Save Arrangement at the top.

That’s all there is to it!

Some new premade Blogger templates have been added to my design shop as well:


Enjoy and have a great weekend.

Need blog topic ideas? Check out 365 Blog Topic Ideas on Amazon!

Dana Fox
Dana Fox
About me

I am a country loving Canadian with a mind that never sleeps. When I'm not running the Wonder Forest blog ship, you can find me creating artwork for phone cases and home decor, whilst managing the daily tasks of Dana Fox Creative. Visit me at the links below if you wanna be friends!


My Essential Daily Blogging Tasks
February 05, 2016
How To Build A Killer Brand Experience
February 02, 2016
How & Why You Should Host a Twitter Chat
January 28, 2016
6 Common Causes of Your Repeating Failure as a Blogger
January 22, 2016
The Best Blogging Tips Of The Year
December 28, 2015
Exclusive Black Friday Weekend Deals for Bloggers
November 27, 2015
How To Improve Your Writing Skills
November 12, 2015
Transitioning from Blogger to WordPress Smoothly
November 03, 2015
A Blogger’s Complete Guide to Success
October 27, 2015
  • Talisa Tossell

    This is so handy! This is one of the things i put on my board! Thanks, Dana!

  • Melanie

    that was very helpful thanks alot dana =)
    click to visit my blog

  • Hanna Lei

    Thank you so much for this! I love all your blogging tips. Hanna Marie

  • Deanna Martinez

    This is wonderful! I'll tuck this away if I add some more buttons onto my website, they would look great on there! It's so nice that you're sharing this <3

  • Adeola Naomi Aderemi

    Thank you so so so much !!!

  • Fee

    This was actually so helpfull and needed, doing this right now!

  • thefashionsucker

    This is very generous of you! I'm sure it will help out a bunch of people x
    Maria xx

  • Camille L

    Thank you very much!!!

    Camille ❤

  • sarah jones

    Thankyou so so much for making these and letting us all have them for free, you are so generous and amazing!
    Sarah :-) xx

  • Jessica Hobin

    these are awesome! I wasn't sure if I was installing these properly but apparently I am. I used your 'how to make a header' video yesterday and it was so, so incredibly helpful. Thanks so much!

  • Farah Zeezo

    THANK YOU SO MUCH it looks so good <3

  • Meghan

    These are adorable! Thanks so much for creating pretty, FREE things! Awesome.

  • Sarah

    I always wondered how to do that! Thanks for sharing!


  • Carlyn Brody

    Thanks for the free stuff Dana. I love the new premade templates too especially Tiffany.

  • rebecca-ella

    Thank you so much for this stuff! It's really helping me! I'm currently trying to make my own themes and stuff for my new blog but I seem to be failing miserably :( Your tutorials like this are really helping me though! I love all your pre-made themes! x

  • One Dollar Milkshake

    Hi there^^,
    Thats soo great, the buttons are so so cute with this ruffled rim 😀
    You are so awesome and your blog is just so so lovely!
    XOXO Abby

  • simply cintya,

    Very helpful, thanks!

  • daughter of zion

    this is such a good idea to put on your blog!
    and that new penelope layout is so beautiful.
    i love the watercolour flower elements!
    keep it up Dana!


  • Rebecca Beardsley

    Wow thank you this is amazing! :) love your blog! X

  • Emma McIlroy

    Thank-you so much! I can't believe it worked, your instructions were so good, this is the first time I've been able to do anything to do with html!!!
    I can't thank-you enough! :)

    • JustLil’ Ameera

      hey i couldnt do it cause you know i just not smart can you help me

  • Lauren

    Thank you, this is great! Always wondered how to do this :)

  • Dana Carmella

    Thank you for this freebie; the social network icons are super cute. Right when I saw them, I immediately utilized them in my blog, thanks again! :)

    lots of love, Dana Carmella
    Bloglovin' & Blog: Pretty Odd ♡

  • Rosie W

    Thanks – as always :)

  • StaceyFacex

    Wow! These are great 😀

  • Marianney

    These are super cute, thank you for sharing them! I love the Blogger templates too, especially the blue one. I have shared these with my followers, I think they will love them.

  • Feranmi Thomas

    This was so helpful, just what i'd been looking for.

  • Louise Gillanders

    I just had a little peek into your shop and gosh your designs are beautiful~ I know who I'll be coming to if I ever want a re-design. Great work!

    Lou x

  • JustLil’ Ameera
  • Cashmere Lace

    Wow I am so glad I stumbled across your name on Zoella's blog. Your webdesign as well as just beauty blog is aMAZING! I snagged these freebie social media icons and I have to say thank you SO much! I just started my blog here ( and I added you to my blog roll to hopefully spread the word about how amazing you are! <3 I also purchased your book from Amazon! You're such a gem! Can't wait to read it! xoxo

  • Beth Griffiths

    Thank you so much. That was so helpful
    Beth x

  • Jocelyn

    Thank you ! <3

  • Steampunk Suzy

    First i'd like to say thank you for providing these tips. Secondly though due to me being a newbie I'm actually struggling to put these on my blog I've got as far as creating an account with photobucket and dragging the folders and license on to the desktop but beyond that I'm confused.

  • Rebecca Dicken

    none of mine start with the src, so confused..

  • Dipster Chy

    Thank you sooooo much!I just created a blog and this was really helpfull!Keep posting I love your blog and your tipps!

  • Divya S

    I just created a blog and all the tips that you have given have really helped! Thanks so much. Much love. Xx

  • Elle Panteli

    I've managed to get the icons on my blog, but I can't link them to my social networks? I'm not smart when it comes to these things. Can you help me lol ? Thank you x x x

  • ModernLadyJane

    I can’t find an icon that starts with <img src=

  • PolishPals

    Thanks so much for the adorable icons! They go perfectly with my blog now. :)

  • Ramona Appleseed

    Help! It keeps saying I have illegal characters. Trying to apply in Blogger.

    • Dana Fox

      Not sure Ramona, the code above should work just fine. ???

  • Sarita’s Diary

    Woooow beautiful! I have already uploaded the social media icons. Thank you Dana :)

  • Rebecca Dicken

    I used these social icons on my last blog and I managed to get them to work perfectly, but I have some new ones and I can’t find a link starting with “img src” and once I finally get the direct link and wrap it in my social links, it ends up going to the icon picture on photobucket rather than my social network page.

    I’m not completely sure what I have done this time haha and I dont know what I can do to fix it.

    Rebecca :)

    • Dana Fox

      If it’s going to your picture and not your link, you have the URL of the picture inside the “a href” code and not the link to the page

  • Helen Jerram

    Hey Dana! :) Thanks so much for these icons and titles they’re perfect as I’m just learning and creating a blog! 😀 One quick question though what is the name of the font used in the side titles? Helen xo

  • Hebe Young

    I uploaded the icons for the social media onto photo bucket but i don’t know where I can dine the URL? I right clicked but it didn’t give an clues as to where I could find it!

  • danielgrant

    It has a variety of positive aspects: when buyers get into these low quantity words, they’re anxious! They have not found a solution formerly in their searching so if you provide that, they’ll most likely spend cash with you. go to website