Banner-Rotation erstellen (Iframe)



Voraussetzungen



* Bannerverwaltung

Das folgende Beispiel zeigt Ihnen, wie Sie eine Banner-Rotation erstellen.

Dabei wird der Banner nicht direkt in die eigentlichen webEdition-Seite eingebunden, sondern über einen zusätzlichen Iframe (''<iframe>''). Dieser Iframe muss exakt die selbe größe wie die Banner haben. In diesen Iframe wird eine webEdition-Seite geladen, auf der ein Banner eingebunden ist. Diese webEdition-Seite läd sich selbst alle zwei Sekunden mit Hilfe des META-Refresh Tags (''<meta http-equiv="refresh"/>'') neu. Sind für den angegebenen Bannerplatz mehrere Banner definiert, wird bei jedem Laden der webEdition-Seite per Zufall ein anderer Banner ausgewählt und angezeigt.

<note important>Es dürfen nur Banner gleicher Größe für den angegebenen Bannerplatz definiert sein.</note>

Demo



* [[http://documentation-we.webedition.de/200808070754181338/index.html|Online-Demo öffnen]]

Quellcode



<box 100% round blue|index.tmpl - Vorlage für die webEdition-Seite "index.html", in der der zusätzliche iFrame eingebunden wird>
<code html>
<!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<we:title></we:title>
<we:description/>
<we:keywords/>
<we:charset defined="UTF-8">UTF-8</we:charset>
<we:ifNotEditmode>
<style type="text/css">
html {
font-family: arial;
font-size: .8em;
color: #000000;
}

a {
color: #000000;
}
</style>
</we:ifNotEditmode>
</head>
<body>

<!-- Dieser Bereich ist nicht in der Dokumentenansicht Bearbeiten sichtbar. -->
<we:ifNotEditmode>
<iframe src="/200808070754181338/banner.html" width="100" height="600" scrolling="no" frameborder="0"></iframe>
</we:ifNotEditmode>

</body>
</html>
</code>
</box>


<box 100% round blue|banner.tmpl - Vorlage für die webEdition-Seite "banner.html", die über den zusätzlichen Iframe eingebunden wird und die Banner enthält>
<code html>
<!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<we:title></we:title>
<we:description/>
<we:keywords/>
<we:charset defined="UTF-8">UTF-8</we:charset>
<we:ifNotEditmode>
<!-- Seite läd sich alle 2 Sekunden neu -->
<meta http-equiv="refresh" content="2; URL=<we:var type="property" name="Path"/>">
<style type="text/css">
body,
html {
margin: 0;
padding: 0;
}
</style>
</we:ifNotEditmode>
</head>
<body>

<!-- Dieser Bereich ist nicht in der Dokumentenansicht Bearbeiten sichtbar. -->
<we:ifNotEditmode>
<we:banner name="200808070754181338" width="100" height="600" type="cookie" target="_blank" link="true"/>
</we:ifNotEditmode>

</body>
</html>
</code>
</box>

Weiterführende Informationen



* [[http://de.selfhtml.org/html/frames/eingebettete.htm|SELFHTML: Eingebettete Frames]]
* [[http://de.selfhtml.org/html/kopfdaten/meta.htm#laden|SELFHTML: Automatische Weiterleitung zu anderer Adresse (Forwarding)]]
powered by webEdition CMS