Alter WOW Slider Einbau in Mobirise?

[Bushisan]

Hallo zusammen - geht das noch??

Gruß Hubert

[Tommy Herrmann]

Moin Hubi,

also den "WOW-Slider" hat ja nun Mobirise mit an Bord und deswegen braucht man den alten, separaten "WOW-Slider", eigentlich nicht mehr in Mobirise zu verwenden.

Hier meine Beispielseiten:

In Mobirise 5:

https://www.mobirise-tutorials.com/WOW-Slider.html

In Mobirise 4:

https://www.mobirise-tutorials.com/WOW-Slider/

Ich sehe keinen Grund, warum der alte "WOW-Slider" nicht in Mobirise integriert werden könnte. Ich habe es allerdings selbst noch nicht ausprobiert und werde es wahrscheinlich auch nicht tun.

Damals habe ich die externe "Visual Lightbox" in Mobirise 4 getestet, die ebenfalls ein Produkt von Mobirise war, genau wie der alte "WOW-Slider". Der Einbau der "Visual Lightbox" funktioniert ganz ähnlich wie die Integration des externen "WOW-Sliders" - kam ja beides aus dem gleichen Stall, der jetzt "Mobirise" heißt:

https://www.mobirise-tutorials.com/Busi ... htbox.html

Hier noch mein altes Tutorial zum Einbau des "WOW-Slider" in NOF. In Mobirise wird das ganz genauso eingebaut. Wenn Du meinem Tutorial zur externen "Visual Lightbox" (link oben) folgst, kannst Du auch den externen "WOW-Slider" nach meinem NOF-Tutorial einbauen:

http://www.tommyherrmanndesign.com/nof/ ... orial.html

Leider funktionieren nicht alle Animationen und verfügbaren Optionen mehr, und das schon seit Jahren. Es scheint, dass Mobirise das Interesse an diesem Produkt verloren hat und es nicht mehr unterstützt.



Erweiterung "WOW-Slider" in Mobirise:

[Bushisan]

Dankeschön ich probiers einfach mal aus!

Schönen Tach noch!!

[Bushisan]

Hab alles so gemacht wie früher!
Es kommt auch keine Fehlermeldung.
Bleibt aber grundsätzlich beimPublizieren bei etwa 30% stehen und hängt sich auf. Ist aber auch nicht so wichtig.
Hat mich einfach nur interessiert.

Grüße

[Tommy Herrmann]

Moin,

wenn der Prozess während der Publizierung (Generierung) hängen bleibt, könnte das auf ein Problem hinweisen. Eine pauschale Antwort darauf ist schwierig, da man jeden einzelnen Schritt des Einbaus mit dem verwendeten Code betrachten müsste.

Mobirise ist in dieser Hinsicht empfindlich. Ein häufiger Fehler ist beispielsweise, dass `<div>` Container innerhalb von `<p>` Tags platziert werden. Das ist nicht korrekt und führt zu Problemen bei der Generierung.

Zudem werden relative Pfade zu Dateien nicht erkannt, wenn diese Dateien nicht über die Mobirise-Oberfläche eingefügt wurden. Mobirise kennt solche Dateien nicht und kann dadurch in einen Fehlerzustand geraten. Bilder, die nicht über Mobirise-Werkzeuge hinzugefügt werden, sollten daher immer mit absoluten Pfaden, also mit der vollständigen (absoluten) URL zum Bild auf dem Server, angegeben werden. Natürlich muss man dann solche Bilder auch händisch bereits zuvor auf den Server kopiert haben.

Bei meinem Tutorial zur "Visual-Lightbox" kannst Du meine absoluten URLs zu den Bildern im Code auch sehen:

https://www.mobirise-tutorials.com/Busi ... htbox.html

[Bushisan]

Halo Tommy,
funktioniert leider immer noch nicht.
Pfade habe ich geändert. Hängt sich aber weiterhin auf.

Das habe ich in ein Textfeld kopiert.

Code: Alles auswählen

<div id="wowslider-container1">
<div class="ws_images"><ul>
		<li><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5180.jpg" alt="DSC_5180" title="DSC_5180" id="wows1_0"/></li>
		<li><a href="http://wowslider.net"><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5182.jpg" alt="jquery carousel" title="DSC_5182" id="wows1_1"/></a></li>
		<li><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5184.jpg" alt="DSC_5184" title="DSC_5184" id="wows1_2"/></li>
	</ul></div>
	<div class="ws_bullets"><div>
		<a href="#" title="DSC_5180"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5180.jpg" alt="DSC_5180"/>1</span></a>
		<a href="#" title="DSC_5182"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5182.jpg" alt="DSC_5182"/>2</span></a>
		<a href="#" title="DSC_5184"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5184.jpg" alt="DSC_5184"/>3</span></a>
	</div></div><div class="ws_script" style="position:absolute;left:-99%"><a href="http://wowslider.net">javascript slider</a> by WOWSlider.com v9.0</div>
<div class="ws_shadow"></div>
</div>	
<script type="text/javascript" src="engine1/wowslider.js"></script>
<script type="text/javascript" src="engine1/script.js"></script>
<!-- End WOWSlider.com BODY section -->

Das in den HEAD Bereich

Code: Alles auswählen

<!-- Start WOWSlider.com HEAD section -->
<link rel="stylesheet" type="text/css" href="engine1/style.css" />
<script type="text/javascript" src="engine1/jquery.js"></script>
<!-- End WOWSlider.com HEAD section -->

Die Bilder sind im entsprechenden Order DATA1 im richtigen Verszeichnis.

[Tommy Herrmann]

Moin,

… also zunächst fehlen noch die Bilder am Server:

https://www.shotokan-karate-dojo-neukir ... c_5180.jpg

Dann koiere mal das hier in den Textblock, wo der Slider angezeigt werden soll - aber nicht in einem <p> Tag, sonderen darunter:

Code: Alles auswählen

<!-- Start WOWSlider.com BODY section -->
<div class="ws_bullets">
    <div>
        <a href="#" title="DSC_5180"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5180.jpg" alt="DSC_5180"/>1</span></a>
        <a href="#" title="DSC_5182"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5182.jpg" alt="DSC_5182"/>2</span></a>
        <a href="#" title="DSC_5184"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5184.jpg" alt="DSC_5184"/>3</span></a>
    </div>
</div>
<div class="ws_script" style="position:absolute;left:-99%"><a href="http://wowslider.net">javascript slider</a> by WOWSlider.com v9.0</div>
<div class="ws_shadow"></div>

<div id="wowslider-container1">
<div class="ws_images"><ul>
		<li><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5180.jpg" alt="DSC_5180" title="DSC_5180" id="wows1_0"/></li>
		<li><a href="http://wowslider.net"><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5182.jpg" alt="jquery carousel" title="DSC_5182" id="wows1_1"/></a></li>
		<li><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5184.jpg" alt="DSC_5184" title="DSC_5184" id="wows1_2"/></li>
	</ul></div>
	<div class="ws_bullets"><div>
		<a href="#" title="DSC_5180"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5180.jpg" alt="DSC_5180"/>1</span></a>
		<a href="#" title="DSC_5182"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5182.jpg" alt="DSC_5182"/>2</span></a>
		<a href="#" title="DSC_5184"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/dsc_5184.jpg" alt="DSC_5184"/>3</span></a>
	</div></div><div class="ws_script" style="position:absolute;left:-99%"><a href="http://wowslider.net">javascript slider</a> by WOWSlider.com v9.0</div>
<div class="ws_shadow"></div>
</div>
<!-- End WOWSlider.com BODY section -->

… und das alles in den Seitenbereich "End of <body> code":

Code: Alles auswählen

<!-- Start WOWSlider.com End of Body -->
<link rel="stylesheet" type="text/css" href="engine1/style.css" />
<script type="text/javascript" src="engine1/wowslider.js"></script>
<script type="text/javascript" src="engine1/script.js"></script>
<script type="text/javascript" src="engine1/jquery.js"></script>
<!-- End WOWSlider.com End of Body -->

Kann aber auch sein, dass sich die alten JavaScripts nicht mit denen von Mobirise vertragen. Ich hatte das schon mal erfolgreich eingebaut (fast), nur die Thumbnails wurden nicht richtig angezeigt.

Das wird auch in Mobirise 4 wieder anders als in Mobirise 5 sein, denn in Mobirise 4 wird noch das jQuery Framework verwendet, in Mobirise 5 nicht mehr.

[Bushisan]

Hallo Tommy,

publizieren funtioniert jetzt. Hab den Pfad noch auf "images" erweitert, Hab um nicht falsch zu machen den Text auch drin gelassen. Angezeigt werden die Bilder jetzt ohne Slider im Großformat.

https://www.shotokan-karate-dojo-neukir ... #openModal

Kann aber durchaus sein, dass es nicht mehr funtioniert - ein Versuch wars wert

Gruß Hubert

[Tommy Herrmann]

Du musst die Dateien zuerst veröffentlichen, denn erst dann wirken die CSS- und JS-Dateien. Wie soll das in der Arbeitsansicht funktionieren? Mobirise hat doch keine Informationen über diese Dateien.

[Tommy Herrmann]

Wie ich jetzt sehe hast Du publiziert. Unter den Bildern läuft der Wow-Slider doch

[Tommy Herrmann]

Du hast das hier versehentlich doppelt eingebaut:

Code: Alles auswählen

<div class="ws_bullets">
    <div>
        <a href="#" title="DSC_5180"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/images/dsc_5180.jpg" alt="DSC_5180">1</span></a>
        <a href="#" title="DSC_5182"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/images/dsc_5182.jpg" alt="DSC_5182">2</span></a>
        <a href="#" title="DSC_5184"><span><img src="https://www.shotokan-karate-dojo-neukirchen.de/versuche/data1/images/dsc_5184.jpg" alt="DSC_5184">3</span></a>
    </div>
</div>
<div class="ws_script" style="position:absolute;left:-99%"><a href="http://wowslider.net">javascript slider</a> by WOWSlider.com v9.0</div>
<div class="ws_shadow"></div>

Lösche diesen ersten Eintrag und dann funktioniert das einwandfrei.

[Bushisan]

Mein Gott,

ich möchte nicht wissen was Du in solchen Momenten denkst

1000 Dank wie immer - funzt

LG Hubert

[Tommy Herrmann]

In solchen Momenten denke ich zunächst: „Ach prima, es funktioniert ja doch.“

Dann erinnere ich mich jedoch oft daran, dass mir ähnliche Situationen schon häufig widerfahren sind und ich alles Mögliche versucht habe, anstatt den Fehler zu erkennen.

[Tommy Herrmann]

Wenn Du das mal in eine "echte" Seite einbauen solltest, gehört die CSS-Datei eigentlich eher in den Bereich:

"Inside <head> code"

Code: Alles auswählen

<link rel="stylesheet" type="text/css" href="engine1/style.css" />

… also dann oben in die Seite. Wichtig ist bei Dir in "Mobirise 4", dass die jQuery-Datei unter jener von Mobirise steht.

Eigentlich kannst Du die jQuery (wahrscheinlich) auch weglassen, denn Dein Mobirise verwendet die gleiche jQuery-Datei und daher ist diese dann nur doppelt vorhanden.

... muss jetzt Einkaufen und noch zum Zahnarzt

[Tommy Herrmann]

Die beiden JavaScript vom WOW-Slider müssen dagegen unten im Bereich "End of <body> code" bleiben, die hast Du gerade wieder falsch eingebaut.

Code: Alles auswählen

<!-- Start WOWSlider.com End of Body -->
<script type="text/javascript" src="engine1/wowslider.js"></script>
<script type="text/javascript" src="engine1/script.js"></script>
<!-- End WOWSlider.com End of Body -->

[Tommy Herrmann]

Jetzt hast Du ja alles falsch eingefügt - auch die Bilder sind wieder mit relativem Pfad anstatt mit der absoluten URL zum Server

… ich kann dann eher erst morgen weiter helfen, derweil ich jetzt aufwendig koche und Besuch bekomme.

[Bushisan]

Ja sorry Tommy - jetzt hab ich alles richtig gemacht - läuft alles!!

Danke

[Tommy Herrmann]

ist noch nicht ganz richtig - aber Du schaffst das