Haftpflicht Blogger
Virtual Server von Host Europe

FCKeditor ohne die lästigen <p> Textabsätze

| 6. Juli 2009 | Keine Kommentare

Bei einem ganz normalen Zeilenumbruch setzt der FCKeditor immer ein Textabsatztag <p>…..</p> um den eingegebenen Text. Dieses Absatztag <p> bewirkt in Serenpidity einen doppelten Zeilenabstand bis zur nächsten Zeile. 

   Im Normalfall möchte man aber, dass der Verfasser eines Artikels die Zeilenschaltung ganz normal wie bei jedem anderen Textverarbeitungsprogramm benutzen kann und der Cursor sich auf den Anfang der nächsten Zeile positioniert.

Inhaltsverzeichnis

Screenshots mit und ohne <p> Tags

Bevor ich auf die möglichen Lösungen eingehe, zunächst einmal zwei Screenshots um die Ausgangslage und das Primärziel zu verdeutlichen. Im linken Screenshot kommt die Standardeinstellung mit  aktiven <p> Tags zu tragen, Nach der Überschrift und nach dem Zeilenumbruch im Text wird sofort ein doppelter Zeilenumbruch umgesetzt. Dies bewirkt meines Erachtens, dass der Text sehr stark verzerrt wird.

Lorem Ipsum (einzeiliger Abstand)

Simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when …
    It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

Lorem Ipsum (zweizeiliger Abstand)

Simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when …

    It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.

Lösung 1: CSS-Stylesheet ändern

Man kann die CSS-Stylesheet Definition für <p> so ändern, dass grundsätzlich keine doppelte Zeilenschaltung mehr erfolgt. Damit wird weiterhin bei jedem Betätigen der Zeilenschaltung ein <p>…</p> um den zuvor eingegebenen Text geschrieben.

Nachteil dieser Vorgehensweise:

  • Man hat keine Absatzformatierung mehr.

Mit dieser Einschränkung kann man sicherlich leben, da man ja einfach durch zwei Zeilenschaltungen hintereinander wieder das gleiche optische Bild erhalten kann wie zuvor.
   Was mich aber an dieser Lösung mehr stört, ist, dass das <p> Tag zwar wirkungslos ist, aber wer sich den erzeugten Quellcode der HTML-Seiten einmal anschaut, wird sich wundern, wieviel dieses <p> Tag-Mülls in einem Artikel dann steht.  Unter schlanken, sauberen HTML Code verstehe ich eigentlich etwas anderes.  

Lösung 2: <p> Tag ergänzen

Natürlich könnte man sich jetzt viele Klassen für das <p> Tag überlegen, so auf die Art
   <p class="AbsatzUeberschrift">
   <p class="TextinternerAbsatz">
u.s.w.
Aber das artet auch in einer ziemlichen Friemelei und Handarbeit am Quellcode aus und scheint mir daher für den Alltagsgebrauch nicht geeignet. Außerdem könnte man dann ja auch gleich anstatt <p class="AbsatzUeberschrift"> ein Blockelement <div class="AbsatzUeberschrift"> anlegen.

Lösung 3: Standardverhalten des FCKeditors ändern

In der Konfigurationsdatei fckconfig.js des FCKeditors kann eingestellt werden, wie der FCKeditor einen Zeilenumbruch umsetzt. Hierfür scheint es drei Möglichkeiten zu geben: <p>, <div>  und <b />.

Defaultmäßig steht diese Umsetzung auf <p> und es wird die Empfehlung ausgesprochen, dies auch so zu belassen.
Der Hintergrund für diese Empfehlung scheint mir semantischer Natur zu sein. Inline-Elemente wie Bilder sollten immer in Block-Elementen stehen!  Deaktiviert man die <p> Tag Grundeinstellung, dann nimmt man das Blockelement weg und wir könnten invaliden HTML-Code erzeugen, die die DocType strict-Kriterien nicht erfüllen. Deshalb ist dieser Rat zunächst einmal richtig und vollkommen angebracht. 

Serendipity bindet die FCKeditor Felder jedoch so ein, dass es um diese das DIV-Tag
<div class="entry-content serendipity_entry_body">
            …. Text des FCKeditor Feldes
     </div>
legt.

Mit einem <div> wird jedoch ein allgemeines Block-Element eingeleitet und damit besteht keine Notwendigkeit mehr, im FCKeditor Feld selbst nochmals um jedes Textfeld ein Blockelement wie <p> oder <div> zu legen. 

Wir können also im Blogprogramm Serendipity ruhigen Gewissens in der Konfigurationsdatei fckconfig.js das Verhalten bei einem Zeilenumbruch auf die Erzeugung eines HTML-Zeilenumbruchs <br /> einstellen.


Durch die Einstellung ShiftEnterMode auf Absatz steht dem Verfasser eines Artikels nach der Veränderung der Gundeinstellung auch diese Darstellungsoption weiterhin auf einfache Weise zur Verfügung.

Fallstricke

1. Die richtige Konfigurationsdatei nehmen

Nach der Standardinstallation befanden sich auf meinem System drei Dateien fckconfig.js.
locate fckconfig.js
/../serendipity_event_fckeditor/fckconfig.js
/../serendipity_event_fckeditor/fckeditor/editor/_source/internals/fckconfig.js
/../serendipity_event_fckeditor/fckeditor/fckconfig.js
Damit die folgende Änderung auch greift, sollte man natürlich die Änderung  in der Datei machen, die auch vom FCKeditor innerhalb von Serendity  verwendet wird. Neben dem Nicht-Leeren des Browsercaches dürfte das vermutlich die häufigste Fehlerquelle sein, warum viele keine Auswirkung auf die Änderung Ihrer Einstellungen sehen.

2. Browsercache leeren oder System neu starten, damit die Änderung wirksam wird

Browsercache leeren (Internet Explorer) CTL+F5
Browsercache leeren (Firefox, Mozilla) Shift+CTRL+R

Kategorie: Serendipity

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Diese Website verwendet Akismet, um Spam zu reduzieren. Erfahre mehr darüber, wie deine Kommentardaten verarbeitet werden.