Standard-Schriftart im TinyMCE verändern

[Fachinger]

Guten Tag,

gibt es eine Möglichkeit, die Schriftart im TinyMCE zu verändern? Als Standard wird in einem Text-Element Arial mit 10px verwenet.
Mein Problem ist, dass ich im Textfeld eine Tabelle erstellt habe und hieraus ein Style mit den entsprechenden Parametern an das FE geliefert wird.

"<span style="font-size: 15pt; font-family: arial,helvetica,sans-serif;"> 65552 Limburg<br><br></span>"

Ich sehe im Moment keine Möglichkeit, auf die Schriftart und Größe einzugreifen. Hat jemand eine Idee?

Ich verwende CT 3.5.12

Vielen Dank

[harley-rider]

Ich habe die Tiny Erweiterung installiert, da kann ich die Schriftart ändern.
Du kannst die Änderung auch mit CSS für die Tabelle machen.

[clavis]

Grundsätzlich hast du zwei Möglichkeiten eigene Stile in TinyMCE unterzubringen:

Variante 1:
Du schreibst die Stile welche du brauchst in die files/tinymce.css, und aktivierst in deinem Layout das "TinyMCE-Stylesheet". Dann findest du alle dort definierten Klassen im TinyMCE unter Format -> Formate -> files/tinymce.css und kannst sie ganz normal zuweisen. Die Datei wird auch im BE eingebunden.

Variante 2:
Falls du keine fixen Stile hast, sondern jedes mal spontan entscheiden musst welche Größe, Farbe, Schriftart ein Teil das Textes hat kannst du auch
die Datei system/config/tinyMCE.php kopieren, und ihr einen Namen deiner Wahl geben (z.B. tinyFormat.php).
in der system/config/dcaconfig.php trägst du dann folgendes ein

$GLOBALS['TL_DCA']['tl_content']['fields']['text']['eval']['rte'] = 'tinyFormat'; 

(das gilt dann für alle Contentelemente vom Typ "Text")
Jetzt ist deine tinyFormat.php die aktive Konfiguration für den TinyMCE, und du kannst die Datei bearbeiten. Um eine Auswahl für die Schriftarten zu bekommen kannst du dann z.B. in Zeile 48 umschreiben zu

toolbar: 'fontselect fontsizeselect | link unlink | image | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | undo redo | code'

Dann bekommst du die Dropdowns für Schriften und Schriftgrößen. (Eine komplette Liste der möglichen Buttons gibt es hier https://www.tinymce.com/docs/advance...oolbarcontrols )
Diese Listen befüllen kannst du dann, indem du z.B.

font_formats: 'Arial=arial,helvetica,sans-serif;Courier New=courier new,courier,monospace',
fontsize_formats: '10pt 11pt 12pt 15pt 20pt',

irgendwo über der toolbar-Zeile einfügst. Mit ein wenig Spielerei kannst du dir so den Editor fast vollkommen personalisieren.

lg
clavis

[Fachinger]

@harley rider

Danke für Deine Antwort.
Über eine einfach Definition der Klasse kann ich das in dieser Anweisung aber doch nicht ändern, da die Schriftfamilie als Style mitgeliefert wird, oder irre ich mich da?

[Fachinger]

@clavis:

Danke, hat super funktioniert!

Steffen

[Andreas]

Sorry, aber ich habe das jetzt so verstanden, dass du diese Schriftart im FE brauchst. Dazu musst du überhaupt nichts machen, außer in deine CSS-Dateien das hier zu schreiben.

.meine_tabelle {
  font-family: Arial;
  font-size: 16px;
}

Ich schreibe das deswegen, damit du nachher nicht diese BRs, SPANs und inline-Styles (style="") im FE hast. Diese Sachen solltest du im Tiny alle entfernen.

[clavis]

Das ist natürlich mit Sicherheit die professionellste Variante, da es so den saubersten HTML-Output im FE gibt, aber bei großen Textblöcken oder wild verschachtelten Tabellen dauernd in die Sourcecode-Ansicht vom TinyMCE reinzumüssen ist minder witzig. Außerdem wird so die Formatierung im BE nicht angezeigt, was das debuggen manchmal ziemlich mühsam gestaltet - vor allem wenn es sich nicht um ganze Tabellen, oder Blöcke handelt, sondern irgendwelche spans im Fließtext.
Aber grundsätzlich hast du natürlich recht.

lg
clavis

[tab]

Wo habt ihr die ganzen spans im Quelltext her? Da müssen doch irgendwo die Werte gesetzt werden . Bei mir entsteht so ein span nur, wenn ich einen Textbereich auswähle und irgendwelche Eigenschaften zuweise, ansonsten ist es das ein ganz normaler Absatz, also p-Tag und da steht dann halt der Text drin, ohne irgendwelche spans.

[Fachinger]

OK, Asche auf mein Haupt.
Die ganzen spans kamen wiklich daher, dass ich den Text einkopiert atte - bin halt manchmal faul. ;-)

Der Tipp war für mich trotzdem Gold wert.

Steffen

[Andreas]

Eigentlich solltest du am besten gar keine Tabelle im RTE anlegen, sondern das CE Typ Tabelle benutzen. Hast du umfangreiche Tabellen, dann solltest du diese Daten in einer DB-Tabelle pflegen und über ein Template sauber ausgeben. Tabellen im RTE anzulegen gibt irgendwie immer nur Mist. Bei meinen Kunden habe ich das z.B. im Tiny entfernt, genauso wie auch das mit den Schriftarten, Farben usw. Das einzige was sie bekommen sind mehr oder weniger die HTML-Tags und CSS-Klassen, welche ich ihnen nach Bedarf anlege. Wenn du dennoch eine Tabelle im RTE anlegen möchtest, empfehle ich dir die Tabelle in deinem Editor zu pflegen und dann in die HTML-Ansicht des RTEs einzufügen.

[Fachinger]

Hallo Andreas,

das ist sicherlich die sauberste Lösung . wenn da nicht einige Hürden wären,

a) Ich arbeite erst seit drei Wochen mit Contao (ist wahrscheinlich die größte Hürde ;-) :-D )
b) bekomme ich nur schwer ein Bild in das Tabellenmodul
c) ist diese Seite rein statischer Natur, soll also einfach nur responsiv sein.

Notfalls werde ich alle einfach in normale Textblöcke mit integriertem Bild packen und hoffe, dass es nicht zu unerwarteten Darstellungen kommt.

Steffen

[Andreas]

Bevor du überhaupt eine Tabelle anlegst, solltest du dir überlegen, ob das wirklich tabellarische Daten sind, welche da rein sollen, also sowas wie ne Calc-Tabelle, eine Zeile mit Überschriften und dann pro Zeile ein "Datensatz".

Wenn du die Tabelle nur haben möchtest, weil du etwas in Zeilen und Spalten darstellen möchtest, dann solltest du das nicht mit Tabellen machen.

zu a) Da kann ich jetzt keine Rücksicht drauf nehmen
zu c) Das verstehe ich nicht.

zu b) Da gibt es eine Erweiterung, welche den Tiny in das Tabellen-Element bringt (per Doppelklick auf die einzelnen Zellen)
https://contao.org/de/erweiterungsli...e4ward.de.html
https://github.com/psi-4ward/table4ward - neuere Version

Wenn die nicht funktionieren, habe ich diese Woche noch vom Entwickler empfohlen bekommen, kannst du diese hier versuchen
https://github.com/terminal42/contao-rte_table

Wenn du die Composer-Erweiterungsverwaltung nicht benutzt (tu ich auch nicht), dann schau bei den Erweiterungen auf Github immer in die composer.json, dort findest du die Requirements (Contao-Version, andere erforderliche Erweiterungen...). Du kannst diese Erweiterungen dann manuell installieren. Ordner nach system/modules/ und im BE in der Erweiterungsverwaltung die DB aktualisieren.

[Fachinger]

Hallo nochmal,

jetzt habe ich die ganzen "ce_text"-Blöcke überarebitet und auch alle unsichtbaren Formatierungen im Code-Editor entfernt, das Styling über die CSS klappt jetzt auch tadellos. Ist zwar jetzt erst mal mehr Arbeit, dafür aber natürlich im Nachhinein wesentlich fexibler. Macht alles seinen Sinn. ;-) :-D

@Andreas:
Mit "statisch" meinte ich, dass sich an der Seite im Gesamtlayout nicht dauernd etwas ändert, also nicht dauernd neue Artikel eingefügt werden.

Steffen