Startseite
  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche
Startseite › Forum › Drupalcenter.de › Tipps & Tricks ›

Lightbox2 + IMCE CCK Image

Eingetragen von jeka (1)
am 23.03.2009 - 09:45 Uhr in
  • Tipps & Tricks
  • Drupal 6.x

Hallo,
wir arbeiten an der Erstellungen einer Homepage.Die Seite soll eine sehr umfang-
reiche Sammlung an allgemeinen Informationen, Fakten und Bildern beinhalten.
Als wir uns mit der Frage nach geeigneten Modulen für die Darstellung von
Bildern und zur Bildverwaltung beschäftigt haben, kamen wir zu dem Schluß, das es
bisher kein einzelnes Modul gibt, das unseren Anforderungen entspricht.
Nach vielen Tests und Versuchen haben wir eine Lösung gefunden, von der wir glauben,
das sie auch für andere User sehr nützlich sein könnte. Desshalb möchten wir unsere
Lösung hier vorstellen und hoffen auf Feedback.
Unsere Anforderungen waren:
1.)
In einem 3-spaltigen Layout, das auf dem "Garland-Theme" basiert, sollte zu jedem
Text, der in der mittleren Hauptspalte dargestellt wird, in der rechten Seiten-
leiste eine Reihe von Vorschaubildern (Thumbnails mit der Auflösung 180 x 180 px)
dargestellt werden, die durch anklicken in einem Bildfenster in Originalgröße zu
sehen sein sollten. Dazu sollte jeweils ein Vorschaubild (Preview mit der Auflösung
500 x 500 px) ober- und unterhalb des Textes stehen, welches durch Anklicken ebenfalls
in Originalgröße angezeigt werden soll.
2.)
Da die Inhalte der Seite von verschiedenen "Redakteuren" gepflegt werden, sollte
eine einheitliche, leicht zu bedienende Bildverwaltung geschaffen werden, die
auch "fachfremde" User sofort verstehen.

Zur Erfüllung dieser Anforderungen werden 4 Module benötigt: Lightbox2, IMCE,
IMCE CCK Image und Image Cache. Lightbox2 ermöglicht dabei die Darstellung des
Originalbildes in voller Größe in einem über dem eigentlichen Inhalt "schwebenden"
Fenster. IMCE und IMCE CCK Image ermöglichen das Einrichten von Bildfeldern in der
rechten Seitenleiste sowie eine einfache Verwaltung und Bedinung durch den IMCE-Browser
beim Bild-Upload. IMCE nuzt dabei das Modul Image Cache.
Die einzelnen Anforderungen wären damit gelöst, das Problem bestand aber darin,
das IMCE nicht mit Lightbox2 zusammenarbeitet, d.h. man kann zwar wie in unserem
Fall Vorschaubilder auf der rechten Seitenleiste oder über bzw. unter dem Text
darstellen, diese jedoch nicht durch Anklicken in einem Lightboxfenster anzeigen.
Was wir also brauchten, war ein "Lightboxtrigger", der in IMCE integriert ist.
Dazu muss man eine Datei des Moduls IMCE CCK Image, welches für die Erstellung von
Bildfeldern verwendet wird, leicht modifizieren. Diese Datei befindet sich im
Modulverzeichnis der Seite (/sites/all/modules/imceimage)und heisst "imceimage.module".
Diese Datei also mit einem Editor öffnen und folgenden Abschnitt suchen:

function theme_imceimage_image($s, $w='', $h='', $a='', $id='') {
    $s = 'src="'. $s .'" ';
    $a = 'alt="'. $a .'" ';
    $id = !empty($id)? 'id="'. $id .'" ':'';
    $w = !empty($w)? 'width="'. $w .'" ':'';
    $h = !empty($h)? 'height="'. $h .'" ':'';
    return '<img '. $s . $a . $w . $h . $id .'/>';
}

Unter der Annahme, dass IMCE Prefixe und Suffixe etwa so "thumb_", "_thumb",
"preview_", "_preview" aussehen, diese Zeilen durch folgenden Code ersetzen:

function theme_imceimage_image($s, $w='', $h='', $a='', $id='') {
  $thpr = array("thumb_", "_thumb", "preview_", "_preview");
  $bigimage = str_replace($thpr, "", $s);
  $s = 'src="'. $s .'" ';
  $a = 'alt="'. $a .'" ';
  $id = !empty($id)? 'id="'. $id .'" ':'';
  $w = !empty($w)? 'width="'. $w .'" ':'';
  $h = !empty($h)? 'height="'. $h .'" ':'';
  $c = 'rel="lightbox"';
  return '<a href='.$bigimage.' '.$c.'><img '. $s . $a . $w . $h . $id .'></a>';
}

Diese Änderungen ermöglichen eine Zusammenarbeit der Module "IMCE Image" und "Lightbox2",
die vorher nicht möglich war. Es wurden drei zusätzliche Variablen in den Code
eingefügt:
1. $c diese Variable beinhaltet den "Lightboxtrigger";
2. $bigimage diese Variable wird mit dem Pfad zur Original-Bild-Datei gefüllt;
3. Die Hilfsvariable $thpr, welche die Vor- bzw. Nachsilben laut IMCE Einstellungen,
in unserem Fall "thumb_" und "preview_", beinhaltet.
Zuletzt wurde noch die Ausgabe der Funktion durch die Zeile:

return '<a href='.$bigimage.' '.$c.'><img '. $s . $a . $w . $h . $id .'></a>'

geändert. Dadurch wird die Preview bzw. Thumbnail auf die Originaldatei verlinkt
und mit dem Lightboxtrigger versehen.
Nun muss man lediglich auf der Seite selbst noch die nötigen Einstellungen für
IMCE vornehmen, die Felder einrichten, die Blöcke auf der rechter Seite aktivieren
und die nötigen Rechte vergeben.

‹ ein bischen mehr Speed! Erste Schritte mit Zen ›
  • Anmelden oder Registrieren um Kommentare zu schreiben

Benutzeranmeldung

  • Registrieren
  • Neues Passwort anfordern

Aktive Forenthemen

  • Komplexe Layouts per Drag & Drop mit Layout Paragraphs
  • Reload der vollständigen Seite
  • [doch nicht gelöst] View zeigt unter Felder falsche Werte
  • Die Splash Awards Deutschland und Österreich sind zurück!
  • [gelöst] Views in Seite einbetten
  • Fehler nach Drupal Core Update auf 7.91
  • (Gelöst) Taxonomie Beziehungen ausblendbar im Backend?
  • Suche Upgradeempfehlungen einer existenten Drupal7 Site auf 9/10?
  • Develop Custom Field in Views
  • Wie View mit einem Array von ids filtern?
  • Wie befülle ich den Cache automatisch? [gelöst]
  • [gelöst] "EntityMetadataWrapperException: Invalid data value given." für Datum-Feld in Webform
Weiter

Neue Kommentare

  • Sehr interessanter und
    vor 2 Stunden 43 Minuten
  • Works as designed – Erwartetes Verhalten
    vor 2 Tagen 1 Stunde
  • Welcher Fehler wird im Drupal
    vor 2 Tagen 17 Stunden
  • Zu früh gefreut. Jetzt
    vor 2 Tagen 18 Stunden
  • Filterkriterien » Hinzufügen » Kategorie » webformulareingabe
    vor 2 Tagen 19 Stunden
  • Müsste da noch ein Filter auf
    vor 2 Tagen 23 Stunden
  • Hast Du mal die Ausgabe des
    vor 2 Tagen 23 Stunden
  • Hab jetzt noch mal neu ein
    vor 3 Tagen 13 Minuten
  • Kann es sein, dass noch ein
    vor 4 Tagen 4 Stunden
  • Lösung
    vor 4 Tagen 15 Stunden

Statistik

Beiträge im Forum: 247950
Registrierte User: 19628

Neue User:

  • vagneralex3
  • zahid hasan
  • Davidenabs

» Alle User anzeigen

User nach Punkten sortiert:
wla9218
stBorchert6003
quiptime4972
Tobias Bähr4019
bv3924
ronald3845
md3717
Thoor3678
Alexander Langer3416
Exterior2903
» User nach Punkten
Zur Zeit sind 0 User und 7 Gäste online.

Hauptmenü

  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche

Quicklinks I

  • Infos
  • Drupal Showcase
  • Installation
  • Update
  • Forum
  • Team
  • Verhaltensregeln

Quicklinks II

  • Drupal Jobs
  • FAQ
  • Drupal-Kochbuch
  • Best Practice - Drupal Sites - Guidelines
  • Drupal How To's

Quicklinks III

  • Tipps & Tricks
  • Drupal Theme System
  • Theme Handbuch
  • Leitfaden zur Entwicklung von Modulen

RSS & Twitter

  • Drupal Planet deutsch
  • RSS Feed News
  • RSS Feed Planet
  • Twitter Drupalcenter
Drupalcenter Team | Impressum & Datenschutz | Kontakt
Angetrieben von Drupal | Drupal is a registered trademark of Dries Buytaert.
Drupal Initiative - Drupal Association