TinyMCE img Tag immer mit class="img-fluid"

  • Joomla Version
    5.xxx
    PHP Version
    PHP 8.3.x
    Hoster
    Strato

    Hallo Zusammen,


    Ich baue gerade mein erstes Template für Joomla 5

    Das klappt auch sehr gut

    nur habe ich responsiv Problem


    Wenn ich in einem Beitrag ein Bild einfüge wird das ohne zusätzlicher "Class" aber mit fest im Quellcode geschriebene Größe eingefügt

    Ich nutze den TinyMCE bei dem man ja beim einfügen von Bilder, über die "Joomla -> Medien" Funktion, die Möglichkeit besteht eine Class einzugeben


    Das ist auch sehr gut nur leider wird das gern von den Autoren vergessen und damit sind die Bilder natürlich in der Mobilen Ansicht zu groß


    Nun meine Frage

    Gibt es eine Möglichkeit die "Class" schon vorzu definieren sodass sie bei jedem hinzugefügtem Bild immer dran ist?


    Danke im Voraus


    Gruß

    Marcel

  • Für mich gibt es drei unverzichtbare Erweiterungen auf jeder Website

    Hinsichtlich Akeeba stimme ich zu, Cache Cleaner ist hilfreich, aber nicht notwendig, und JCE ist am Ende auch nur eine weitere Komponente, die gewartet werden muss ohne substantielle Vorteile zu bringen (ich habe JCE sehr erfolgreich gegen TinyMCE ausgetauscht)..


    Zurück zum Thema: das mit den Autoren ist wirklich ein Problem. Da können Anleitungen geschrieben, Hinweise gegeben und auf negative Folgen falschen Handelns hingewiesen werden: es gibt immer jemanden, der meint, dass er es besser weiß. Ganz schlimm ist das bei der Beschränkung auf bestimmte Schrifttypen oder die EInhaltung eines mit der Web-Seite konsistenten Farb- und Designschemas. Leider kann nicht alles über die TinyMCE-Profile oder css abgesichert werden.


    Jetzt zu den Bildern: ich habe den Autoren grundsätzlich erst einmal "Einleitungsbilder" und "Komplete Beitrgasbilder" als erste Wahl empfohlen kann ich über Klassen und css am besten steuern). Dennoch gibt es eine Anleitung für direkt einfügte Bilder, die eigentlich sehr befolgt wird. Seit der Umstellung auf J4 und auch schon davor gab es nie Probleme.


    Allerdings muss dazu gesagt werden, dass ich alle figures und imgs - sofern sie nicht Teil einer Galerie sind - generell auf max-width: 390px gestzt habe. Das sichert eine einheitliches Layout der Webseite. Und für Vergrößerungen aller Bildertypen habe ich ein kleine javascript-Anwendung geschrieben.


    Im Zweifel reicht es sogar figures und imgs unter 992px auf max-width: 90% zu setzen und mittig anzuordnen.

    Wenn ich darüber hinaus weiterhelfen kann, bitte melden.

    Gruß

    Heinz


    "Wer es nicht versucht schafft es auch nicht."

  • Allerdings muss dazu gesagt werden, dass ich alle figures und imgs - sofern sie nicht Teil einer Galerie sind - generell auf max-width: 390px gestzt habe. Das sichert eine einheitliches Layout der Webseite. Und für Vergrößerungen aller Bildertypen habe ich ein kleine javascript-Anwendung geschrieben.

    Das klink sehr interessant

    würdest du mir evtl. den Code (CSS und JS) zur Verfügung stellen?


    Danke im Voraus

    Gruß

    Marcel

  • Rolf bis vor Version 4 habe ich reflexartig auf jeder Seite als erstes JCE installiert.


    Inzwischen überlege ich sehr genau ob es notwendig ist. Natürlich gibt es Features, für die JCE nötig und super nützlich ist.


    Aber JCE ist eine Erweiterung von TinyMCE, und der hat inzwischen sehr aufgeholt.

    So habe ich jetzt auf allen meinen Seiten nur noch TinyMCE und bin froh dass ich mich nicht mehr um die updates des JCE kümmern muss

  • Mann muss einfach mal darüber reden da fehlt einem selber ein was man bei Google suchen muss ;)


    Für alle die auch gern diese Option haben wollen hier der Code-Schnippsel


    Code
    $(document).ready(function(){
        $(".ws-content img").addClass("img-fluid");
    });

    Damit werden innerhalb des "Div" mit der "Class" "ws-content" bei allen "img" die "Class" "img-fluid" hinzugefügt


    Vielen Dank noch einmal für das Brainstorming