Oft wünschen Shopbetreiber das sich externe Links auf andere Onlineangebote in einem neuen Fenster oder Tab öffnen.

• 1. Damit der Besucher weiter auf der eigenen Seite bleibt im Sinne der Zugriffsstatistik des Magento-Shops.
• 2. Um dem Besucher die Möglichkeit zu bieten nach Besuch des Links schnell wieder zurück zum eigenen Shop / der eigenen Seite zu gelangen.

Das probateste Mittel an dieser Stelle ist den Linkaufbau wie folgt zu gestalten:

<a href="http://www.wikipedia.de/" alt="Wikipedia" title="Wikipedia" target="_blank">Wikipedia</a>

Diese und andere Anweisungen die das Ziel eines Links beschreiben stammen aus vergangenen Webepochen & dienten meist der Art und Weise wie Links innerhalb von Frameset basierten Seiten öffnen sollten und bei dieser Anwendung musste man teilweise wirklich unterscheiden und daher hatten diese Anweisungen damals auch tatsächlich eine Daseiensberechtigung.

Framesets waren damals das Mittel der Wahl da man eine Webseite in Bereiche aufteilen konnte (Kopfbereich, Inhalt usw.) – aufgrund damaliger Internetzugänge konnten somit Frameset basierte Onlineshops schon damals recht schnell ausgeführt werden da lediglich Bereiche und nicht ganze Seiten nachgeladen werden mussten.

---

Heute jedoch sind diese Anweisungen teilweise unnötig da zum einen mittlerweile Bandbreiten verfügbar sind um Webseiten und Shops auch ohne Framesets schnell beim Besucher anzuzeigen und zum anderen die Browser auf diese Targetanweisungen sehr untersschiedlich reagieren.

Zwar verfügen nahezu alle neueren Browserversionen über die sogenannte Tab-Unterstützung die es ermöglicht mehrere Seiten innerhalb von einer Browsersitzung auszuführen, jedoch sind die Voreinstellungen direkt nach der Installation sehr unterschiedlich.

• Mozilla Firefox, Google Chrome & Opera – öffnen in einem neuen Tab
• Internet Explorer und Safari – öffnen nach wie vor in einem neuen Browserfenster

Nichts desto trotz bestehen die Gründe warum ein Seitenbetreiber wie oben bestehen wollen das externe Links in einem neuen Tab / Fenster öffnen sollen.

In Magento wird aktuell die HTML-Spezifikation (X)HTML 1.0 Strict verwendet, in der die Zielanweisung target nicht existiert, um den HTML-Code selbst auch nach W3C Standard sauber zu halten werden wir nachfolgend target blank ermöglichen ohne die strengen Regeln dieses HTML-Standards zu verletzen.

Wir werden per JavaScript auf das sogenannte onclick Event zugreifen, also dem Status einer Seite wenn man auf einen Link klickt. Genau diesen Status hat der Magento-Shop oder die Seite nicht wenn sie einfach nur aufgerufen wird, auch nicht wenn der strenge W3C Validator die Seite auf semantisch perfekt organisierten Code untersucht.

---

Wir erstellen eine Datei mit freier Namenswahl im Beispiel “targetblank.js” & füllen diese mit folgenem Inhalt:

var ownurlpatt = /golox-web\.de/;  // gegen Ihre eigene URL ersetzen!

function addEvent(obj, evType, fn){
  if (obj.addEventListener){
    obj.addEventListener(evType, fn, false);
    return true;
  } else if (obj.attachEvent){
    var r = obj.attachEvent("on"+evType, fn);
    return r;
  } else {
    return false;
  }
}
function getEventTarget(e){
	//by Peter Paul Koch - http://www.quirksmode.org/js/events_compinfo.html#link7
	return (e.target) ? e.target : e.srcElement
}

blankclick = function(e){
	var tg = getEventTarget(e);
	if ( tg.tagName.toLowerCase() == 'a' ) {
		tg.target ='_blank';
	} else if ( tg.parentNode.tagName.toLowerCase() == 'a' ) {
		tg.parentNode.target ='_blank';
	}
	return true;
}

onPageLoad = function(){
	var doclinks = document.getElementsByTagName("a");
	for (var i = 0; i < doclinks.length; i++) {
	//alert(doclinks[i].href);
		if ( doclinks[i].rel == 'noblank' ) {
			;
		}
		else if ( ! doclinks[i].href.match(ownurlpatt) && ! doclinks[i].href.match(/^(mailto|javascript):/) ) {
		  if ( doclinks[i].attributes['title'] ) {
		  	doclinks[i].attributes['title'].value =  "external link - new window: " + doclinks[i].attributes['title'].value;
		  }
		  addEvent(doclinks[i], "click", blankclick);
		}
	}
}

window.onload = onPageLoad;

Bitte tragen Sie oben noch Ihre eigene URL ein damit alle Links die von Ihrer eigenen URL stammen ganz normal geöffnet werden.

Alternativ können Sie sich auch das Original Skript herunterladen + weiteren Infos dazu:
http://elmar-eigner.de/xhtml-valid-target-_blank-im-link.html

---

Integration in eine normale Webseite:

<script type="text/javascript" src="targetblank.js"></script>

(Script liegt im gleichen Verzeichnis wie die Seite)

Integration in einen WordPress Blog wie auf dieser Seite:

<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/targetblank.js"></script>

(Script liegt im Themeordner)

Integration in ein Magento-Design:
Zunächst platziert man das Script unter skin/frontend/default/ihrtheme/js/targetblank.js
dann muss die datei noch über app/design/frontend/default/ihrtheme/layout/page.xml eingebunden werden.

<action method="addItem"><type>skin_js</type><name>js/targetblank.js</name></action>

Alternativ können Sie diese Datei aber auch per Mxperts jQuery Base integrieren.

Viel Spaß mit dem Script!

Liebe Grüße – Daniel