Wenn die Advanced-Toolbar für den Editor aktiviert ist, ist auch die Combo-Box für die Auswahl der Styles aktiviert. Diese Auswahlliste enthält etliche Einträge, die so nicht immer gewünscht sind,

Sie können den Inhalt dieser Auswahlliste selbst bestimmen.
Sie finden die Konfigurationsdatei default.jsfür diese Auswahl im Verzeichnis GetSimpleVerzeichnis/admin/template/js/ckeditor/plugins/styles/styles/

Diese Datei ist allerdings komprimiert, sodaß es sehr schwer ist, sie zu bearbeiten. Zudem befindet sie sich ja in einem Verzeichnis, das bei jeder Aktualisierung, bei jedem Update wieder überschrieben wird.

Laden Sie sich deshalb eine umkomprimierte Fassung dieser Datei von der CKEditor-Homepage herunter.

Speichern Sie sie nach der Bearbeitung in einem Verzeichnis, wo sie nicht wieder überschrieben werden kann, z.B. im /data- oder im /themes-Verzeichnis.

Anschließend schreiben Sie noch in die gsconfig.php, daß nun eine andere Definitionsdatei geladen werden soll.

define('GSEDITORTOOL', 'advanced');
define('GSEDITOROPTIONS',"stylesSet: 'default:http://www.testdomain.de/data/ckeditorstyles.js' ");

Der Name der Datei ist frei definierbar. Der Pfad zu dieser Datei kann entweder wie hier absolut, aber auch relativ eingetragen werden.

Das Styleset für den Editor enthält Definitionen für

• Block-Styles (diese sind standardmässig definiert, können aber überschrieben werden)
• Inline-Styles
• Objekt-Styles

Tragen Sie in der Datei an der Stelle, an der Ihre Definition angezeigt werden soll ein. Die Syntax hierzu lautet.

{ name : 'Computer Code', element : 'code' },

oder

{ name : 'Marker: Yellow', element : 'span', styles : { 'background-color' : 'Yellow' } },

oder auch

{
  name : 'Image on Left',
  element : 'img',
  attributes :
  {
   'style' : 'padding: 5px; margin-right: 5px',
   'border' : '2',
   'align' : 'left'
  }
}

Pro Definition werden mindestens 2 Parameter erwartet: name und element. Der Name ist natürlich frei vergebbar, bei element tragen Sie das HTML-Element ein, das in den HTML-Text eingebunden wird, wenn Text im Texteingabebereich markiert und der entsprechende Eintrag in der Styles-Combobox aktiviert wurde.

So ist es möglich, oft genutzte Formate mit sprechenden Namen in der Auswahl-Liste einzubinden, nicht genutze Einträge können Sie natürlich auch aus der Liste löschen.

Der 3. Parameter regelt, ob Sie HTML-Attribute oder CSS-Definitionen definieren möchten.

Ein Beispiel für ein HTML-Element:

{name:'TabZelle oben',element:'td',attributes:{'valign':'top'}},

Ein Beispiel für eine CSS-Definition:

{name:'Rote Tabelle',element:'table',styles:{'background-color':'red'}},