How to Force External Links to Open in a New Window

Post date: Jul 10, 2014 12:13:50 AM

How to Stop Losing Your Community Visitors

Sending all of your SEO link juice to another site can hurt your search engine ranking. This is why it is important for external links (those links inside your site which go to an entirely different website instead of linking to another page on your site) to open in another window, rather than take visitors away from your site. Back in 2011, I made a post on Ning Creators showing how to force external links on your Ning Network to open in a new tab or window. That method still works very well for Ning 2.0 Networks, but with Ning 3.0, we have more options and thus, a better solution is available.

Open Links in New Window Ning 2.0

Add this to your custom Code box (if you're Ning Plus or Ning Pro)

jQuery(document).ready(function(){

jQuery("a[href*='http://']:not([href*='http://yourdomain.com'])").attr("target","_blank");

jQuery("a[href*='https://']:not([href*='https://yourdomain.com'])").attr("target","_blank");

});

</script>

Don't forget to change yourdomain.com with YOURDOMAIN.COM

Open External Links New Window Ning 3.0

The jquery code i use now for Ning 3.0 templates is this:

x$('a').each(function() {

var a = new RegExp('/' + [removed].host + '/');

if(!a.test(this.href)) {

x$(this).click(function(event) {

event.preventDefault();

event.stopPropagation();

window.open(this.href, '_blank');

});

}

});

</script>

Place that code inside the bottom section of your Custom Code page

Try it out by clicking the link inside the Credits section of this page

Note About Using Jquery with Ning Sites

If you've been looking through Jquery Code Snippets around the web, you may be wondering why they do not work right out of the box on your Ning Site. This is because Ning has Jquery natively installed and you'll need to make a slight adjustment to any Jquery code you choose to add to your Ning. In simple terms, you'll simply want to add an 'x' in front of any '$'.

Shout out to TJ of Jqueryhelp.Ning.com who had taught me a lot over the years. Check out his uberhelpful list of Jquery Codes and Mods for Ning 2.0 to begin playing around with code for your Ning Network. His Beginners Guide to Jquery is a definite place to start for Jquery Noobies.