Related Posts

31 Comments

  1. Ooooh, I am loving this! I have only recently started a new blog on Blogger and there are so many things that I’m struggling with… Thank you, thank you, thank you! for this is all very helpful, especially to us newbies :) Now I don’t have any more excuses and I will have to get myself some social media icons!

    1. Awesome! Give us a shout on Twitter if you need any help – and if you have any other questions :)

      1. Yea me too Maree :) Thanks to these guys we are getting a hang of this! :)

        I have another doubt as I am posting this comment I can see my latest post title ticked below…Have done anything wrong with my settings?

        1. Your comment is fine! We have a little plugin on WordPress that goes to your blog and gets the details of your last blog post, so when other people comment, they can click through to read :)

    1. Hi Jena,
      You would just keep the html as one block, so no gaps or line breaks between each icon set. This should keep everything in one row! Or you could put the icons you want as one image and use our image mapping tutorial to map the different items

  2. I tried following the tutorial, and it’s so confusing. Between the image and base URL’s, and trying to figure out why the links wouldn’t work I threw in the towel. I wish this was easier :(

  3. Oh super, thanks so much for that! We’ve been meaning to add new buttons to our site for aaaages but in my head it was an absolutely huge job. This makes it seem much more manageable!

  4. Hi,
    I’ve managed to get the links up there to the icons but the pictures are coming up as broken images? How do i correct this? I used flickr to upload my images. Is there something I’m doing wrong?

    Thanks in advance.
    Nicola

    1. It sounds like the URL for the image isn’t right. You can find the image URL on Flickr by clicking the square with arrow coming out. Make sure you choose the HTML option, and on the dropdown, choose the original size. The image details are the tag that starts <img src=””>

  5. Hi! This tutorial is awesome but i’m having trouble! When I copy and paste the code in and save it, the icon appears, but when I click on it it adds my own blog’s URL to the front of the link so that it goes to a page on my blog saying ‘this page does not exist.’ i have tried it a billion times and i don’t know what the problem is! ack!!

  6. THANK YOU!! I wasn’t happy with everyone’s adjusting of my blog, and I’ve finally learned out to do it myself!!! Feeling proud and loving the simple explanations!!

    1. I’m not too hot on Tumblr, but the easiest way I found to do it was to create the links for your icons (so getting the code together with all the profile details you want to show on your page), then paste that into the description section. I’m sure there’s a much better way to do it, but it’s probably quite specific to each theme :)
      Hopefully this image makes it a bit clearer what I mean…

  7. Great post!

    I’m wondering if you can help me get my social media icons in one row. No matter how small I make each icon, after three it cuts to a new line. I’ve tried leaving no gaps in the HTML. Nothing’s working!

    My blog is: http://www.shelbichic.blogspot.com

    Any help or advice would be greatly appreciated.

    Thanks,
    Carissa

    1. It looks like you’ve sorted it now! I suspect that the images that you were using were bigger than the ones you have at the moment, so only three would fit in the width of your sidebar.

  8. It works perfectly!
    Just one question: is it possible to have the links open in a new tab, instead of navigating away from my page?

    1. Yes! We’ll be doing a more indepth post about links and new windows soon, but if you add in target=”_blank” into your link (so it says <a href=”http://www.bonjourblogger.com” target=”_blank”>), then each link should open in a new window.

  9. Hi, I’ve been trying to get this to work through wordpress, with the logo html from my flickr but it doesn’t work. It comes up with text beside it and when you click the image it just goes to the logo on flickr. Im more than likely doing it wrong though, so is there any chance you could help me do it?

  10. Thanks so much for such a helpful tutorial, fantastic explanations! I’m having a problem where everything works and looks amazing on my pc but I asked a colleague to check the links in his pc and we discovered that the images are not showing up for him, even though they’re working for me. Is there anything I can do?

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.