Spalten erstellen welche sich bei kleineren Bildschirmgrößen stapeln

    Hallo an alle :)


    Vermutlich handelt es sich bei meinem Anliegen um eine dumme Frage, aber ich habe schon lange im Internet und Form gesucht und finde einfach keine Lösung:


    Ich möchte im Joomla Content Spalten erstellen, welche sich bei kleineren Bildschirmgrößen stapeln.


    Wie hier https://www.adiheutschi.ch/sup…beiten-mit-dem-jce-editor (Absatz: Spalten stapeln).


    Meinem Verständnis nach müsste ich eigentlich nur wissen, welchen Code der JCE- Editor für die Spalten generiert und diesen dann für meine Spalten nutzen.

    (Daraufhin habe ich den JCE-Editor installiert, aber es fehlt im Editor der Button für die Spalten ....)


    Hätte jemand einen Tipp für mich mit welchem Code die Spalten generiert werden?


    Vielen Dank im Voraus für Eure Hilfe und liebe Grüße,


    Stefan

    Diese Funktion musst im JCE unter Profile erst in die Iconleiste hinzufügen, sonst steht es Dir nicht zu Verfügung.

    Ich habe es noch nie verwendet. U.U. funktioniert es auch nicht, wenn Du unterschiedliche CSS-Frameworks oder Versionen einsetzt.


    Wie der Code aussieht, siehst Du wenn Du dann auf Quellcode umstellst.

    Hallo Tom,


    vielen Dank für Deine schnelle Antwort und die Unterstützung. Ich habe gerade noch einmal geschaut aber bei mir gibt es diese Buttons komischerweise nicht zur Auswahl:


    Weißt Du wie der Code für Spalten zB beim Standart Prostar Template aussehen würde?


    Mein Problem ist, dass ich im Content noch Tabellen für die Darstellung für Spalten nutze, was natürlich nicht mehr zeitgemäß bzw. responsive ist.


    Vielen Dank.

    Dann gibt es das wohl nur in der Proversion vom JCE.


    Zitat von Stefan0280

    Weißt Du wie der Code für Spalten zB beim Standart Prostar Template aussehen würde?

    Da das Protostar Bootstrap 2 verwendet so: https://getbootstrap.com/2.3.2/scaffolding.html


    2 Spalten gleicher Breite:

    HTML
        <div class="row">
      <div class="span6">...</div>
      <div class="span6">...</div>
    </div>
    Zitat von Stefan0280

    Meinem Verständnis nach müsste ich eigentlich nur wissen, welchen Code der JCE- Editor für die Spalten generiert und diesen dann für meine Spalten nutzen.

    Das reicht nicht. Du brauchst auch noch die passenden CSS-Anweisungen.


    Zitat von Stefan0280

    (Daraufhin habe ich den JCE-Editor installiert, aber es fehlt im Editor der Button für die Spalten ....)


    Den Button für die Spalten gibt es nur in der PRO-Version vom JCE-Editor.



    EDIT:

    Huch! Heute bin ich wieder mal seeeehr langsam unterwegs :D

    Zitat von Stefan0280

    Tipp für mich mit welchem Code die Spalten generiert werden

    Ich erlaube mir mal, da Erkenntnisse ausschließlich aus der Free-Version stammen:

    Zitat von anka

    Du brauchst auch noch die passenden CSS-Anweisungen.

    Die lädt JCE auch in der Free-Version im Frontend, falls nicht explizit deaktiviert im Plugin "System - JCE".

    Code
    /plugins/system/jce/css/content.css

    Ein einfacher 3-Spalter, den man dann händisch setzen muss, mit einspaltig unterhalb 960px sieht z.B. so aus:

    Rest (gibt noch weitere, hilfreiche Klassen) kann man sich aus der CSS-Datei ja selbst erforschen. Ob's die Mühe wert ist?


    Wenn man obige CSS dann noch im Editor laden lässt, kann man ja im Profil einstellen, sollte man die Klassen wenigstens schon mal in der Stile-Auswahl sehen. Nicht ausprobiert, ob die Media Query-Klassen (z.B.

    Code
    wf-columns-stack-medium

    ) dann dort auch angezeigt werden! Und die "verschachtelten"...


    Bezahlen für PRO ist dann für Nicht-Spielkinder vielleicht doch die einfachere Variante ;)

    Hallo an alle. Wow vielen Dank für Eure schnellen Antworten und die Tipps :)


    Die "Span" Lösung von Tom hat mich schon recht weit gebracht.


    Ich möchte im Content Text und Bilder bzw. Text und ein Maps-Mambot responsiv anzeigen. Auf dem Desktop sollen die sie nebeneinander und auf dem Handy untereinander angezeigt werden.


    Bei der "Span" Lösung habe jetzt nur noch das Problem, dass der Text im Content Bereich übersteht.



    Wüsste jemand hierfür noch eine Lösung?


    Vielen Dank :)