Drupal 6 - Automatisch unterschiedliche Bildgröße bei Teaser und Artikel

Benötigt bei diesem Tutorial:

* Drupal 6.x
* Imagecache
* CCK
* Imagefield
* Filefield
* ImageAPI

Wie bei Drupal üblich, werden alle aufgeführten Module installiert und aktiviert. Da das Modul ImageAPI entweder ImageAPI GD2 oder ImageAPI ImageMagick benötigt, wähle ich unter Module noch das Modul ImageAPI GD2 und außerdem noch Imagecache UI aus, um mit Imagecache arbeiten zu können.

Neuer Feldtyp Bild in den Inhaltstypen mit dem Modul Imagefield

Unter Startseite › Verwalten › Inhaltsverwaltung "neuen Inhaltstyp hinzufügen" auswählen. Als Name wähle ich Bildbeitrag und als Typ bildbeitrag. Alle anderen Einstellungen können unberücksichtigt und unverändert bleiben.
Auf der folgenden Seite wähle ich im neu erstellten Inhaltstyp die Option "Felder verwalten" Dort gibt es die Möglichkeit ein neues Feld neben den Standardfeldern Titel und Textkörper zu diesem Inhaltstyp hinzuzufügen. Als Bezeichnung wähle ich fü das neue Feld Bild, als Feldname bild, als Datentyp Bild und das Formularelement wird automatisch in das Element Bild umgewandelt.
Im darauf folgenden Screen Bild belasse ich die vorgegebenen Standardeinstellungen und wähle einfach "Feldeinstellungen speichern".

Automatische Bildgrößen mit dem Modul Imagecache

Für dieses Beispiel möchte ich im Teaser ein Bild mit den Abmessungen 150*150 Pixel haben und das Bild soll dann im eigentlichen Beitrag immer 300 Pixel breit sein. Unter Startseite › Verwalten › Strukturierung > ImageCache wähle ich "Add new preset" und lege als erstes die automatische Umwandlung meines Teaserbildes fest. Als Preset Namespace gebe ich den Namen "bild_teaser" ein.

Unter den angebotenen Möglichkeiten von Imagecache wähle ich die Option "Scale and Crop" und gebe den Wert 150 als absolute Abmessung für Höhe und Breite ein. Damit ist das Vorschaubild auch schon fertiggestellt.
Als nächstes kommt das Bild für den Beitrag selbst ins Spiel. Erneut wähle ich unter Startseite › Verwalten › Strukturierung > ImageCache "Add new preset" und lege eine automatische Umwandlung meines Beitragsbildes fest. Als Preset Namespace gebe ich hier den Namen "bild_node" ein.
Da ich hier immer ein Bild mit der Breite von 300 Pixeln haben möchte und das Ursprungsformat beibehalten werden soll, nehme ich dieses Mal die Option "Scale". Für den Weite Wert ( Width) gebe ich 300 ein.

Bildanzeige im Teaser und im Node festlegen

Hierzu nochmal zurück zum erstellten Inhaltstyp Startseite › Verwalten › Inhaltsverwaltung
Bildbeitrag und auf "Felder verwalten". Am oberen Rand der Folgeseite befindet sich auch der Punkt
"Felder anzeigen".

Hier wählen wir nun für das Feld "Bild" bei der Bezeichnung "hidden" aus und für den Anrisstext wähle ich "bild_teaser image linked to node". Und beim vollständigen Beitrag wähle ich bild_node image.

Tja und damit sind alle Vorbereitungen abgeschlossen und es kann an Beiträge mit Bildern gehen, deren Bilder automatisch im richtigen Format und der richtigen Größe angepasst werden.

Abschliessend nur noch im Theme mittels CSS anpassen. Viel Spaß und Erfolg beim Nachbau.

Das Tutorial gibt es auch noch ein wenig ausführlicher mit Bildern auf meinem "Drupal Spielplatz" ...