A no-plugin HOWTO
|
Bookmark to:
                          |
(0)
You probably know that there is a plugin which makes external links open in new window. If it doesn't work for you or you don't want to add yet one more plugin to your Seditio, I can help with no-plugin version of ExtLinks. The only requirement for your visitors is JavaScript >= 1.2 enabled.
All you need is edit your skins/Your_Skin/header.tpl. Add the following script to the <head> section of the templates's HTML:
Then there are 2 ways to enable it:
1. Add it to your onLoad attribute of <body> tag, just like:
2. Or you may add the following code to the script:
Sometimes the above solution doesn't work properly with hover images and some jQuery code. If you use jQuery, I can offer you another solution:
All you need is edit your skins/Your_Skin/header.tpl. Add the following script to the <head> section of the templates's HTML:
JAVASCRIPT Code:
<script language="javascript" type="text/javascript">
// Open external links in new window
function extLinks2() {
var extl = document.getElementsByTagName('a');
var re = new RegExp('^http://' + location.host, 'i');
for(var i = 0; i < extl.length; i++) {
if(extl[i].href.match('http://') && !re.test(extl[i].href)) {
extl[i].target = '_blank';
extl[i].className += ' external';
}
}
}
</script>
// Open external links in new window
function extLinks2() {
var extl = document.getElementsByTagName('a');
var re = new RegExp('^http://' + location.host, 'i');
for(var i = 0; i < extl.length; i++) {
if(extl[i].href.match('http://') && !re.test(extl[i].href)) {
extl[i].target = '_blank';
extl[i].className += ' external';
}
}
}
</script>
Then there are 2 ways to enable it:
1. Add it to your onLoad attribute of <body> tag, just like:
HTML4STRICT Code:
<body onLoad="extLinks2()">
or if you already have onLoad handlers HTML4STRICT Code:
<body onLoad="myLoadFunction(); extLinks2();">
2. Or you may add the following code to the script:
JAVASCRIPT Code:
var oldonload = window.onload;
window.onload = function() {
oldonload();
extLinks2();
}
window.onload = function() {
oldonload();
extLinks2();
}
Sometimes the above solution doesn't work properly with hover images and some jQuery code. If you use jQuery, I can offer you another solution:
JAVASCRIPT Code:
<script language="javascript" type="text/javascript">
$(document).ready( function() {
var extl = document.getElementsByTagName('a');
var re = new RegExp('^http://' + location.host, 'i');
for(var i = 0; i < extl.length; i++) {
if(extl[i].href.match('http://') && !re.test(extl[i].href)) {
extl[i].target = '_blank';
extl[i].className += ' external';
}
}
} );
</script>
$(document).ready( function() {
var extl = document.getElementsByTagName('a');
var re = new RegExp('^http://' + location.host, 'i');
for(var i = 0; i < extl.length; i++) {
if(extl[i].href.match('http://') && !re.test(extl[i].href)) {
extl[i].target = '_blank';
extl[i].className += ' external';
}
}
} );
</script>