By Martin Stut, 2010-07-17

Manche der Websites die ich betreue, z.B. die Evangelische Gemeinschaft Marburg-Süd, brauchen die Möglichkeit, Bilder in WYSIWYG-Manier einzubinden. Für deren Benutzer ist es zu umständlich, ein Bild hochzuladen und dann die Bild-URL in ein IMG-Tag zu schreiben.

Der normalerweise von mir bevorzugte Editor (f)ckEditor hat leider im Zusammenspiel mit Drupal keine bequeme Möglichkeit, Bilder einzufügen, aber der Editor Whizzywig hat sie.

Whizzywig installieren

  1. Von http://drupal.org/project/whizzywig das tar.gz-Archiv herunterladen, auspacken und wie üblich das Verzeichnis whizzywig auf sites/all/modules hochladen.
  2. In Verwalten / Strukturierung / Module die bisherigen Editor-Module wysiwyg und ggf. fckeditor stilllegen.
  3. Das Modul Whizzywig (im Rahmen Easy Module) einschalten.
  4. In Verwalten / Einstellungen / Whizzywig / Sichtbarkeit:
    • Haken setzen bei „Enable editor for Comment“ und „Enable Editor for Block“
    • Rahmen "Inhaltstyp": „Don't show editor on this content type“ wählen und das Feld darunter leeren.
    • Rahmen "Textarea ID": „Dont show editor on this content type“ wählen und das Feld darunter leeren.
  5. In Verwalten / Benutzer / Berechtigungen, Rahmen whizzywig-Modul setzen, wer whizzywig nutzen darf:
    • access: alle, die in irgendeiner Form Inhalte erstellen oder ändern dürfen.
    • administer: nur Systemverwalter
    • file und folder: je nach Bedarf; browsen dürfen mehr Leute als deleten.
    • toolbar: full dürfen weniger Leute als basic

Bild einfügen

  1. Die gewünschte Seite aufrufen und in den Bearbeiten-Modus gehen; Cursor an die Stelle setzen, wo das Bild eingefügt werden soll. Wenn das Bild parallel zu einem Absatz erscheinen soll, muss der Cursor vor den Anfang dieses Absatzes.
  2. Klick auf die Schaltfläche "Image" (zwischen Link und Tabelle). Die Werkzeugleiste erweitert sich um die Bild-spezifischen Felder.
  3. Auf "Browse" klicken. Es öffnet sich ein Fenster "Insert or Modify Image"
  4. Klick auf durchsuchen; im lokalen Dateisystem das Bild suchen und doppelklicken. Pfad und Dateiname steht jetzt im Feld "File to upload".
  5. Klick auf "Upload Now". Das Bild wird der Liste im unteren Teil des Fensters hinzugefügt.
  6. Klick auf "Insert" um das Bild in die Webseite einzufügen. Der Drupal-interne Pfad erscheint im Feld "Image address (URL)".
  7. "Alternate text" ausfüllen.
  8. Align wählen (ich nehme gerne right).
  9. Ggf. Border (Rahmendicke, meist 0) und Margin (Abstand zum übrigen Text, z.B. 5) eintragen.
  10. Klick auf "Insert Image". Das Bild erscheint in der Webseite.
  11. Text u.s.w. weiter schreiben, Webseite speichern.