Nachdem ich herumgekreist bin, scheint mir tatsächlich auch dieser Ansatz vielversprechend für meine Idee verschiedener Bild-Collagen! Auf jeden Fall eine coole Idee.
1. Ob das auch im Blog klappt?
Zitat von Wolfgang im Beitrag #7Zum Testen kann das komplette Skript ... kopiert werden!
2. Aber bräuchte ich dafür nicht erst die Foren-Codes, um es implementieren zu können? Jedenfalls hab ichs jetzt gleich richtig ausprobiert.
Zitat von Wolfgang im Beitrag #7Zeile 45 und 58 wird die Grundgröße der Vorschau-Bilder eingegeben!
3. Beeinflusst das auch wie viele Bilder nebeneinander stehen (bei dir 3) und die Breite (bei dir nicht volle Breite)?
Zitat von Wolfgang im Beitrag #7Für alle neuen Foren-Codes unter "Grafik:":
4. Also ich brauche nicht zwischen 2 und 3 zu wählen, sondern lege Mit und Ohne Beschreibung an, d.h. drei neue Foren-Codes, jeweils mit Bild und Reihenfolge 0, richtig? (So gemacht).
Zitat von Wolfgang im Beitrag #7So sieht der Foren-Code aus! ......
5. So weit bin ich gekommen, und der Code wird auch genau so auf dem Blog ausgelöst, also scheint Frage 1 mit Ja beantwortet, aber s. 7. Edit: Nee, stimmt nicht so ganz, so sieht es bei mir aus, d.h. das https fehlt. (Einmal hatte ich irgendwodurch [ line ] stehen, weiß nicht wo das her kam.)
Aber https aus den URLs entsprechend rauslöschen macht gar keinen Unterschied. Und https in den Skript einfügen auch nicht.
Dann hab ich händisch mehrere URLs der Bilddateien von unten reinkopiert, da der File:-Befehl ja so nicht funzt: 6. Ginge das auch automatischer?
Ergebnis: das erste Bild ist als Vorschau sichtbar, ein Pfeil nach rechts erscheint bei Mouseover (wie hier, nur weißer Pfeil auf schwarzem Hintergrund, das fällt bei einem Bild mit Himmel mehr auf als hier). Und mittig draufklicken führt zur Modalansicht wie gewünscht.
7. Aber die Diashow bleibt aus wenn ich auf den Pfeil klicke, egal ob mit oder ohne Beschreibung. Was stimmt nicht?
8. Und es ist noch nicht Multipel, mehrere nebeneinander, wie bei dir. Was fehlt mir?
9. Du schriebst ja in deiner Anregung in meinem Bilder-Collage Thread...
Zitat von Wolfgang im Beitrag #12Allein die CSS stimmt nicht, bitte alles aus Beitrag #7 und Einbau HTML-Skript übernehmen![
Super, freut mich, dass wir dies wieder angehen können! Nach längerem Suchen wo ein CSS-Skript sein soll, seh ich, dass unter "Code kopieren" nicht ein Code, sondern vielleicht 3 drin sind? Erst 1) style /style, dann 2) < div class="myModal"> < /div>, dann 3) script /script.
Oder ist das die CSS? Aber was heißt dann "Einbau HTML-Skript übernehmen"?
Was ich verstanden hatte war diesen kompletten Code, alle 3 Teile, als einzelnes Plugin im bottom_header anzulegen...
Das hab ich auch erneuert, erfolglos, es sieht immer noch so aus, Ist es eher ein "Gewusst-Wo" als ein veralteter Code?
Oder liegt es daran, dass ich meine Bilder als "File:" angebe, nicht als Internet-Adresse? Aber da versteh ich Punkt 7 auch so, dass die Software das umwandelt...
1 2 3 4 5 6 7 8 9
[slideshow=400px] [img_slides=Blaumeise gefächerter Schwanz auf Zweigspitze][[File:IMG_130212 Blaumeise gefa?cherter Schwanz auf Zweigspitze sn bv v2 lf.jpg|none|fullsize]] [/img_slides] [img_slides=Blaumeise auf Zweigspitze][[File:IMG_130216 Blaumeise auf Zweigspitze sn bv v2 lf.jpg|none|fullsize]][/img_slides] [img_slides=Blaumeise auf Zweigspitze][[File:IMG_130217 Blaumeise auf Zweigspitze sn bv v2 lf.jpg|none|fullsize]][/img_slides] [img_slides=Blaumeise singt auf Zweig mit ausgebreiteten Flügeln und Schwanz][[File:IMG_130218 Blaumeise singt auf Zweig ausgebreiteter Flu?gel Schwanz sn bv v2 lf.jpg|none|fullsize]] |none|fullsize]][/img_slides] [img_slides=Blaumeise singt auf Zweig Schwanz zur Seite ][[File:IMG_130220 Blaumeise singt auf Zweig Schwanz zur Seite sn bv v2 lf.jpg|none|fullsize]][/img_slides] [/slideshow]
4. Update Foren-Code: Ohne Bild-Beschreibung für "IMG-Bilder" (Sollte bereits durch Beitrag #7 vorhanden sein!)
Ersetze:
1
[img_slid={{height}}]
1
...
1
[/img_slid]
Mit:
1
<div class="mySlides"><img style="height: {{height}};" title="Hier geht es zur Modal-Ansicht!" class="myImgModal" src="
1
...
1
"></div>
5. Update Foren-Code: Mit Bild-Beschreibung für "IMG-Bilder" (Sollte bereits durch Beitrag #7 vorhanden sein!)
Ersetze:
1
[img_slides={{height}}={{data}}]
1
...
1
[/img_slides]
Mit:
1
<div class="mySlides"><img style="height: {{height}} !important;" title="Hier geht es zur Modal-Ansicht!" class="myImgModal" data="<center><dl><dd>{{data}}</dd></dl></center>" src="
1
...
1
"><dl><dd>{{data}}</dd></dl></div>
Schließen
Einbau in die Iconbar
Ohne Bild-Beschreibung für "Upload-Bilder (File)":
1
<div onclick="xob_insert('[slideshow=500px]\n[image_slid=250px][[File:Bild1.jpg|none|fullsize]][/image_slid]\n[image_slid=250px][[File:Bild2.jpg|none|fullsize]][/image_slid]\n[image_slid=250px][[File:Bild3.jpg|none|fullsize]][/image_slid]\n[/slideshow]','')" class="xob_icon_cont"><img title="Multiple Diashow ohne Bildbeschreibung - Für Upload-Bilder!" class="xob_icon" src="https://img.homepagemodules.de/ds/static/feedicons/pic_album.png"></div>
Mit Bild-Beschreibung für "Upload-Bilder (File)":
1
<div onclick="xob_insert('[slideshow=500px]\n[image_slides=250px=Bildbeschreibung 1][[File:Bild1.jpg|none|fullsize]][/image_slides]\n[image_slides=250px=Bildbeschreibung 2][[File:Bild2.jpg|none|fullsize]][/image_slides]\n[image_slides=250px=Bildbeschreibung 3][[File:Bild3.jpg|none|fullsize]][/image_slides]\n[/slideshow]','')" class="xob_icon_cont"><img title="Multiple Diashow mit Bildbeschreibung - Für Upload-Bilder!" class="xob_icon" src="https://img.homepagemodules.de/ds/static/feedicons/pic_album.png"></div>
Ohne Bild-Beschreibung für "IMG-Bilder" (Sollte bereits durch Beitrag #7 vorhanden sein!):
1
<div onclick="xob_insert('[slideshow=500px]\n[img_slid=250px]https://www.Bild1.jpg[/img_slid]\n[img_slid=250px]https://www.Bild2.jpg[/img_slid]\n[img_slid=250px]https://www.Bild3.jpg[/img_slid]\n[/slideshow]','')" class="xob_icon_cont"><img title="Multiple Diashow ohne Bildbeschreibung - Für IMG-Bilder!" class="xob_icon" src="https://img.homepagemodules.de/ds/static/feedicons/pic_album.png"></div>
Mit Bild-Beschreibung für "IMG-Bilder" (Sollte bereits durch Beitrag #7 vorhanden sein!):
1
<div onclick="xob_insert('[slideshow=500px]\n[img_slides=250px=Bildbeschreibung 1]https://www.Bild1.jpg[/img_slides]\n[img_slides=250px=Bildbeschreibung 2]https://www.Bild2.jpg[/img_slides]\n[img_slides=250px=Bildbeschreibung 3]https://www.Bild3.jpg[/img_slides]\n[/slideshow]','')" class="xob_icon_cont"><img title="Multiple Diashow mit Bildbeschreibung - Für IMG-Bilder!" class="xob_icon" src="https://img.homepagemodules.de/ds/static/feedicons/pic_album.png"></div>
<script> document.addEventListener('DOMContentLoaded', function() { $('.slideshow-container .img-responsive.img-fluid').attr('title','Hier geht es zur Modal-Ansicht!').addClass('myImgModal'); $('.slideshow-container a').removeAttr("href").removeClass('xembedded').find('span').remove();
init(); function init() { parents = document.getElementsByClassName('slideshow-container');
for (j = 0; j < parents.length; j++) { var slides = parents[j].getElementsByClassName('mySlides'); slides[0].classList.add('active-slide'); } }
links = document.querySelectorAll('.slideshow-container p'); for (i = 0; i < links.length; i++) { links[i].onclick = function() { current = this.parentNode; var slides = current.getElementsByClassName('mySlides');
Fehlersuche: Was muss zusätzlich, was muss ersetzt werden?
Puha, klappt noch nicht ... Deswegen muss ich euch leider an weiteren Überlegungen teilhaben lassen... ¯\_(ツ)_/¯
Foren-Codes musste ich erstmal wieder halb-verzweifelt suchen: ist ja unter Iconbar, klaro... .
Ich hab ja schon alles angelegt gehabt: Was muss zusätzlich, was ersetzt werden war die Frage:
Ich denk die ersten beiden (Grafik und Einstellungen) müssen auch nicht geändert werden, sind nach #7 schon vorhanden? img_slides={{breite}} kann ich lassen, schreibst du, aber was ist mit img_slides={{data}}? Und mit [img_slides]?
Dann hab ich Ohne Bild-Beschreibung und Mit Bild-Beschreibung als HTML-Bausteine erst: neu angelegt. Dann überlegt, dass sich die vielleicht mit den bisherigen beißen: die also gelöscht. Dann mich gewundert, dass der Code auf meiner Blogseite fast genau so aussieht wie vorher, als ich geguckt hab, ob ich die bereits eingestellten Versuche angepasst werden muss... Und jetzt wunder ich mich, dass die zusätzliche Einstellmöglichkeit =250px mit in die Bildbeschreibung gekommen ist. Weiterer Test, ob es durch die Abwandlung kommt, also verschwindet wenn ich den Baustein neu benutze: nee, bleibt... Ein Vergleich mit den entsprechenden Bausteinen in #7 zeigt die sind: identisch? = schon ausgetauscht?
Und wieder steh ich aufm Schlauch... ¯\_(ツ)_/¯
(Es muss also kein getrennter CSS-Code unter CSS eingegeben werden, wie ich oben gefragt hab, oder?
Multiple Diashow mit Bildern aus dem Dateiupload - Teil 2!
Wenn alles geklappt hat sollte mit einem Klick ein Zwei-Foren-Code-Paket für IMG-Bilder und ein Zwei-Foren-Code-Paket für Upload-Bilder (File) zur Verfügung stehen!
Dann aus dem aktualisierten #14 neu eingetragen 1) die 5 neuen Foren-Codes 2) die 4 neuen Auslöse-Icons unter HTML, 3) das HTML/CSS-Plugin (= javascript?) ersetzt.
Auffälligkeiten:
1. Aus #16 habe ich erschlossen ich soll am besten alles löschen. Hab ich gemacht. In #14 seh ich aber dann ich hätte einen Teil drin lassen können? Aber sicher ist sicher? Ich hab alles gelöscht außer [img_slides={{data}}] - ist das OK?
2. In der Iconbar hab ich jetzt 4 Icons dafür. Die 2 ersten wohl für Uploads, die 2 letzten für IMG-Files. a. Meinst du das mit "Paket"? - Vielleicht passt eher "Paare"? b. Aber die Mouseover-Beschreibung der 2 ersten ist gleich die der 2 letzten, die Wirkung muss ich also entweder auswendig wissen oder ausprobieren.
3. Juhuu! Es erscheint ein Bild! Und beim Draufklicken erscheint davon auch die Modal-Ansicht!
Allerdings kann man noch nicht weiter klicken.....
Mit folgendem Forum-Code:
1 2 3 4 5 6 7 8
[slideshow=500px] [image_slides=250px=Bildbeschreibung 1][[File:IMG_130212 Blaumeise gefa?cherter Schwanz auf Zweigspitze sn bv v2 lf.jpg|none|fullsize]][/image_slides] [image_slides=250px=Bildbeschreibung 2][[File:IMG_130216 Blaumeise auf Zweigspitze sn bv v2 lf.jpg|none|fullsize]][/image_slides] [image_slides=250px=Bildbeschreibung 3][[File:IMG_130217 Blaumeise auf Zweigspitze sn bv v2 lf.jpg|none|fullsize]][/image_slides] [image_slides=250px=Bildbeschreibung 4][[File:IMG_130218 Blaumeise singt auf Zweig ausgebreiteter Flu?gel Schwanz sn bv v2 lf.jpg|none|fullsize]][/image_slides] [image_slides=250px=Bildbeschreibung 5][[File:IMG_130220 Blaumeise singt auf Zweig Schwanz zur Seite sn bv v2 lf.jpg|none|fullsize]][/image_slides] [/slideshow]
So, Wolfgang, du hast mich drauf aufmerksam gemacht, dass der Multiple Diashow-Skript irgendwo verdoppelt ist. Mit Browser-Tools konnte ich zwar den Verdopplungs-Konflikt nachvollziehen, aber nicht rauskriegen wo die Doppelung ist. Dann hab ich nochmal die Vorgehensweise angeschaut nach Alternativen geschaut und gesehen, dass es ja auch in Kopf- oder Fußleiste eingebaut werden konnte. Das kommt mir sehr... bekannt vor... hatte ich doch schonmal. *seufz* Dann einfach die Admin-Seite danach durchsucht und sofort unter Kopfleiste gefunden und gelöscht, et voilà!
Automatisierter Einbau von Bildern aus dem Dateiupload in den Multiple-Diashow-Skript
Ein weiterer kleiner Fehler, wo eins der Diashow-Bilder nicht erscheinen wollte, lag nur daran, dass ein "jpg" fehlte. Das war ein Kopierfehler, da ja die Dateinamen noch manuell in den vorbereiteten eingefügten Skript-Baustein wiederum reingefummelt werden müssen.
Deswegen wär ja noch überirdisch magisch cool, wenn jemand wie @L2otbart eine Idee hätte wie man nur die bereits per "File"-Befehl eingefügten [[File:Bild1.jpg|none|fullsize]] [[File:Bild2.jpg|none|fullsize]] [[File:Bild3.jpg|none|fullsize]] markieren müsste, und die dann per einem Click in der entsprechenden Stelle in den slideshow-Skript eingebaut werden könnten.
Zitat von Dankeschön im Beitrag #19Deswegen wär ja noch überirdisch magisch cool, wenn jemand wie @L2otbart eine Idee hätte wie man nur die bereits per "File"-Befehl eingefügten [[File:Bild1.jpg|none|fullsize]] [[File:Bild2.jpg|none|fullsize]] [[File:Bild3.jpg|none|fullsize]] markieren müsste,und die dann per einem Click in der entsprechenden Stelle in den slideshow-Skript eingebaut werden könnten.
Der Treffpunkt für Hilfe, Tricks & Tipps
»
XOBOR-Foren und Homepages
»
30.03.2025 16:47 (zuletzt bearbeitet: 31.03.2025 15:01)
Moderations-Kommentar:
Foren Spende
Direkt zu PayPal
Thema drucken
Antworten
Die neuen Foren-Codes
Für alle neuen Foren-Codes unter "Grafik:": 
.
