Vorsicht mit copy&paste: Word-Inhalte "zerschießen" Joomla-Webseite

Vorsicht mit copy&paste: Word-Inhalte "zerschießen" Joomla-Webseite

Um die Pflege seiner Website möglichst komfortabel zu gestalten, setzen viele einen WYSIWYG-Editor wie JCE oder TinyMCE ein. Häufig kopiert man dabei auch Texte aus anderen Dokumenten - z.B. aus einer Word-Datei. Das geht ja auch ganz einfach: Text markieren, mit Strg-C kopieren und mit Strg-V in das WYSIWYG-Fenster einfügen. Und genau hier lauert eine böse Falle. Word übergibt beim Kopieren des Textes stillschweigend diverse Formatierungsanweisungen. Diese sind bei eingeschaltetem WYSIWYG allerdings nicht sichtbar. Erst beim Umschalten in den Text-Modus sieht man, was Word neben dem erwünschten Text sonst noch alles mitgeliefert hat: 

 <!--[if gte mso 9]><xml>  <w:WordDocument>   <w:View>Normal</w:View>   <w:Zoom>0</w:Zoom>   <w:HyphenationZone>21</w:HyphenationZone>   <w:PunctuationKerning/>   <w:ValidateAgainstSchemas/>   <w:SaveIfXMLInvalid>false</w:SaveIfXMLInvalid>   <w:IgnoreMixedContent>false</w:IgnoreMixedContent>   <w:AlwaysShowPlaceholderText>false</w:AlwaysShowPlaceholderText>   <w:Compatibility>    <w:BreakWrappedTables/>    <w:SnapToGridInCell/>    <w:WrapTextWithPunct/>    <w:UseAsianBreakRules/>    <w:DontGrowAutofit/>   </w:Compatibility>   <w:BrowserLevel>MicrosoftInternetExplorer4</w:BrowserLevel>  </w:WordDocument> </xml><![endif]--><!--[if gte mso 9]><xml>  <w:LatentStyles DefLockedState="false" LatentStyleCount="156">  </w:LatentStyles> </xml><![endif]--> <!--  /* Style Definitions */  p.MsoNormal, li.MsoNormal, div.MsoNormal      {mso-style-parent:"";      margin:0cm;      margin-bottom:.0001pt;      mso-pagination:widow-orphan;      font-size:12.0pt;      font-family:"Times New Roman";      mso-fareast-font-family:"Times New Roman";} @page Section1      {size:612.0pt 792.0pt;      margin:70.85pt 70.85pt 2.0cm 70.85pt;      mso-header-margin:36.0pt;      mso-footer-margin:36.0pt;      mso-paper-source:0;} div.Section1      {page:Section1;} --> <!--[if gte mso 10]> <style>  /* Style Definitions */  table.MsoNormalTable      {mso-style-name:"Table Normal";      mso-tstyle-rowband-size:0;      mso-tstyle-colband-size:0;      mso-style-noshow:yes;      mso-style-parent:"";      mso-padding-alt:0cm 5.4pt 0cm 5.4pt;      mso-para-margin:0cm;      mso-para-margin-bottom:.0001pt;      mso-pagination:widow-orphan;      font-size:10.0pt;      font-family:"Times New Roman";      mso-ansi-language:#0400;      mso-fareast-language:#0400;      mso-bidi-language:#0400;} </style> <![endif]-->

Diese unerwünschten Anweisungen führten in einem konkreten Fall dazu, dass die Webseite nur noch im Firefox korrekt angezeigt wurde. Ausnahmslos alle anderen Browser schnitten die Seite knapp unter dem Kopfbereich ab oder verstümmelten sie stark, dabei fehlte der Content fast vollständig. Sogar der Microsoft eigene Internet Explorer kam mit dem - immerhin von einem "Schwesterprogramm" - gelieferten Code nicht zurecht. Und auch Opera, Safari oder Chrome zeigten ein ähnliches Bild. Erst nach dem Entfernen dieses Code-Mülls war das Problem behoben.

Tipp: beim Kopieren von Content aus anderen Anwendungen sollte man immer den Weg über die speziellen Einfüge-Funktionen des WYSIWYG-Editors wählen. Am besten man nimmt die Funktion, die nur den reinen Text übernimmt. Man muss dann anschließend zwar etwaige Formatierungen und Auszeichnungen neu setzen, hat aber die Gewähr, dass kein schädlicher Code eingefügt wurde.