cassiopeia: in mobiler ansicht Sidebar-left über Content anzeigen

Rosi

Hallo Zusammen,

ich hab in Cassiopeia an der Position Sidebar-left ein eigenes Modul eingefügt, welches auf der Desktopansicht auch perfekt angezeigt wird.

Leider wird das Modul in der mobilen Ansicht unter dem Content angezeigt. Ich möchte aber, dass es über dem Content angezeigt wird.

Also erst das Modul und darunter der Content.

Ist das möglich? Gibt es dazu eine Einstellung?

Wäre super, wenn da jemand ne Idee hat. Vielleicht per CSS in der user.css?

Bin in Joomla noch recht am Anfang - von daher wäre es supernett, wenn jemand eine Lösung mit einer kurzen Erklärung hätte.

vlg

Rosi

drmenzelit

Zitat

Leider wird das Modul in der mobilen Ansicht unter dem Content angezeigt

Das ist extra so gemacht, weil der Inhalt der Sidebars normalerweise weniger relevant ist, als der Hauptinhalt einer Seite. Aber man kann es mit CSS überschreiben. Du musst die grid Definition ändern:

Code

@media (max-width: 991px) {
    .site-grid {
        grid-template-areas:
            ". banner banner banner banner ."
            ". top-a  top-a  top-a  top-a  ."
            ". top-b  top-b  top-b  top-b  ."
            ". side-l side-l side-l side-l ."
            ". comp   comp   comp   comp   ."
            ". side-r side-r side-r side-r ."
            ". bot-a  bot-a  bot-a  bot-a  ."
            ". bot-b  bot-b  bot-b  bot-b  ."
    }
}

Alles anzeigen

christine2

Hallo Viviana,

hatte es temporär ausprobiert, aber es gelang nicht.

Erst als ich nach den Segementen ein ; dazugab funktionierte es:

Code

". banner banner banner banner .";
etc.

Liebe Grüße

Christine

Stef

Ich hatte es auch getestet, auf einer neue Joomla 5 und auf eine upgradete. Der Code von drmenzelit funktioniert.

Vortritt hat "side-l" und kommt vor dem Beitrag.

Rosi

Hallo Ihr Lieben,

Gaaanz lieben Dank für die schnelle Hilfe.

Momentan ist der Content zwar noch irgendwie zusammengequetscht hinterdem Modul, doch werde ich versuchen, das zu lösen, bevor ich nochmal nerve....

vlg

rosi

Vanbrugg

Zitat von drmenzelit

Das ist extra so gemacht, weil der Inhalt der Sidebars normalerweise weniger relevant ist, als der Hauptinhalt einer Seite. Aber man kann es mit CSS überschreiben. Du musst die grid Definition ändern:

Code

@media (max-width: 991px) {
    .site-grid {
        grid-template-areas:
            ". banner banner banner banner ."
            ". top-a  top-a  top-a  top-a  ."
            ". top-b  top-b  top-b  top-b  ."
            ". side-l side-l side-l side-l ."
            ". comp   comp   comp   comp   ."
            ". side-r side-r side-r side-r ."
            ". bot-a  bot-a  bot-a  bot-a  ."
            ". bot-b  bot-b  bot-b  bot-b  ."
    }
}

Alles anzeigen

Jupp. Genau die richtige Methode. Seitdem ich das Gridsystem kapiert hab, fiel es mir regelrecht wie Schuppen von den Haaren ... äh ... Augen. Das Gridsystem ist einfach nur super flexibel. Geniale Erfindung!

Stef

christine2 , vielleicht hast du es mit dem Modul auf Position «sidebar-right» versucht.

Um das Modul «sidebar-right» vor dem Beitrag zu haben, solltest du folgender code versuchen:

Code

@media (max-width: 991px) {
    .site-grid {
        grid-template-areas:
            ". banner banner banner banner ."
            ". top-a  top-a  top-a  top-a  ."
            ". top-b  top-b  top-b  top-b  ."
            ". side-r side-r side-r side-r ."
            ". comp   comp   comp   comp   ."
            ". side-l side-l side-l side-l ."
            ". bot-a  bot-a  bot-a  bot-a  ."
            ". bot-b  bot-b  bot-b  bot-b  ."
    }
}

Alles anzeigen

side-l mit side-r ausgetauscht.

Tags