xtcSlimboxPic (Einzelbildbild/Bildersets mit Lightboxeffekt)

Gesperrt
yodatortenboxer
Beiträge: 424
Registriert: Do 22. Jan 2004, 14:45
Wohnort: Kölpinsee auf Usedom
Kontaktdaten:

xtcSlimboxPic (Einzelbildbild/Bildersets mit Lightboxeffekt)

Beitrag von yodatortenboxer » Do 18. Sep 2008, 13:37

Hallo,

Ich habe auf der Grundlage von Slimbox1.64 ein Modul umgesetzt das entweder als Einzelbild oder als Bildergallerie mit dem Lightbox-Effekt funktioniert.

Vorteil am Beispiel eines Einzelbildes:

Vorgabe:
Bild des Kunden ist ein 4MP Bild (2304x1728 Pixel)
Im Layout soll der Platz für das Bild 300x400px sein.

Das normale Vorgehen währe das vorhandene Bild dementsprechend auf die 300x400px anzupassen, auf den Server zu kopieren und dann in ein Standardbildmodul einzubinden.

Mit dem xtcSlimboxPic funktioniert das ganze nun so.
Im Template werden folgende angaben gemacht:
* Abzeigeart: Bild einzeln
* Vorschaubilder Breite max. 400px, Höhe max.400px
* Vorschaubilder beschneiden Breite 300px, Höhe 400px
* Slimboxbildgröße (Zoom) Breite max. 1000px, Höhe max.800px

Das Ergebnis ist, ein Vorschaubild von 300x400px (automatisch Beschnitten) und bei Klick auf dieses Bild ein Lightbox Effekt wo das Bild innerhalb der Box mit Original Proportionen dann 1000x741px (duch max. 1000x800px) groß ist.

Vorteil: der Kunde kann seine Bilder Fotografieren, hochladen, einbinden, und sie passen immer ohne Vorherige anpassungen in das Layout.

Beispiel für "Bilderset mermals mit HTML-Bereich"

Man könnte auf einer Seite mehrere Gallerien aus mehreren Verzeichnissen inkl. einem Textbereich für die jeweilige Gallerie als eine Gesamtgallerie mit einem Modul umsetzen.

Ich selbst setze es bei einem Kunden ein der mehrere Objekt mit jeweils mehreren Zimmern hat. Jedes Zimmer hat nun einen eigenen Bilderordner und auf einer Seite wird das gesamte Objekt als Zimmerbeschreibung, Zimmerbilder, nächste Zimmerbeschreibung, Zimmerbilder, nächste Zimmerbeschreibung, Zimmerbilder... dargestellt und bei klick auf die Bilder werden ALLE Bilder in einer Bildergallerie mit Lightbox-Effekt dargestellt.

Allgemein

Die Vorschaubilder und die Bilder innerhalb des Lightboxeffekts werden automatisch auf die max. definierte Größe die im Template angegeben wurde umgerechnet. Vorschaubilder können auch beschnitten werden, so dass alle Vorschaubilder ein und die selbe Größe, unabhängig vom Originalbild (Bsp. Hoch- oder Querformat) haben. Die Bilder in den Bildersets sind jeweils in einem span class=xtcSlimboxPicCell hinterlegt und können damit per CSS positioniert werden.

Nun suche ich ein paar Freiwillige zum testen von dem ganzem!

Slimbox ist ein 4kb Clone von Lightbox 2.0 der durch Optimierung im JS um eingiges schneller als das Original Lightbox ist.
Noch ein Vorteil laut Forum:
Da die Slimbox auf mootools basiert, wird sie nicht über das onLoad-Event, sondern über das mootools-eigene DOMready-Event initialisiert! Also schon wenn das DOM fertig aufgebaut ist, aber die Inhalte noch nicht fertig geladen wurden.
Das ist extrem hilfreich, wenn man z.B. in einer Gallerie viele Thumbnails auf einer Seite lädt und der User das erste schon anklickt, bevor die komplette Seite geladen wurde. In solchen Fällen versagen Lightboxes mit normaler onLoad-Initialisierung dann nämlich meistens.
Auswahlmöglichkeiten:

* Bild einzeln (wie Standardbildmodul)
* Bildset einzeln (einzelne Bildergallerie aus einem Verzeichnis)
* Bildset mehrfach (einzelne Bildergallerie aus mehreren Verzeichnissen)
* Bildset mehrfach mit HTML-Bereich (einzelne Bildergallerie aus mehreren Verzeichnissen, pro Verzeichnis ein HTML-Textbereich)

Einstellmöglichkeiten Template:

* Vorschaubildgröße (Originalverhältnis) einstellbar
* Vorschaubild auf voreingestellte Größe beschneidbar
* Slimboxbild (Zoom) Größe einstellbar

Funktionsweise Bild einzeln:

1. Im Editor Bild wie gewohnt auswählen.
2. Im Template Größen einstellen und Anzeigeart auf "Bild einzeln" stellen.

Funktionsweise Bildset/-s:

1. Im Template Größen einstellen und Anzeigeart auf "Bildset..." stellen.
2. Verzeichnis auswählen das die Bilder enthält.

Funktionsweise Bildsets mit HTML-Bereich:

1. Im Template Größen einstellen und Anzeigeart auf "Bildset mehrfach mit HTML-Bereich" stellen.
2. Verzeichnisse auswählen welche die Bilder enthalten.
3. Im Editor über der jeweiligen Bildgruppe den Text einfügen.

Changlog:

0.0.6

* ADD Bilder bei Vorschaubilder auf vordefiniertes Format beschneiden.

0.0.5

* ADD Bilder-Sets (Bildergalerie mit „Ligthbox“-Effekt) mit jeweiligen HTML-Bereich (CMS_HTML) aus mehreren verschiedenen Verzeichnissen erstellbar
* ADD Auswahl mehrerer Verzeichnisse wird über jedem ein extra editierbarer HTML-Bereich ausgegeben
* CHANGE Auswahlmöglichkeit ob Einzelbild, Bilderset (ein Verzeichnis), Bilder-Sets (mehrere Verzeichnisse) oder Bilder-Sets (mehrere Verzeichnisse) mit jeweiligen HTML-Bereich
* mehrfach in einem Artikel einsetzbar

0.0.4

* ADD Bilder-Sets (Bildergalerie mit „Ligthbox“-Effekt) aus mehreren verschiedenen Verzeichnissen erstellbar
* ADD Anzahl der Verzeichnisse ist Dynamisch
* CHANGE Auswahlmöglichkeit ob Einzelbild, Bilderset (ein Verzeichnis) oder Bilder-Sets (mehrere Verzeichnisse)

0.0.3

* ADD Bilder-Set (Bildergalerie mit „Ligthbox“-Effekt)
* ADD Auswahlmöglichkeit ob Einzelbild oder Bilder-Set
* ADD Anzahl der Spalten beim Bilder-Set

0.0.2

* CHANGE Slimbox-JS zu 1.64
* ADD „Ligthbox“-Effekt für Bildmodul
* ADD Resize für „Ligthbox“-Effekt

0.0.1

* ADD Bildresize in Contenido Bildmodul in der Normalansicht
* ADD Slimbox-JS 1.63

Demo

Download

Viel Spass damit!
yodatortenboxer
Zuletzt geändert von yodatortenboxer am Fr 19. Sep 2008, 06:58, insgesamt 3-mal geändert.

kite
Beiträge: 33
Registriert: Mi 25. Mai 2005, 10:12
Kontaktdaten:

Beitrag von kite » Do 18. Sep 2008, 14:22

Cooles Modul! Das ist genau das was ich gesucht habe.
Allerdings habe ich noch das Problem, dass ein eingefügtes Bild in einem Newsbeitrag nicht in der Newsliste auftaucht. Kann man das noch irgendwie einbauen?

Bzw. ließe es sich so modifizieren, dass das Modul einfach jedem Bild, das in einem Artikel eingefügt ist, die Lightboxeinstellungen aufzwingt?

Auf meiner Seite schreibe ich Newsbeiträge mit jeweils maximal einem Bild dabei, deswegen wäre es für mich äußerst nützlich, wenn das ausgewählte Bild in der Newsliste auftaucht, aber im Artikel trotzdem der Lightbox-Effekt vorhanden ist.

yodatortenboxer
Beiträge: 424
Registriert: Do 22. Jan 2004, 14:45
Wohnort: Kölpinsee auf Usedom
Kontaktdaten:

Beitrag von yodatortenboxer » Do 18. Sep 2008, 15:43

Welche Newsliste nutzt du?

Ich selbst nutze es bei einem Kunden mit der ArtikelList Adv. 1.4.
Die Detailseiten haben als Grundform einen Headline und einen Textcontainer, einen Bildcontainer(xtcSlimboxPic als Einzelbild) und ein Bildergalleriecontainer(xtcSlimboxPic als Bilderset mit HTML-Containern).
Bei der Newsübersicht habe ich dann immer pro News die Überschrift, den Textcontainer und das Bild aus dem Bildcontainer(xtcSlimboxPic als Einzelbild). Natürlich ist dann dort kein Lightbox Effekt da dieser ja in der ArtikelList Adv. nicht ist.

Gruß yodatortenboxer

BIG-BEN
Beiträge: 190
Registriert: Do 18. Okt 2007, 09:47
Kontaktdaten:

Beitrag von BIG-BEN » Do 18. Sep 2008, 17:20

klingt schon mal sehr gut!!!

Werd es demnächst mal ausprobieren wenn die Seite soweit steht :wink:

MFG Benny

pit
Beiträge: 96
Registriert: Mo 14. Apr 2003, 10:28
Wohnort: Rotenhain
Kontaktdaten:

Beitrag von pit » Do 18. Sep 2008, 17:24

Super Modul, gut gemacht!
@halchteranerin: nur Standard-Schreiben muß er noch lernen :wink:
Die alten Zeilen wurden schlecht und man begann sie wegzuschmeissen, die neuen kamen grade recht um sich an ihnen zu verbeissen! (frei nach Heinz Erhardt)

yodatortenboxer
Beiträge: 424
Registriert: Do 22. Jan 2004, 14:45
Wohnort: Kölpinsee auf Usedom
Kontaktdaten:

Beitrag von yodatortenboxer » Fr 19. Sep 2008, 06:57

@halchteranerin: nur Standard-Schreiben muß er noch lernen
ich geb mir mühe ;-)

Gruß yodatortenboxer

kite
Beiträge: 33
Registriert: Mi 25. Mai 2005, 10:12
Kontaktdaten:

Beitrag von kite » Fr 19. Sep 2008, 12:11

yodatortenboxer hat geschrieben:Welche Newsliste nutzt du?
Ich benutze das Standard–News–Modul aus Contenido. Werde mal das ausprobieren, das du auch benutzt.
Danke schonmal für den Tipp.

tommo
Beiträge: 120
Registriert: So 27. Jun 2004, 21:34
Kontaktdaten:

Beitrag von tommo » So 21. Sep 2008, 22:24

Ist das nicht das selbe wie das hier: ImageResizeHTML
Gruß,
Tom

yodatortenboxer
Beiträge: 424
Registriert: Do 22. Jan 2004, 14:45
Wohnort: Kölpinsee auf Usedom
Kontaktdaten:

Beitrag von yodatortenboxer » Di 23. Sep 2008, 08:13

Ist das nicht das selbe wie das hier: ImageResizeHTML
Nein...da steht
...ein modul geschrieben, welches bilder, die im online-editor eingepflegt werden auf die masse skaliert...
bzw.
...das modul ist ein CMS_HTML-Modul...
Ich denke einmal das es sich bei dem ImageResizeHTML darum handelt Bilder die in dem Onlineeditor (Bsp. TinyMCE) auf eine vorher definierte Größe heruntergerechnet werden und mehr scheinbar nicht.

Das Modul xtcSlimboxPicCell hat mehrere Funktionen.
1. man kann es als einzelnes Bildmodul im Layout einfügen
2. man kann es als Bildergallerie verwenden
2. man kann es als Bildergallerie aus mehreren Ordnern, Anzahl einstellbar, ohne oder mit je einem CMS_HTML-Modul pro Verzeichnis

Dabei haben alle Bilder diese Bilder den "Lightbox-Effekt" und die Möglichkeit per Template auf Resize des Thumb und des Bildes innerhalb der "Lightbox" und die Thumb können noch beschnitten werden damit in der Thumbvorschau alle Bilder, egal ob Hoch oder Querformat, gleich groß dargestellt werden.

Beispiel: Einstellungen 3 Bereiche mit "Bilderset mehrfach mit HTML-Bereich" ergibt folgendes:
- Ein CMS_HTML Modul
- Einen auswählbaren Ordner für die Bildergallerie (Bsp: upload/Bilder/OrtA)
- Ein CMS_HTML Modul
- Einen auswählbaren Ordner für die Bildergallerie (Bsp: upload/Bilder/OrtB)
- Ein CMS_HTML Modul
- Einen auswählbaren Ordner für die Bildergallerie (Bsp: upload/Bilder/OrtC)

Das ergebnis ist dann eine Bildergallerie aus den Ordnern OrtA, OrtB, OrtC wobei über jedem dieser Bilder noch ein CMS_HTML Modul ist in dem man zum Beispiel einen längeren Text mit Hilfe des Editors hinterlegen kann.

Beispiel 1 in Anwendung:

http://hochzeit.ralf-fleischer.de/cms/f ... hp?idcat=5

Die Bilder im Layout rechts oben sind als einzelnes Bildmodul im Template eingesetzt, also nicht über den Editor (Bsp. TinyMCE) eingepflegt. Bei klick auf das Bild erscheint der "Lightboxeffekt".

Beispiel 2 in Anwendung:(Seite ist noch im Aufbau)

Detailseite
http://www.koelpinsee.com/cms/front_con ... 3&idart=84

Aufbau:
- ein CMS_HTMLHeadline Modul (Benötigt für Übersichtsseite)
- ein CMS_HTML Modul (Benötigt für Übersichtsseite)
- ein xtcSlimboxPic als Einzelbild mit "Lightboxeffekt" (Benötigt für Übersichtsseite)
- ein xtcSlimboxPic als Bildset mit CMS_HTML mit "Lightboxeffekt" (mehrere Bereiche für jeweils eine Zimmerbeschreibung und ein Bilderset dieses Zimmers, alle Zimmerbilder sind eine Bildergallerie mit "Lightboxeffekt" )

Übersichtsseite:
http://www.koelpinsee.com/cms/front_con ... p?idcat=23
(mit Artikellist Adv. 1.4)

Gruß yodatortenboxer

mauerblume
Beiträge: 89
Registriert: Do 12. Feb 2004, 20:42
Wohnort: Niederlausitz
Kontaktdaten:

Beitrag von mauerblume » Di 23. Sep 2008, 14:35

Wenn ich das Modul als Bildergalerie einsetze,

also "Bilderset einzeln"

kann man dann irgendwie eine Funktion zum Aufteilen auf mehrere Seiten aktivieren?

Sonst hab ich 200 Bilder auf einer Seite.
*********************************
Contenido-Konstruktionen von 4.2 bis 4.8.X

yodatortenboxer
Beiträge: 424
Registriert: Do 22. Jan 2004, 14:45
Wohnort: Kölpinsee auf Usedom
Kontaktdaten:

Beitrag von yodatortenboxer » Di 23. Sep 2008, 18:04

Eine Navigation ala x Bilder pro Seite mit vor und Zurück werde ich in der nächsten Version umsetzen. Ich denke das ich da bis Anfang nächster Woche dazu komme.

Gruß Yodatortenboxer

Andreas
Beiträge: 254
Registriert: So 16. Nov 2003, 14:48
Wohnort: Reichshof
Kontaktdaten:

Beitrag von Andreas » Do 9. Okt 2008, 09:30

Hallo,

ist es möglich mehrere Einzelbilder auf einer Seite (also keine Galerie) darzustellen? Quasi die Mehrfachnutzung des Moduls?
Gruß
Andreas

BIG-BEN
Beiträge: 190
Registriert: Do 18. Okt 2007, 09:47
Kontaktdaten:

Beitrag von BIG-BEN » Mi 15. Okt 2008, 19:05

hy hab das modul eingebaut in der 4.6.24 läuft eigentlich auch :D
nur wie kann ich den abstand zwischen den bildern bestimmten?

und wo mach ich die bildbeschriebung wenn ich bildersets einbinde?

Ansosnten ein top modul!!

MFG Benny

mfweb
Beiträge: 270
Registriert: Mo 12. Sep 2005, 18:31
Kontaktdaten:

Beitrag von mfweb » Mi 15. Okt 2008, 21:20

BIG-BEN hat geschrieben:nur wie kann ich den abstand zwischen den bildern bestimmten?
Lies den ersten Beitrag unter Abschnitt "Allgemein" noch einmal genauer durch.
BIG-BEN hat geschrieben:und wo mach ich die bildbeschriebung wenn ich bildersets einbinde?
Da hilft ein Blick auf die oben verlinkte Originalseite:
Ersatz des Standart Bildmoduls oder der Bildergallerie von Contenido mit Slimbox Effeckt (wie Lightbox) und Resize der Bilder in der Standartansicht und in der Slimboxansicht inklusive Bildtitel und Beschreibungausgabe. Die Bildtitel und Beschreibung wird in der Dateiverwaltung bei dem Bild hinterlegt.
Grüße,
mfweb

BIG-BEN
Beiträge: 190
Registriert: Do 18. Okt 2007, 09:47
Kontaktdaten:

Beitrag von BIG-BEN » Mi 15. Okt 2008, 21:29

DANKE für die Info wo ich die Bildbeschriebung finde!

Aber könntest du mir vielleicht sagen wo ich in der css das mit den abstand einstellen kann (da ich noch nich so viel davon versteh wär dat echt supi!)

MFG Benny

Gesperrt