Kommentare

tecmaxy schrieb am 01.02.2015 um 21:43 Uhr

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........

Gruß

BilderMacher schrieb am 02.02.2015 um 00:33 Uhr

Es geht relativ einfach, wenn du nur die drei Bilder auswechseln möchtest.

Erstelle ein Rechteck als Platzhalter.

In den body kopierst du den Inhalt der html-Datei vom Slider. Die html-Datei kannst du mit dem Editor von Windows öffnen.

Deine Bilddateien, die im images-Ordner liegen und entsprechend benannt sind, musst du im Code an entsprechender Stelle ersetzen.

Als Beispiel:

<img class="model" src="images/model1.png" alt="Model 1" />

angepasst durch hinzufügen der 1:

<img class="model" src="images/model11.png" alt="Model 1" />

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:

 

Zuletzt geändert von BilderMacher am 02.02.2015, 00:33, insgesamt 1-mal geändert.

"Je mehr die Menschen wissen, desto weniger müssen sie glauben!"

+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
Ich kann vieles, darf aber nicht alles.
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

-------------

Hardware / Software:
::::::::::::::::::::::::::::::::::::++++:::::::::::::::::::::::::::::::::::::::::::::::::

Intel(R) Core(TM) i7-10510U CPU @ 1.80GHz (8 CPUs), ~2.3GHz
12288 MB RAM
DirectX 12
 

Intel(R) UHD Graphics (für Import, Verarbeitung, Export)

NVIDIA GeForce MX250 (wird nicht in Schnitt-SW verwendet)

  • Video deluxe 2016 Premium
  • Video deluxe 2025 Premium
  • Video Pro X 16
  • Photostory Deluxe 2025
  • Samplitude X7 Suite
  • ACID Pro 11
  • Music Maker 2025 Premium
  • MAGIX/XARA Graphic-/Web-Designer

-----------------------------------------------------------------------------------

Edition    Windows 10 Home
Version    22H2
Installiert am    ‎15.‎10.‎2020
Betriebssystembuild    19045.5371
Leistung    Windows Feature Experience Pack 1000.19060.1000.0

------------------------------------------------------------------------------------

Standardbrowser: Mozilla Firefox 134.0.0 (64-Bit)

👶-Boomer

vikkiv schrieb am 02.02.2015 um 09:03 Uhr

Hallo und vielen Dank für die Tipps.

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.

Meine Testseite: http://www.sono-consulting.de/

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..???

Danke und Gruß

BilderMacher schrieb am 02.02.2015 um 11:03 Uhr

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" ...

### stehen für <>

Damit ist der vom WD erzeugte Code "sauber".

http://bildermacher.magix.net/modern-slider-chronos/

Zuletzt geändert von BilderMacher am 02.02.2015, 11:10, insgesamt 3-mal geändert.

"Je mehr die Menschen wissen, desto weniger müssen sie glauben!"

+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
Ich kann vieles, darf aber nicht alles.
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

-------------

Hardware / Software:
::::::::::::::::::::::::::::::::::::++++:::::::::::::::::::::::::::::::::::::::::::::::::

Intel(R) Core(TM) i7-10510U CPU @ 1.80GHz (8 CPUs), ~2.3GHz
12288 MB RAM
DirectX 12
 

Intel(R) UHD Graphics (für Import, Verarbeitung, Export)

NVIDIA GeForce MX250 (wird nicht in Schnitt-SW verwendet)

  • Video deluxe 2016 Premium
  • Video deluxe 2025 Premium
  • Video Pro X 16
  • Photostory Deluxe 2025
  • Samplitude X7 Suite
  • ACID Pro 11
  • Music Maker 2025 Premium
  • MAGIX/XARA Graphic-/Web-Designer

-----------------------------------------------------------------------------------

Edition    Windows 10 Home
Version    22H2
Installiert am    ‎15.‎10.‎2020
Betriebssystembuild    19045.5371
Leistung    Windows Feature Experience Pack 1000.19060.1000.0

------------------------------------------------------------------------------------

Standardbrowser: Mozilla Firefox 134.0.0 (64-Bit)

👶-Boomer

BeRo schrieb am 02.02.2015 um 11:20 Uhr

[...] 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>
----------------------------------------

Mehr ist nicht zu tun.

Das Ergebnis zeigt sich dann so:

Viel Erfolg

Zuletzt geändert von BeRo am 02.02.2015, 11:20, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

vikkiv schrieb am 05.02.2015 um 11:03 Uhr

Vielen Dank für diem hilfreichen Tipps.

Wenn ich das aber über iFrame anbinde dann geht aber der responsive Effekt verloren oder?

Gruß

 

BeRo schrieb am 05.02.2015 um 12:16 Uhr

[...] 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...

Zuletzt geändert von BeRo am 05.02.2015, 12:16, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

to1671 schrieb am 19.02.2015 um 20:18 Uhr

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.

Vielen Dank schon im Vorraus.

BeRo schrieb am 19.02.2015 um 23:10 Uhr

@to1671

[...] Ich meine damit das es unanhänging der Bildschrimgröße immer über die ganze Fläche angezeigt wird in der Breite. [...]

Die Antwort stand schon im Thread, bevor Du Deine Frage gepostet hast. Du findest sie jetzt direkt unterhalb Deines Postings...

Zuletzt geändert von BeRo am 19.02.2015, 23:10, insgesamt 1-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓