Joomla!® User Group Fulda

Der Editor - Einfach nur HTML

Seiten im Internet werden in der Regel in HTML geschrieben. Damit musste ein Redakteur sich bisher mit den HTML-Befehlen (TAGs) und der Schreibweise (Syntax) auseinandersetzen.

{codecitation}

<html>

<head>

  <title>Titel der Seite</title>

</head>

<body>

  <p>Willkommen auf <u>unserer</u> Homepage!</p>

  <p>Wir bieten hier allerhand Informationen f&uuml;r Sie.</p>

</body>

</html>

{/codecitation}

Das Ergebnis dieses Codes sah dann erst einmal wie folgt aus:


Ergebnis des HTML Codes


Es war mühselig damit eine komplette Seite zu befüllen und dann auch noch etwas zum Gestalten und Layouten beizutragen.

Mit Joomla! braucht man sich - eigentlich - über HTML keine Gedanken mehr zu machen. Denn HTML sieht der Redakteur so nicht mehr. Es wäre wünschenswert wenn jeder in der Welt HTML könnte, doch man kommt auch ohne HTML-Kenntnisse weiter.

Um mit Hilfe von Joomla! einen Beitrag zu schreiben, melden sich die Redakteure an Ihrer Seite an, welchseln über das Menü zu den Beiträgen und klicken dann auf die Schaltfläche "Neu". Der neue Beitrag öffnet sich und der Redakteur kann mit der Eingabe des Textes im Editor beginnen.


Neuer Beitrag


Der Standardeditor unter Joomla! ist der "TinyMCE". Der TinyMCE bietet zum Beispiel Zeichenformatierungsbefehle wie "Fett, Kursiv und Unterstrichen". Kennt aber auch Absatzformatierungen wie "Links- oder Rechtsbündig, Blocksatz und Zentriert". Das Schreiben im Editor läuft hier schon fast wie in einem normalen Textverarbeitungsprogramm.

Je mehr Komfort dieser Editor bietet, desto leichter fällt es dem Redakteur später die Beiträge zu schreiben. In den folgenden Beiträgen kümmern wir uns ausschließlich um den Editor. Viel Spaß beim Lesen.

Standardeditor unter Joomla! einstellen

Welcher Editor bei einem Redakteur aktiv ist, bestimmt der Administrator der Seite durch eine von zwei Einstellungen. Zunächst könnt Ihr in der Konfiguration der Seite den Standardeditor für alle Benutzer vorgeben.

 

Joomla - Standardeditor einstellen

 

Joomla! wird mit den Editoren "CodeMirror" und "TinyMCE" ausgeliefert, wobei "CodeMirror" eigentlich "nur" ein "Syntax Hervorhebung" des HTML-Codes durchführt. Der Standardeditor von Joomla! ist der "TinyMCE". Doch schauen wir uns die unterschiedlichen Einstellungen bei den Editoren einmal an.

Einstellen könnt Ihr "Kein Editor", dann sieht das Ganze wie folgt aus:

 

Joomla! - Kein Editor

 

Man könnte meinen, da steht nur "Kauderwelsch", doch der Text da oben ist HTML-Code, nicht sehr schön strukturiert, aber HTML.

Stellt Ihr als Editor den "CodeMirror" ein, ...

 

Joomla! - CodeMirror

 

... wirkt der HTML-Code bereits schöner. HTML-Befehle werden farbig hervorgehoben. Damit lässt sich der Quellcode ein wenig besser lesen (wenn man sowas lesen kann und möchte).

Dann schauen wir uns das noch mit dem"TinyMCE" als Editor an:

 

Joomla TinyMCE als Editor

 

Keine Frage. Ein Editor, wie der TinyMCE, stellt den Text des Beitrags leserlich dar und bietet mit seinen Befehlen (Linksbündig, Zentriert, Rechtsbündig, usw.) einiges, was man von einer Textverarbeitung her kennt. Das Arbeiten mit einem Editor fällt recht leicht, auf jeden Fall leichter, als das Arbeiten mit dem HTML-Quellcode.

Wenn Ihr weitere Editoren installiert (ein Beispiel der Installation von Editoren zeigt der Beitrag "JCE - Ein cooler Editor - Installation") könnt Ihr diesen auch als Standardeditor einsetzen.

 

Jeder Benutzer kann einen eigenen Editor eingestellt bekommen

Die Vorgabe für das System macht Ihr also in der Konfiguration des Systems. Unabhängig von der Vorgabe im System lässt sich für jeden Benutzer ein eigene Editor einstellen.

 

Joomla - Editor für Benutzer einstellen

 

Hier ist der TinyMCE als Editor eingestellt. Egal welche Vorgabe Ihr in der Konfiguration des Systems aus vornehmt, dieser Benuterz ("asterx") wird den TinyMCE bekommen.

JCE - Aktualisieren

Editoren, wir der Joomla! Content Editor, werden ständig weiter entwickelt. Daher ist natürlich ab und zu auch ein Update fällig. Welche Version vom JCE derzeit auf eurem Server installiert ist, könnt Ihr unter Joomla! 1.7 über Erweiterungen > Erweiterungen > Register Verwalten > Filtern nach "JCE" herausfinden (Achtung: Hier im Beitrag gehe ich davon aus, dass Ihr bereits den JCE installiert habt und ihn aktualisieren wollt. Wie der JCE Installiert wird, beschreibt der Beitrag "JCE - Ein cooler Editor - Installation").

In der folgenden Abbildung findet Ihr die Version 2.0.15 auf dem Server installiert vor.

 

JCE - aktuell installierte Version

 

Auf den Seiten des Herstellers (Downloads > Editor > Joomla! 1.7) finde ich die Version 2.0.17. Damit ist klar, ein Update ist fällig.

 

JCE - Aktuelle Version beim Hersteller

 

Ich lade das "ZIP"-Paket herunter und wechsle ins Backend meiner Joomla! Installation. Über "Erweiterungen > Erweiterungen" suche ich (mit Hilfe der Schaltfläche "Durchsuchen") das Installationspaket ...

 

JCE - Aktualisierung einspielen

 

... und starte über die "Hochladen & Installieren" den Aktualisierungsprozess.

 

JCE - Aktualisierung erfolgreich durchgeführt

 

Nach ein paar Sekunden ist das Paket hochgeladen, wird entpackt und installiert. Das würde eigentlich schon genügen. Ich selbst habe jedoch die deutsche Sprachdatei installiert, daher besorge ich mir noch schnell die aktuelle deutsche Übersetzung der Sprachdatei. Dank Hartmut und Sebastian Steuerwald, die sich die Mühe machen die Sprachdatei ständig zu übersetzen, kommen wir schnell an diese aktuelle Version. 

Ladet euch die Datei über http://www.hst-pc.de/joomla-jce-editor.html herunter (in der unteren Abbildung seht Ihr die Spachdatei "JCE Editor, German Translation Ver. 2017" rot eingerahmt).

 

JCE - Aktuelle deutsche Sprachdatei finden und herunterladen

 

 

Nachdem die Datei heruntergeladen ist, wechsle ich wieder ins Backend meiner Joomla! Installation. Die Sprachdatei "de-DE_jce_lang_2017.zip" wird über den JCE eigenen Installer (Komponenten > JCE Administration > Plugins installieren") installier.

 

JCE - Sprachdatei über JCE Installer hochladen

 

Klicke auf Durchsuchen und wählt die Sprachdatei. Dann wird über "Paket installieren" ...

 

JCE - Sprachdatei nun aktuell

 

... die Sprachdatei hochgeladen, entpackt und eingerichtet. Der Installer gibt ein Feedback und zeigt die aktuelle Version (2.0.17) in der Sprachliste an.

Damit habt Ihr den JCE auf dem aktuellen Stand und könnt wieder loslegen.

Geschütztes Leereichen - nbsp - Non-Breaking Space

Beim Schreiben von Texten kommt es manchmal vor, dass man Texte schreibt, bei denen zwei Worte nicht auseinander gerissen werden dürfen (z. B. durch einen Zeilenumbruch ... Straße_Hausnummer). Hier muss dann ein "geschütztes Leerzeichen" her. HTML kennt hier den "Non-Breaking Space" oder kurz "&nbsp;".

Doch wie bekomme ich ein solches geschütztes Leerzeichen zwischen die beiden Worte?

Im Joomla! Standard Editor "TinyMCE" könnt Ihr den Befehl "Insert a non-breaking space character" zum Einfügen eines geschützten Leerzeichen nutzen.

 

TinyMCE - insert a non breakable space - Geschütztes Leereichen einfügen

 

Der Joomla! Content Editor (kurz JCE), hat speziell hierfür eine Schaltfläche: Hier eine Abbildung unter Joomla! 1.7.2 und JCE 2.0.1.5 ...

 

JCE - Non Breakable Space - geschütztes Leerzeichen

 

... und hier die Schaltlfäche im JCE unter Joomla! 1.5.24 und JCE 2.0.15:

 

JCE - Werkzeugleistenansicht Standard - nbsp - Geschützes Leerzeichen

 

Das Symbol sieht in der "Standard"-Werkzeugleistenansicht so aus. Jeder Editor kann diese Optik ändern. So findet man beim JCE dann noch die Werkzeugleistenansicht "Office Blue" ...

 

JCE - Werkzeugleistenansicht Office Blue - nbsp - Geschützes Leerzeichen

 

... oder auch die Ansicht "Classic". In der Ansicht "Classic" sieht das Symbol für das geschützte Leerzeichen dann auch im JCE genau so aus, wie es auch im TinyMCE zu sehen ist.

 

JCE - Werkzeugleistenansicht Classic - nbsp - Geschützes Leerzeichen

 

Damit wird z. B. ein Euro-Zeichen immer beim Betrag bleiben und nicht allein umgebrochen.

Anmeldung

Wer mitmachen möchte schickt uns bitte über das Kontaktformular eine kurze Info mit Eurer E-mail-Adresse und eurem Wunschnamen.

JUG Fulda

JUG Fulda auf Twitter

Tweets von @jugfulda
Copyright © 2013 Joomla!® User Group Fulda. Alle Rechte vorbehalten.
Joomla! ist freie, unter der GNU/GPL-Lizenz veröffentlichte Software.