Bevor wir jetzt loslegen können und unsere ersten Beiträge erstellen können, sollten wir uns ein wenig mit unserem Werkzeug dem Tiny MCE beschäftigen und diesen an unsere Bedürfnisse anpassen. Ein Handwerker der sein Werkzeug kennt und damit umgehen kann ist viel produktiver als jemand der der zwar das beste Werkzeug an der Hand hat aber damit nicht weiß umzugehen.
Wo finden wir die Konfiguration des TinyMCE?
Wir loggen uns in unser Joomla Kontrollzentrum ein und navigieren über
Erweiterungen / Plugins
zu den selbigen. Hier werden uns sämtliche Plugins die momentan in Joomla installiert sind angezeigt, egal ob diese aktiviert oder deaktiviert sind. Da sich diese Aufzählung über mehrere Seiten erstreckt, ist es sinnvoll die oben angebrachte Suchfunktion zu benutzen. Wir suchen nach dem Eintrag „Editor-TinyMCE“, für die Suche reicht jedoch der Suchbegriff „tinymce“
In den Suchergebnissen wird jetzt nur noch ein Treffer angezeigt, und auf diesen klicken wir mit der linken Maustaste.
Den TinyMC-Editor konfigurieren
Jetzt öffnet sich die Konfigurationsebene des Plugin und wir bekommen die Info, dass TinyMCE ein plattformunabhängiger, web-basierter JavaScript HTML-WYSIWYG-Editor ist. Die Buchstaben WYSIWYG bedeuten ausgeschrieben „what you see is what you get“ und übersetzt heißt dies „Was Du siehst ist was Du bekommst“. Das bedeutet, dass TinyMCE so funktioniert wie Beispielsweise ein Textverarbeitungsprogramm auf unserem Computer, dort sehen wir ebenfalls sofort wenn wir eine Textpassage formatieren, wie diese später auf unserem Ausdruck aussehen wird. Genauso verhält es sich auch mit einem WYSIWYG-Editor. Was natürlich die Verwendung erheblich vereinfacht, zumindest für Anfänger und Einsteiger.
Joomla bietet auch noch einen anderen Editor an, der nennt sich „CodeMirror“ und in diesem Editor muss man den Text mit HTML-Tags (gesprochen „Tägs“ aus dem englischen) auszeichnen um die gewünschte Formatierung zu erhalten. Hier 2 Bilder der beiden Editoren die den Unterschied schnell veranschaulichen sollten.
Widmen wir uns wieder der Konfiguration unseres TinyMCE, gleich unter der Beschreibung finden wir einen Bereich der uns sämtliche zur Verfügung stehenden Schaltflächen aufzeigt die der Editor mitbringt. Aus diesem Portfolio können wir uns bedienen wenn wir uns unsere eigenen Menüleisten zusammenstellen, wir werden wahrscheinlich nicht sämtliche Funktionen benötigen die uns der Editor bietet. Damit wir später effektiv arbeiten können werden wir uns nur die anzeigen lassen die für uns von Bedeutung sind.
Die Voreinstellungen anpassen
Im nächsten Abschnitt finden wir bereits vordefinierte Voreinstellungen die wir auf unsere Bedürfnisse weiter anpassen können.
Sehen wir uns die „Voreinstellung 2“ mal genauer an! Was uns sofort auffallen wird, ist, dass die zur Verfügung stehenden Schaltflächen recht übersichtlich sind. Es werden nur 8 Schaltflächen angezeigt, gleich darunter finden wir ein Feld mit der Beschriftung „Voreinstellung zuweisen“ links daneben sehen wir welcher Benutzergruppe diese Einstellungen zugewiesen wurden. Momentan ist nur eine Benutzergruppe dieser Einstellung hinzugefügt, nämlich die Benutzergruppe „Public“. Diese Benutzergruppe beschreibt die Besucher unserer Webseite die sich noch nicht registriert haben oder noch nicht mit ihrem Benutzernamen und Passwort einloggten. Diese Benutzergruppe hat die geringsten Rechte auf unserer Seite, daher stehen dieser Gruppe, wenn überhaupt, nur sehr spärliche Möglichkeiten für die Textformatierung zur Verfügung. Hier sei auch noch angemerkt, dass man einer Voreinstellung auch mehrere Benutzergruppen zuweisen kann, das werden wir aber gleich noch sehen.
Schalten wir auf die „Voreinstellung 1“ und sehen uns diese mal genauer an.
Es fällt uns sofort auf, dass die Benutzergruppen die dieser Voreinstellung zugewiesen wurden, wesentlich bessere Möglichkeiten für die Textformatierung zur Seite gestellt bekommen als die der „Voreinstellung 2“. Die Benutzergruppen die dieser Voreinstellung zugewiesen wurden sind hier die „Manager“ und die „Registered“. Da wir jedoch auf unserer Seite als „Super User“ unterwegs sind, ist auch diese Voreinstellung nicht die richtige für uns. Wir schalten also weiter zur „Voreinstellung 0“.
Diese Voreinstellung beinhaltet alles was und TinyMCE bieten kann. Dieser Voreinstellung wurden die Benutzergruppen „Administrator“, „Editor“ und „Super User“ zugewiesen, das bedeutet, dass die Einstellungen die wir hier vornehmen dann tatsächlich auch uns betreffen. Jetzt können wir Anfangen unsere Menüs und Schaltflächen so zu ordnen wie wir es bevorzugen. Ich persönlich habe mich bei meinem Aufbau daran orientiert wie die Schaltflächen in dem Textverarbeitungsprogramm angeordnet sind in dem ich normalerweise meine Texte verfasse. Somit erspare ich mir das ständige Suchen in den Schaltflächen, da jedes circa an der Stelle liegt an der ich es gewohnt bin. Bevor Du jetzt loslegst und per Drag & Drop Deine Menüs und Schaltflächen an Deine Bedürfnisse anpasst, möchte ich noch schnell Deine Aufmerksamkeit auf eine kleine Leiste lenken, die sich über Deiner Menü- bzw. Werkzeugleiste befindet
Mit dieser Leiste kannst Du auf die Schnelle Deine Menü- und Werkzeugleiste „Leeren“ oder eine der drei anderen Einstellungen zur weiteren Anpassung übernehmen. Probiere es aus, Du wirst sehen, dass es recht intuitiv zu bedienen ist. Solltest Du jetzt etwas vergessen was Du später beim Bearbeiten Deiner Texte benötigst, ist das gar kein Problem, diese Einstellungen hier kannst Du jederzeit an Deine Bedürfnisse anpassen.
Allgemeine Einstellungen des TinyMCE
Im folgenden Bild markiere ich die Einstellungen auf die ich gleich noch eingehen werde, keine Sorge es sind nur die Wichtigsten, eine komplette Beschreibung des TinyMCE findest Du unter: https://www.tiny.cloud/docs/tinymce/6/
Mobilmodus – Dieser Modus wird auf mobilen Geräten aktiviert, damit man die einzelnen Schaltflächen besser bedienen kann. Wer diesen Modus nicht benötigt kann ihn auch deaktivieren.
Drag & Drop für Bilder – Hier wird die Drag & Drop Funktion für Bilder in Beiträgen aktiviert oder deaktiviert, wer dies nicht benötigt kann auch hier auf „Aus“ stellen.
Bilderverzeichnis – Wenn die Drag & Drop Funktion in Beiträgen aktiviert ist, dann muss man hier das Bilderverzeichnis eintragen, damit TinyMCE weiß wohin der die Bilder hochladen soll. Ich persönlich benutze immer verschiedene Verzeichnisse damit ich auch bei vielen Bildern die Übersicht behalte, daher ist diese Funktion bei mir immer deaktiviert.
Entity-Kodierung – diese Option bitte nicht verstellen und auf „Raw“ belassen, es kann sonst zu Fehlern in der Suche kommen.
Autom. Sprachauswahl – wenn eingeschaltet übernimmt der Editor automatisch die für den Benutzer eingestellte Sprache, sollte die Sprache nicht installiert sein, wird auf Englisch zurückgegriffen.
Textrichtung – Wir schreiben von links nach rechts und daher wählen wir auch diese Option.
URLs – wie sollen URLs eingefügt werden? Wenn in der internen Verlinkung absolute URLs ausgeführt werden, so wird die komplette URL aufgeführt:
absolute URL:
<a href=“https://www.tutorialgarage.com/joomla.html“>Was ist Joomla?</a>Bei absoluten URLs wird der komplette Pfad inklusive der Domain zum verlinkten Dokument hinterlegt:
relative URL:
<a href=“/joomla.html“>Was ist Joomla?</a>Bei relativen URLs wird hingegen lediglich der Pfad zum verlinkten Dokument hinterlegt:
Beide Formen lassen sich gleichermaßen zur internen Verlinkung nutzen. Vor und Nachteile besprechen wir an einer anderen Stelle.
Neue Zeilen – ich empfehle jedem diese Einstellung auf <p> zu belassen, somit hat man beim Drücken der Entertaste sofort einen neuen Absatz.
Verbotene Elemente – Der folgenden Einstellung ist ein wenig Aufmerksamkeit zu schenken, da ich immer wieder Nachrichten bekomme, dass jemand zum Beispiel keine YouTube Videos in seine Beiträge einbetten kann. Diese Einstellung ist der Grund dafür. Der YouTube Einbettungscode verwendet „iFrame“ und diese sind aus Sicherheitsgründen, standardmäßig deaktiviert. Wenn Du also iFrame auf Deiner Seite verwenden möchtest, dann lösche diesen aus den verbotenen Elementen einfach raus. Falls Du diese später entfernen möchtest, dann achte darauf, dass Du in der richtigen Voreinstellung bist, damit Du nicht versehentlich der falschen Benutzergruppe zu viele Rechte einräumst!
Der Reiter „Erweitert“ und seine Funktion
Ganz oben sehen wir, dass wir uns momentan im Reiter „Plugin“ befinden, rechts daneben sehen wir noch den Reiter „Erweitert“ den ich Dir natürlich nicht vorenthalten möchte.
Wir klicken auf diesen Reiter und öffnen so die Erweiterten Einstellungen
Hier muss ich auf nichts weiter eingehen als auf die Anzahl der Voreinstellungen die man im Reiter „Plugin“ konfigurieren und einer Benutzergruppe zuweisen kann.
Anzahl der Voreinstellungen – Hier kannst Du festlegen, wie viele Voreinstellungen im Reiter „Plugin“ definiert werden können. Sollten Dir drei nicht ausreichen, dann hast Du hier die Möglichkeit die Anzahl zu erhöhen. Diese werden jedoch erst nach einem Klick auf „Speichern“ im Reiter „Plugin“ sichtbar.
Zu guter Letzt habe ich hier noch ein Video aus meinem YouTube-Kanal welches Dich interessieren könnte:
Klicke hier um das Video zu laden!