Ich hab mir das ganze mal näher angesehen. Es ist HTML mit Javascript programmiert. ist die Datei "index.html" aus dem Verzeichnis "Modern-slide-in" bei dir ausführbar?
Ich kann über die Index.html und und durch auswechseln der jpg Dateien im Verzeichnis "images" eine eigene Slideshow erstellen. Aber Achtung: Bildgrößen etc wie in der scss hinterlegt müssen passen.
Hier ist etwas Tuning über HTML und iQuery notwendig. Du kannst die Einbettung im Firefox Browser über dem Element - rechtsclick - Element untersuchen sehen. Die dateien mit der Endung js sind Javascript programmiert.
Mit etwas Geduld und Nachlesen im Netz (selfhtml) klappt es. Die freigestellten png Dateien bearbeitest du am besten mit paint.net oder gimp.
Viel Spaß, es dauert etwas, aber manche studieren Jahre lang........
Dann musst du deine HP exportieren. In den Ordner exportiert wird und die HTM-Datei liegt, welche den Slider zeigen soll musst du alle Slider-Ordner hinzufügen:
css
images
scripts
scss
.DS_store
und die Datei
sequencejs-options.modern-slide-in.js
Vom WD sind dann noch der Ordner
index_htm_files
vorhanden.
Mit diesem Grundgerüst funktioniert der Slider, wenn du mit einem FTP-Programm die oben genannten Ordner und Dateien hinterherschiebst.
Da der Code vom Slider in einer der HTM-Dateien im Platzhalter liegt und die Pfade nicht angepasst sind, muss diese in der ROOT liegen und alle Ordner:
Aslo wie ich die Fotos anpassen kann etc.. das ist nicht das Problem. Mir geht es darum wie man das genau anbindet. Nach der Anleitung auf der HP geht das nicht oder ich mache (mit Sicherheit) was falsch.
Nach der Anleitung von Bilder Macher funkt. alles allerdings steht der Slider in der Mitte der Seite und hat eine quadratische Form. bzw. soll als responsive fungieren wie in dem org. Beispiel.
NACHTRAG: ok, ich habe den Fehler gefunden Man muss den Head Bereich der beiligenden html in den Head Bereich einfügen und Body zu Body Bereich des WD. Und alles funkt. wie gewollt.
Gibt aber auch noch eine Möglichkeit den etwas schmaller zu machen? Z.B. über das Script?
NACHTRAG: es wäre schön wenn alles immer auf ein mal klappen würde! Die Ihhalte de org. htm Datei von WD sind gar nicht zu sehen dh. mein BG und der Schriftzug "Test" wurden ausradiert...es ist nur der Slider zu sehen sonst nichts? Liegt das eventuell an der htm des WD und html des Sliders, dass sie zusammen nin der Root liegen..???
Okay, wenn es nun funktioniert, ist das erfreulich.
Noch etwas zum Code des Sliders.
Die einleitenden und abschließenden Tags "head", "/head", "html", "/html", "body" und "/body" (alles mit <>) können entfernt werden. Im Head-Code auch diese Zeile(n):
###!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
[...] Liegt das eventuell an der htm des WD und html des Sliders, dass sie zusammen nin der Root liegen..? [...]
Genau das ist der Grund.
Wenn 2 Startdateien (index.xxx) mit unterschiedlichen Endungen im root Verzeichnis liegen, dann liefert der Webserver die mit der Endung "html" zuerst aus. Das heißt, dass Deine index.htm keine Chance bekommt, angezeigt zu werden. Es sei denn, Du erweiterst die URL explizit um "/index.htm" (http://www.sono-consulting.de/index.htm)..
Aber warum machst Du es Dir nicht einfacher?
Da die von Dir favorisierte Slideshow problemlos funktioniert, wenn Du die mitgelieferte "index.html" doppelt klickst, genügt es völlig, die Startdatei per iframe in einen Platzhalter zu packen.
Wie @BilderMacher schon erwähnte, sind die Links auf die zugehörigen Dateien- und Verzeichnisse fest vergeben. Du musst also dafür sorgen, dass alle verlinkten Dateien im gleichen Verzeichnis abgelegt werden, in dem die "index.html" der Slideshow liegt. Das sollte ein Unterverzeichnis sein, damit es nicht zu dem o. gbeschilderten Kollision mit 2 Startdateien kommt.
Wenn Du die RAR Datei "Deiner" Slideshow öffnest, findest Du u. a. das dafür geeignete Verzeichnis "modern-slide-in". Darin ist alles enthalten, was Du brauchst. Es genügt also, dieses Verzeichnis in das Verzeichnis Deines Webservers zu kopieren, in dem Deine normale Startdatei "index.htm" liegt.
Der dazu passende iframe Code, den Du in den HTML Body eines geeigneten Platzhalters legst, sieht so aus:
---------------------------------------- <iframe src="modern-slide-in/index.html" width="100%" height="100%" frameborder="0" scrolling="auto" name="xara_iframe" ><p>Your browser does not support iframes.</p></iframe>
----------------------------------------
[...] Wenn ich das aber über iFrame anbinde dann geht aber der responsive Effekt verloren [...]
Das ist leider richtig.
Der Effekt geht auch verloren, wenn Du die Website Varianten Option des WD nutzt, mit der er ein quasi responsive Design erzeugt.
Die dabei vom WD genutzte Methode überschreibt wichtige Teile der Funktionen, die das "Modern Slide In" benutzt.
Das von dem Slider angebotene responsive Design ist IMHO nur dann in einer eigenen Site realisierbar, wenn die Site mit einem echten HTML Editor erstellt wird. Der WD als WYSIWYG Editor eignet sich nicht besonders gut dazu, es sei denn, Du baust wesentliche Teile des HTML output um...
Danke für Eure tollen Erklärungen und die Mühe die Ihr euch gebt.
Jetzt habe ich auch noch mal eine Frage zu dieser Slideshow. Gibt es eventuell auch eine Möglichkeit die Slideshow Bildschirmfüllend zu erstellen? Ich meine damit das es unanhänging der Bildschrimgröße immer über die ganze Fläche angezeigt wird in der Breite.