Ebene beim Seitenaufruf für eine bestimmte Zeit einblenden, geht das?

BeRo schrieb am 21.12.2015 um 21:35 Uhr

Aber ja! (Demo)

Die Demo habe ich vor ca. 2 Jahren zu einem anderen Thema angelegt. Der für Dich interessante Teil ist die Einblendung eines Copyright Vermerks, der nach 5 Sekunden erscheint. Nach weiteren 10 Sekunden wird er automatisch wieder ausgeblendet.

Wenn Du das auf Deiner Site umsetzen willst, benötigst Du 2 kleine Scriptlets:

Für den HTML Head der Seite die eigentliche JS Funktion "Timer()":

<script type="text/javascript">
function Timer(){
{setTimeout("xr_cpu(5)", 5000);}
{setTimeout("xr_ppc('xr_xp5')", 15000);}
}
</script>
Und für den HTML Body der Seite den Funktionsaufruf, der dafür sorgt, dass die Funktion schon beim Öffnen der Seite ausgeführt wird:

<script type="text/javascript">
window.onload=(Timer());
</script>

Die Funktion blendet 5 Sekunden (5000 mS) nach dem Öffnen der Seite die (popup) Ebene 5 ein. Dafür sorgt die WD interne Funktion "xr_cpu(5)", die mit dem Funktionsaufruf gestartet wird.
15 Sekunden (15000 mS) nach dem Öffnen der Seite wird die eingeblendete popup Ebene wieder ausgeblendet. Dafür sorgt die WD interne Funktion "xr_ppc('xr_xp5')".

Die oben gelb markierte Nummer 5 (Index Wert) der popup Ebene kann in Deinem Fall eine andere sein. Der für Dein Projekt geltende Wert ist abhängig von der Position der popup Ebene in der Seiten- & Ebenen-Galerie.

Der Wert kann relativ einfach herausgefunden werden, wenn Du einen temporären Link auf die popup Ebene anlegst. Positionierst Du anschließend in der Vorschau den Mauszeiger auf diesen Link, siehst Du in der Fußzeile des Browserfensters den JS Link, mit dem korrekten Indexwert der popup Ebene, z. B. "javascript:xr_cpu(4)"

In dem Fall ist der Indexwert der popup Ebene also "4"

That's all

Viel Erfolg

Taggoo schrieb am 22.12.2015 um 08:20 Uhr

Vielen Dank für die schnelle Antwort, das funktioniert soweit erstmal ganz super. So habe ich es mir vorgestellt. Jedoch wäre es auch gut wenn der Besucher diese Ebene selbst (nachdem er deren Inhalt gelesen hat) über einen "Schließen"-Button entfernen könnte. Das müßte doch machbar sein, ich weiß nur nicht wie...

Vielen Dank im Voraus!

BeRo schrieb am 22.12.2015 um 11:09 Uhr

[...] Jedoch wäre es auch gut wenn der Besucher diese Ebene selbst (nachdem er deren Inhalt gelesen hat) über einen "Schließen"-Button entfernen könnte. [...]

Auch das ist problemlos machbar.
Wenn Du die u. a. Zeile aus der Funktion entfernst, unterbleibt das automatische ausblenden der popup Ebene:

{setTimeout("xr_ppc('xr_xp5')", 15000);}

Zusätzlich änderst Du die Eigenschaften der popup Ebene wie im Screenshot gezeigt:

Dann wird beim Einblenden der popup Ebene zugleich oben rechts ein "schließen" Icon (Kreuz im Kreis) eingeblendet. Die popup Ebene kann nur ausgeblendet werden, wenn dieses Icon geklickt wird.

Abhängig davon, was Du mit der eingeblendeten Ebene anzeigen willst, könnte Dir eine Lösung besser gefallen, die ich hier im Zusammenhang mit einer Info zu Tracker Cookies gepostet habe (klick).

In dem Thread habe ich 2 verschiedene Wege beschrieben, die aber letztlich vergleichbar sind. Die 1. Lösung benötigt einen PHP fähigen Webserver, die 2. kommt alleine mit JScript aus...

Schau's Dir mal an.

Viel Erfolg

Taggoo schrieb am 22.12.2015 um 20:54 Uhr

Das hat super geklappt (www.friseur-charmant-olbernhau.de)! Vielen Dank und frohe Weihnachten!

MarijanSascha-Sekardi schrieb am 15.03.2021 um 11:43 Uhr

Guten Morgen BeRo,...dieser Tipp ist klasse,...wie kann ich das mit einer mobilen Seite umsetzen, müssen da wieder die Scripte einzeln benannt werden, damit nix durcheinander kommt ? Wie benennt man diese, damit die Mobile-Seite nicht auf die Desktop-Seite reinwirkt (bei mir fliegen ständig die ebenen durcheinander) ....

BeRo schrieb am 15.03.2021 um 19:24 Uhr

@MarijanSascha-Sekardi

[...] wie kann ich das mit einer mobilen Seite umsetzen [...]

Das ist relativ einfach (wenn man weiß wie's geht) 😍
Schau Dir mal die online Demo an, die ich vor ein paar Jahren für einen User im niederländischen Forum gemacht habe (klick)

Da habe ich in einem einzigen JScript dafür gesorgt, dass eine bestimmte popup Ebene (Urlaubsinfo) nach 2 Sekunden eingeblendet wird und nach 10 weiteren Sekunden automatisch wieder ausgeblendet wird.
Zusätzlich wird in dem Script noch eine Sitzungsvariable "counter" gesetzt, die ausgewertet wird und dafür sorgt, dass die popup Info nur 1x je Sitzung angezeigt wird. Erst wenn die Seite geschlossen-, und danach neu geöffnet wird, wird auch die Info wieder (1x) eingeblendet.

So sieht das Script aus:

<script> 
function info() { 
var count=window.sessionStorage.getItem('counter');  //Waarde van de sessievariabele opvragen
if (!count=='1') {setTimeout("xr_cpu(4)", 2000);  //open popup laag (4) na x1 milliseconden 
setTimeout("xr_cpu(11)", 2000);  //open popup laag (11[mobil]) na x1 milliseconden
window.sessionStorage.setItem('counter','1');  //Waarde van de sessievariabele instellen
setTimeout("xr_ppc('xr_xp4')", 12000); //close popup laag (4) na x-x1 milliseconden
setTimeout("xr_ppc('xr_xp11')", 12000); //close popup laag (11[mobil]) na x-x1 milliseconden
}} 
</script>

Zusätzlich muss im HTML Body der Seite, die die Info zeigen soll, noch eine HTML Anweisung stehen, mit der das o. a. JScript gestartet wird, wenn die Seite geladen wird.

<body onload = info()>

Mehr ist nicht zu tun. 😊

Wie Du schon in der letzten "Lektion" gelernt hast, sind die ID Werte der popup Ebenen (Desktop, mobil) nicht fix. Sie sind abhängig von der Position der popup Ebene und sie weichen in der mobilen Variante oft deutlich vom geschätzten Wert ab.

Damit der WD überhaupt eine ID vergeben kann, muss in jeder Variante zunächst ein Dummy Button mit einem Link auf die popup Ebene angelegt werden.

Welcher ID-Wert korrekt ist, das sieht man am besten, wenn der Dummy Button zum Test in den sichtbaren Seitenbereich verschoben wird. Wird die Seite dann im Browser angezeigt und der Mauszeiger auf den Button platziert, wird links in der Fußzeile der ID Wert angezeigt...

In der Demo ist das für die Smartphone Variante also der Wert "11", den wir so auch im JScript für die Demo sehen.

Die Projektdatei, die alle Scriptlets enthält, kannst Du hier herunterladen (klick)

MarijanSascha-Sekardi schrieb am 16.03.2021 um 00:00 Uhr

Sehr charmant ,...herzlichen Dank, mit dem Gelernten der letzten Lektionen war das fix angepasst,...hatte mich ja erst mit der Funktion Timer ganz oben bemüht....so ist das doch einfach nur schön, man könnte das also auch um weitere einzublendende Ebenen simple erweitern, oder ?
....mal wieder Danke ! Das Programm WD gefällt mir immer mehr ....
Herzliche Grüße

BeRo schrieb am 16.03.2021 um 00:26 Uhr

@MarijanSascha-Sekardi

[...] man könnte das also auch um weitere einzublendende Ebenen simple erweitern [...]

Kein Problem. Du musst dann nur für jede neue Ebene auch einen weiteren Dummy Button mit Link auf die jeweils neue Ebene anlegen.
Die Timer Funktion zum Öffnen muss für jede neue Ebene neu angelegt werden, mit der ID der neuen Ebene:

setTimeout("xr_cpu(ID der Ebene)", Verzögerung in Millisekunden);

Die ebenfalls zusätzlich anzulegende Timer Funktion zum Schließen muss natürlich mit der Öffnen Funktion korrespondieren...

setTimeout("xr_ppc('xr_xpID der Ebene')", Verzögerung in Millisekunden);

Weil alle Timer, die zum Öffnen und die zum Schließen, zur selben Zeit starten, muss die hier einzutragende Zeit in Millisekunden, der Summe der Verzögerung bis zum Start + der Anzeigezeit entsprechen. Soll also z. B. die Ebene 2 Sekunden nach dem Öffnen der Seite angezeigt werden und 5 Sekunden später wieder geschlossen werden, muss hier 7000 mS eingetragen werden.

Edit: 16.03. - 14:23h
Ich sehe, dass Du das JScript schon auf Deiner Site einsetzt.
Damit das nicht nur mit der mobilen Variante funktioniert, sondern auch mit der Desktop Variante, musst Du nur den ID Wert zum Öffnen/Schließen der popup Ebene korrigieren.
So sollte das aussehen:

<script>
function info() {
var count=window.sessionStorage.getItem('counter');  //Wert der Sitzungsvariable abfragen
if (!count=='1') {setTimeout("xr_cpu(5)", 3000);  //Popup-Ebene (5) nach x1 Millisekunden öffnen
setTimeout("xr_cpu(15)", 2000);  //Popup-Ebene (15 [mobil]) nach x1 Millisekunden öffnen
window.sessionStorage.setItem('counter','1');  //Wert der Sitzungsvariable anlegen
setTimeout("xr_ppc('xr_xp5')", 10000); //Popup-Ebene (5) nach x-x1 Millisekunden schließen
setTimeout("xr_ppc('xr_xp15')", 9000); //Popup-Ebene (15 [mobil]) nach x-x1 Millisekunden schließen
}}
</script>

Dann klappt's auch mit der Desktop Version 😀

MarijanSascha-Sekardi schrieb am 16.03.2021 um 16:57 Uhr

Hi hallo, da scheine ich mich mit der Ebene heute Nacht verguckt haben....ich bin meistens bis 4-5Uhr morgens dran ;-)
okay, habe ich geändert und hochgeladen, das funzt nun,...TOP!
FRAGE: Wenn ich möchte, dass das 2-3 mal pro Sitzung angezeigt wird, dann müsste ich doch "nur" den Wert 1 bei Counter in 3 ändern, oder ?

BeRo schrieb am 16.03.2021 um 19:36 Uhr

@MarijanSascha-Sekardi

[...] Wenn ich möchte, dass das 2-3 mal pro Sitzung angezeigt wird [...]

Dann darf die Abfrage des Werts der Variable "count" nicht verändert werden, sonst funktioniert die Sperre der ungewollten popup Wiederholung nicht mehr.
Die mehrfache (endlose) Wiederholung der Info Anzeige in einem zeitlich definierten Intervall kann mit ein paar Zeilen JScript eingestellt werden, die dem vorhandenen JScript angehängt werden..
So sieht der Zusatz aus:

setInterval(function() {
    var count=window.sessionStorage.getItem('counter');  //Wert der Sitzungsvariablen abfragen
    if (count=='1') {  // wenn popup Ebene geschlossen ist...
    window.sessionStorage.setItem('counter','')}; //Sitzungsvariable zurücksetzen
    info()}, 20000); // alle xx Millisekunden Popup-Ebene öffnen

Damit wird (zum Test) alle 20 Sekunden (20.000 mS) die Info aus der popup Ebene eingeblendet.
Die Pausenzeit wirst Du in echt natürlich deutlich länger einstellen... 😉

So sieht das komplette, erweiterte JScript aus:

<script>
function info() {
var count=window.sessionStorage.getItem('counter');  //Wert der Sitzungsvariablen abfragen
if (!count=='1') {
setTimeout("xr_cpu(5)", 10);  //Popup-Ebene (5) nach x1 Millisekunden öffnen
setTimeout("xr_cpu(15)", 10);  //Popup-Ebene (15 [mobil]) nach x1 Millisekunden öffnen
window.sessionStorage.setItem('counter','1');  //Wert der Sitzungsvariablen festlegen
setTimeout("xr_ppc('xr_xp5')", 10000); //Popup-Ebene (5) nach x-x1 Millisekunden schließen
setTimeout("xr_ppc('xr_xp15')", 10000); //Popup-Ebene (15) nach x-x1 Millisekunden schließen
}}
setInterval(function() {  //Popup-Ebene in Intervallen öffnen
    var count=window.sessionStorage.getItem('counter');  //Wert der Sitzungsvariablen abfragen
    if (count=='1') {  // wenn popup Ebene geschlossen ist...
    window.sessionStorage.setItem('counter','')};  //Sitzungsvariable zurücksetzen und...
    info(); }, 20000); // alle xx Millisekunden Popup-Ebene öffnen
</script>

Wenn Du nicht möchtest, dass die popup Info endlos wiederkehrend angezeigt wird, dann muss das JScript um einen weiteren Zähler erweitert werden, der z. B. nach 5 Durchläufen die weitere Anzeige der Info sperrt.
Ob das aber nötig ist?
Die übliche Verweildauer auf Websites liegt (statistisch) bei ca. 40 Sekunden. Eine informative, textlastige Site dürfte es auf einige Minuten bringen. Setzt Du für Deine Site z. B. 5 Minuten Lesezeit an dann kannst Du die popup Info alle 2-3 Minuten anzeigen lassen, bevor der Besucher die Site verlässt.
Gehst Du von der Zeitplanung aus, ist die Begrenzung der Anzeigehäufigkeit nicht nötig...

Edit: 21:47h
Wenn Du das o. a. Script einsetzt, kannst Du die HTML Zeile "<body onload = info()>", die Du im HTMLBody der Seite angelegt hast, löschen.
Die automatische Einblendung der popup Ebne wird jetzt vom Intervalltimer übernommen, der (in der Demo) nach 20 Sekunden aktiv wird.
Die Timer in der Funktion info() sind daher ebenfalls zurückgesetzt worden, auf aktuell 10 Millisekunden, weil auch hier der Intervalltimer die Pausen bis zur Anzeige bestimmt...

MarijanSascha-Sekardi schrieb am 16.03.2021 um 22:21 Uhr

SauStark !! Setze ich um, wenn ich Google Ads erneut gebändigt habe ;-)

EINE FRAGE dazu noch...

ich versuche das bisherige Script auch auf der Schnellinfoseite und der Kontaktseite zu platzieren, weil auf beide auch direkt aus Suchen gesprungen wird...das funktioniert jedoch nicht....geht das Script nur auf der Indexseite?

Danke schon mal....wieder mal 😘

BeRo schrieb am 17.03.2021 um 01:11 Uhr

@MarijanSascha-Sekardi

[...] geht das Script nur auf der Indexseite? [...]

Nein, glücklicherweise kannst Du das parallel auf beliebig vielen Seiten einsetzen. 😊
Du musst nur für jede Seite einen eigenen Timer-, mit eigener ID definieren. Dazu erstellst Du, wie weiter oben schon gesagt, auf jeder Seite (Desktop und mobil) einen Dummy Button mit Link auf die popup Ebene und liest mit der bekannten Methode die ID Werte der jeweiligen popup Ebene ab.

Hier mal ein Beispielcode der benutzt werden kann, wenn die popup Info auf 2 unterschiedlichen Seiten zu sehen sein soll.
Der Scriptcode muss in dem Fall im HTML Head der Website untergebracht werden, nicht auf der Seite!

<script>
setTimeout("info()", 5000);  //popup-Info beim Start nach xxx Millisekunden anzeigen
var mS2=35000;  //mS 1. Vorgabewert für Intervalltimer
function info() {
var count=window.sessionStorage.getItem('counter');  //Wert der Sitzungsvariable abfragen
var mS1=10000;  //mS Vorgabewert für popup-Info Anzeigedauer
var mS2=20000;  //mS Standard Vorgabewert für Intervalltimer
if (!count=='1') {
setTimeout("xr_cpu(4)", 10);  //Popup-Ebene (4) nach x1 Millisekunden öffnen
setTimeout("xr_cpu(11)", 10);  //Popup-Ebene (11 [mobil]) nach x1 Millisekunden öffnen
setTimeout("xr_cpu(42)", 10);  //Popup-Ebene (42) nach x1 Millisekunden öffnen
setTimeout("xr_cpu(49)", 10);  //Popup-Ebene (49 [mobil]) nach x1 Millisekunden öffnen
window.sessionStorage.setItem('counter','1');  //Wert der Sitzungsvariable festlegen
setTimeout("xr_ppc('xr_xp4')", mS1); //Popup-Ebene (4) nach x-x1 Millisekunden schließen
setTimeout("xr_ppc('xr_xp11')", mS1); //Popup-Ebene (11) nach x-x1 Millisekunden schließen
setTimeout("xr_ppc('xr_xp42')", mS1); //Popup-Ebene (42) nach x-x1 Millisekunden schließen
setTimeout("xr_ppc('xr_xp49')", mS1); //Popup-Ebene (49) nach x-x1 Millisekunden schließen
}}
setInterval(function() {  //Popup-Info in Intervallen öffnen
    var count=window.sessionStorage.getItem('counter');  //Wert der Sitzungsvariable abfragen
    if (count=='1') {  // wenn popup Info ausgeblendet ist...
    window.sessionStorage.setItem('counter','')};  //Sitzungsvariable zurücksetzen und...
    info(); }, mS2); // Popup-Info anzeigen im xx Millisekunden Intervall
</script>

Du siehst, dass die popup Ebenen auf den neuen Seiten völlig andere ID Werte haben (hier 42 und 49).
Das JScript ist insgesamt etwas komplexer geworden. Den weggefallenen Funktionsaufruf
"<body onload = info()>"
der bisher im HTML Body der Seite stand, habe ich ersetzt durch
"setTimeout("info()", 5000);"
im Kopf des JScripts. Damit wird die popup Info beim Seitenstart nach 5 Sekunden eingeblendet. Der Intervalltimer übernimmt dann alle weiteren Einblendungen, die in der Demo alle 20 Sekunden zu sehen sind.
Die (Millisekunden) Zeitangaben stehen jetzt überwiegend in Variablen (mS1, mS2). das macht die Timer Anpassungen einfacher.

Eine aktualisierte online Demo dazu kannst Du hier finden (klick)

Die dazu gehörende Projektdatei, inkl. aller Scriptlets, kannst Du hier herunterladen (klick)

MarijanSascha-Sekardi schrieb am 18.03.2021 um 03:23 Uhr

Schön schön, auch ein Nachtvogel :-D
Ich bin sprachlos für diese ganz Hilfe und kann nur noch ganz leise sagen "Danke schön" ....genauso werde ich es einsetzen 😘 ....wenn ich ne Adresse hätte, würde ich ne Kleinigkeit hier aus dem Allgäu kredenzen ;-)