Bitesize Blogger: Opening External Links in a New Window

Welcome to a the first of a”mini” series of posts about the nitty gritty of this blogging malarkey! You may have noticed a few tweaks and changes to the look and functionality of this blog of late. Well, recently I’ve been delving into some html coding, & addressing all the niggly little things that have been bugging me about my blog. Some of it to do with functionality; some of it purely aesthetic. Anyway, you know how much I like to share my little eureka moments with anyone who’ll listen; and I’ve had a few of you ask about different changes that I’ve made too. Β So if, like I did, you have little niggles about your own blog, but feel a bit glazed over by html, then hopefully I can help show you how quick, easy, (and strangely!) fun, it is, to get the tool kit out and start tinkering with the insides of your blog! (Seriously, if I can do this, anyone can!)

One niggle for me is the way Blogger automatically opens all links in the same tab. So if I’ve got a link to another site in one of my sidebars, readers will be directed away from my blog and onto, let’s say, Karen’s Sewlutions post. Now I think people should click on the links in my sidebar, otherwise they wouldn’t be there! But I don’t want it to be at the expense of my blog. I want readers to hang around and have a look around my blog. They’re less likely to do that if Blogger shuts down my page in order to send them to another blog that I’ve linked to. Ideally I want Blogger to keep my page open, then open any external links, in a new tab. (If you’re not sure what I mean, then click on Karen’s Sewlutions button in my sidebar. Watch, and it will open up a new tab along the top of your screen, with this page still open. Sorted!) This is how to get Blogger to do that. It involves adding some simple html code to a specific place in your template. It’s not as geeky as it sounds. Promise!

1) Click on “Template” in your dashboard. Click on “Backup/Restore”. This will download a copy of all of the coding that goes to make up your blog, and save it in a file on your computer. It’s wise to do this after every few adjustments you make to your blog template. Then click on “edit html”

TEMPLATE-EDIT-HTML

2) This will open up all the geeky gobbledy gook (aka HTML) that is behind your blog; and how it looks and functions. Within the first few lines you’ll find a “<head>” tag. As highlighted in blue in the screenshot below. Click right next to it, on the same line…

TEMPLATE-HEAD

3) Copy the code snippet below…

4) Then paste it right next to the “<head>” tag….

TEMPLATE-ADDING-EXTERNAL-LINK-HTML

5) Click “save template” and you’re done!

From now on, any links to external sites that you put in any of your posts OR your sidebars/footers etc, will open in a seperate window. Any links to other parts of your blog, will open in the same window. So your readers can go visit the sites you recommend, but still leave your blog open to come back to when they’re done!

Told you it was easy πŸ˜‰ (and secretly quite satisfying. Or am I just sad?!)

Tweet about this on TwitterShare on FacebookPin on PinterestGoogle+

70 Comments

  1. Masustak eguzkitan May 16, 2013

    Thanks Portia!! I did it in my blog and it works perfectly!

    Reply
    • Miss P May 16, 2013

      Yay! (and I know because I hopped over and checked ;)So glad it helped someone!
      Px

      Reply
    • Prairie Rapids Audubon October 16, 2014

      Thank you, thank you, thank you! Your instructions were very helpful to my Audubon group also as we use Google Blogger for our website. I appreciated the screen shots and the very clear instructions!

      Reply
    • RJ alabat December 25, 2014

      all my links are opened in a new window. how to set it to outside links only?

      Reply
    • Portia Lawrie December 28, 2014

      RJ, this is to open only external links in a new window….am not sure why this would have been applied to all your links….sorry :/

      Reply
  2. kristicraft May 16, 2013

    Not sad at all, but rather PERFECT with your timing! I finally finished school and thought, “phew, I can actually sit down and try to make my little fledgling blog less ugly”.

    NOPE. No idea what I’m doing, and now that I actually have the time to run my head into a wall over this, it’s bugging me way more than it did while school was still going on.

    It’s comforting to know that the bloggers I admire (and envy, let’s be real, here) didn’t just sprout fully-formed, amazing blogs from their foreheads like SOME deities who may or may not be Greek. Thank you!!

    Reply
    • Miss P May 16, 2013

      Kristi! You make me smile with your ramblings πŸ™‚
      I hopped over to your blog. You use WordPress as a blogging platform as opposed to Blogger. The instructions above only work for Blogger. In theory the code should work on both, but how you get to your template html to put it in, I’m afraid I don’t know :/
      If you google it, something is sure to show up. I hear WordPress has more customising options than Blogger as standard. Good luck!
      Px

      Reply
    • kristicraft May 16, 2013

      I actually don’t really have a problem with the opening up in a new tab thing, but only because WP offers the option in a very hand-holdy way. I’m just excited for the mini-series in general haha! =D

      Reply
  3. Helen May 17, 2013

    Oh thanks for this! That really bugs me too on other sites, but I didn’t realise it did it on my site. (Should I be spending time reading my own blog to check up on these things?). I will give that a try.

    And thanks for this mini-series. I have done what I can with my blog, and am actually quite impressed I got this far. I’d like to learn more about html and all that geekery but if I have free time and it’s a choice between sewing or coding, I know which will win!

    Looking forward to more hand holding in future!

    Reply
  4. fiordaliso June 27, 2013

    Thank you, it works! I’m so glad, I have just find you, I read your blog all day long and helped me a lot!

    Reply
  5. Adam July 11, 2013

    Thank you!

    Reply
  6. Lorna White August 8, 2013

    Thank you so much πŸ™‚ I’ve just tried this on my blog and it works perfectly. Lorna.
    http://craftywhiterobins.blogspot.co.uk/

    Reply
  7. Anonymous August 26, 2013

    Worked, thanks.

    Reply
  8. Krista August 29, 2013

    You’re a life saver — thanks!!

    Reply
  9. feruz September 23, 2013

    Thanks! simple and useful trick!

    Reply
  10. Dominika Tracy October 2, 2013

    Great advice, thanks! Love the screen shots, very helpful

    Reply
  11. hanhabelle October 7, 2013

    thank you miss p, just what I wanted!

    http://hanhabelle.blogspot.co.uk/

    Reply
  12. Joe Jessop October 9, 2013

    helpful. thanks!

    Reply
  13. Anonymous October 13, 2013

    HATS OFF I APPRECIATE UR HELP THNXXXXXXXXX KEEP IT UP

    Reply
  14. Winter Ventura October 17, 2013

    This post saved my bacon! It was the first post on the subject that I could find, where the author actually hosted their own site on blogger. Thanks for the great post with easy to follow instructions!

    Reply
  15. Michael B. Burton October 19, 2013

    Thanks so much! I was going crazy trying to change my settings until I found your help. People like you are why the internet is awesome.

    Reply
  16. Prathamesh Tawde October 20, 2013

    thanks a lot…..was searching this for last 3 days

    Reply
  17. Chris November 18, 2013

    AWESOME! thank you so much!
    πŸ™‚ Chris

    Reply
  18. Jill and Trev November 19, 2013

    I have been looking everywhere for this! Thanks for making it SOO easy!!

    Reply
  19. Gaurav Sharma December 8, 2013

    Thank You Portio..

    Reply
  20. nerdyviews December 16, 2013

    Works great, thanks!

    Reply
  21. Illona Meyer January 7, 2014

    Just wanted to drop a little thank you for this!

    I’ve been searching high and low for how to open only external links in a new tab (I could only get it to open ALL links in a new tab, very annoying!).

    This works perfectly, you’re a star!

    Reply
  22. MarlaJan January 10, 2014

    Thank you so much for this! I am HTML challenged, and I’m so happy I managed to do this without any coffee on this yucky Friday morning! Thanks <3

    Reply
  23. Sally Nurney January 29, 2014

    Well, I’ve been trying to sort this for a few days! Because I am using the Blogger> Pages > New Page > Web Address I just couldn’t find the right code to do this.
    Generally, I’m a Great Googlist and it took some time to land upon the right inquiry… and not only does it work now, I got the hack from a super cool fabric chick! Thanks SO much.

    And if you like, take a peek: http://www.PCAchalice.com (the FREE intro link is the one I was challenged by.) My other blog http://www.SallyNurney.com ~ weird to say (?) but this one might show the “connect” I feel with you, one creatrix to another!

    Thanks again!

    Reply
  24. Eunice February 9, 2014

    Thank you so much for this useful piece of code! Previously, every click opened a new tab and it drove me batty. Now I am not afraid to click links on my own blog πŸ˜‰

    Cheers!

    Reply
  25. Gemma-Louise February 14, 2014

    Thanks for this! Have been searching how to do this on the net for a little while and came across your very helpful and easy to do post, so thanks! Mine’s all working how I want it to now :).

    Gem x
    gemsi2011.blogspot.com
    @GemsGemz86

    Reply
  26. Kotie van Staden February 15, 2014

    Thank you so much for sharing this – I would not be able to figure this out on my own. Love your blog!

    Reply
  27. christopher112 February 20, 2014

    Hi Portia,

    I don’t even know you or what you generally blog about. I just started my own just for fun, and just to see if I could do it.

    I spent some time online looking for a way to make external links open in a new tab. I found one that was so way over the top technically difficult, I almost gave up. But your solution is perfect! Took all of about 14 seconds to do, and it did the trick.

    Thank you!

    Reply
  28. healthylifepassion February 21, 2014

    Thank you so much for this awesome tip! I was looking around to find how to make this external link works, but your explanations were the best! Thanks a lot πŸ™‚

    Reply
  29. Nathalie Alexandra February 27, 2014

    thank you so much !!

    http://livelifeamour.blogspot.com

    Reply
  30. Payal March 7, 2014

    Thank you so much it was so helpful! I did it yaaaay! πŸ™‚

    Reply
  31. Alia Tahvildaran March 16, 2014

    Thanks! I was looking for a simple way to keep viewers on my page while still being able to share external content with them. I backed up my template just in case but it worked perfectly!

    http://www.saythingswithcolor.com/

    Reply
  32. kostas tsakalidis March 21, 2014

    I love your solution. I am a web designer – web developer and still i had a problem solving it. Then i saw this and the moment i started looking at your approce i felt “it could have a potential over the way it lookes at the problem but using java to solve this? Damn its only some _blank problem..” on the other side one shouldnt mess with the core engine generating the menu much cause its all too stupidly universal in there. As if it would hurt them to add a small dropdown asking where the link should go when u make a link.

    Anyway. So i used ur solution. And its a great solution for blogger. After all its free and its their decision what they will input to the cms.

    Just.. blogger team.. get your shit together guys. All other cms have a little dropdown saying “Link target: … ” why not you?

    Reply
  33. Tidebrook April 12, 2014

    Worked perfectly for me thanks

    Reply
  34. kamal hakmi April 29, 2014

    Nice Work…..Good
    Thank you

    Reply
  35. Andrea Lekic May 2, 2014

    So glad I came across this! I am new to blogging so this post was very helpful…thank you!

    Reply
  36. Bujang Ganteng May 13, 2014

    Thank you very much, This is very useful for visitor retention improvement.

    Reply
  37. Valli Pandy May 17, 2014

    Thanks. It’s a perfect tip i’m looking for.

    Reply
  38. Joshua May 25, 2014

    Worked perfectly. You just gained a new reader. Thanks!

    Reply
  39. AISHA AMIRU May 28, 2014

    Hi! thankyou it’s work πŸ™‚

    Reply
  40. Anna Seay June 1, 2014

    Wow, instant success! I usually have trouble editing html, but that was perfect. Thank you!

    http://www.bananagrovedesigns.blogspot.com/

    Reply
  41. Szilvi June 3, 2014

    Works great, thanks!

    Reply
  42. jenny June 4, 2014

    thank you! i know your post was from a year before, but it still works today! πŸ™‚

    Reply
  43. Anita Garnsworthy June 5, 2014

    Thank you – perfect!

    Reply
  44. Professor Storytime June 10, 2014

    A million thanks!

    Reply
  45. Dan June 18, 2014

    Thanks! This worked perfectly for my site.

    dailyautograph.blogspot.com

    Reply
  46. Giovanni Di Siena July 2, 2014

    This works brilliantly! Thanks!

    swim-eat-sleep.blogspot.com

    Reply
  47. dobbino July 28, 2014

    Thanks – worked like a dream!

    Reply
  48. Ashley Calder August 6, 2014

    Thank you so much! This was just what I needed. I tried other codes offered on other websites but I love that yours keeps home/next/etc open in the same window and only launches external links in the sidebar and posts in a new window. Thanks for sharing the code and making it so easy. πŸ™‚

    Reply
  49. Woo hoo! I’ve tried SO many different ways, and yours works the best!!!!! I still have a link or two that’s opening in the same tab, I don’t know why. But MOST are opening the way they’re supposed to – YAY!!!!! THANK YOU!

    Reply
  50. Pretty in Pink August 9, 2014

    thank you so much!!!! i have been wondering how to do this FOR YEARS!

    Reply
  51. Patiencetfa August 15, 2014

    Thank you It worked on my blog. It’s easier for external links to be opened in a new window so that my readers can just come back my blog in one click without using the back button and then they will have to wait for the page to reload all over again.
    Note: external links are necessary but are also a distraction.

    Reply
  52. Harry Caper October 13, 2014

    Many thanks – works perfectly!

    Reply
  53. vinay kumar October 16, 2014

    Thanks…worked as i want

    Reply
  54. the Last Wizzard November 1, 2014

    thank you so much it worked as I want

    Reply
  55. Nick Lincoln November 30, 2014

    Thanks Portia, that works brilliantly. Can’t really understand why Blogger does not simply have a check box on the “Add External URL” window saying “Open In New Window?”

    Love Blogger BTW; so much easier than WP. And looks as good. So many WP sites look washed out and somehow insipid.

    Anyway, thanks again.

    Reply
    • Portia Lawrie November 30, 2014

      Hi Nick! To be fair, I think Blogger have recently added this checkbox as an option when composing individual posts (this post was written about 18months ago), but not as a default option to apply to each post/link automatically. By using this method you don’t have to check that box every time you add a link as your blog will now do it for you automatically. Which is still better methinks!
      Px

      Reply
  56. Becky @re:style December 12, 2014

    Another satisfied customer here! Thanks so much for this tip, really easy instructions to follow and worked perfectly.

    Becky x

    Reply
  57. Ɛùα ⚘ December 28, 2014

    I’ve been looking for this for months!!! Thank you so so so much! Hugs and greetings and my best wishes for a Happy New Year, from Greece!
    Eva ~ .•*¨`*•✿.Jajala Majala.✿•*¨`*•.

    Reply
  58. Kreete December 12, 2015

    Hello! Where has the code snippet gone? Would be great if someone could send it to me here in comments! Thanks!!

    Reply
    • Portia Lawrie January 11, 2016

      Hi there! Apologies for the delay! Took me ages to find the original snippet and images in my files! Anyway….post is updated to include the snippet now. Hope it helps! Px

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *