Mega Drop-Down unter der Hauptkategorie zentrieren

Thema wurde von Anonymous, 23. Februar 2020 erstellt.

  1. Anonymous

    Anonymous Mitglied

    Registriert seit:
    7. Dezember 2018
    Beiträge:
    23
    Danke erhalten:
    1
    Danke vergeben:
    4
    Hallo zusammen

    ich habe 5 Hauptkategorien die jeweils zwischen 2 und 4 Unterkategorien haben. Damit die Maus-Wege nicht zu lang sind habe ich die 4 Unterkategorien untereinander angeordnet. Allerdings stehen die jetzt ganz link. Wenn ich von der rechten Hauptkategorien das Dropdown aufmache, muss ich wieder nach links in die Unterkategorie. Wenn ich 20 Unterkategorien habe macht das vielleicht Sinn, bei 4 jedoch nicht.

    Wie kann ich das Dropdown als schmaler machen und unter der Hauptkategorie zentrieren?

    Jemand eine Idee?

    www.curlysuperfood.de

    Vielen lieben Dank,
    Fabian
     
  2. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Die Breite richtet man so ein, dass das breiteste Wort gut dargestellt wird.
    Walnuss & Company füllt die Spalte fast aus, viel schmaler solltest Du das nciht machen, sonst wird der Text umgebrochen
    mit einer Spaltenbreite (oder Blockbreite) von 195px sieht es bei mir aber noch gut aus.
    Einstellen kannst Du die Breite im Style Editor
     
  3. Anonymous

    Anonymous Mitglied

    Registriert seit:
    7. Dezember 2018
    Beiträge:
    23
    Danke erhalten:
    1
    Danke vergeben:
    4
    Hallo Barbara
    danke für die schnell Antwort. Mein Problem ist aber viel mehr, dass ich gerne die Unterkategorien unterhalb der Hauptkategorie aufgelistet haben möchte. Ich finde es unpraktisch einen so langen Mausweg zu machen. insgesamt hätte ich dann das Drop-Down auf die 225 bis 300px in der breite begrenzt - unterhalb der Hauptkategorie:

    upload_2020-2-23_13-31-6.png

    also eigentlich so wie hier:
    upload_2020-2-23_13-33-38.png

    im Style-Edit bin ich hier leider nicht fündig geworden
     
  4. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Auf meinem PC sieht das so aus:
    Unbenannt.JPG

    Also absolut nicht wie bei Dir.
    Du findest die Einstellung unter
    Kategorien -> Megadropdown
    Block-Breite
    Anzahl der Blöcke

    Ein Block ist eine Spalte.
    Wenn man etwas im Shop ändert, sollte man einmal den Shop-Cache für Module und Seiten und ab und zu auch mal den vom Browser leeren.
     
  5. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Unter einer Breite von 1600px wird das bei Dir ausgehebelt:
    Code:
    .navbar-categories > ul > li > ul.dropdown-menu {
        width: 100% !important;
        left: 2px;
        right: 2px;
    }
    Das ist für die Mobile Ansicht (z.B. auf dem Tablet, damit das Dropdown nicht breiter ausgegeben wird, als der Bildschirm, bzw. die Anzeige der Kategorieleiste ist.

    Man könnte ein
    Code:
    @media (min-width: 1200px){
    .navbar-categories > ul > li > ul.dropdown-menu {
        width: 225px !important;
        left: 0;
        right: auto;
    }}
    einfügen, damit er unter 1200px die gesamte Breite genommen wird.
     
  6. Anonymous

    Anonymous Mitglied

    Registriert seit:
    7. Dezember 2018
    Beiträge:
    23
    Danke erhalten:
    1
    Danke vergeben:
    4
    das mit dem Cache habe ich gemacht. Ich habe festgestellt, dass das Problem bei 100% Bildschirmzoom auftritt und bei 90% alles gut ist. Wo kann ich den von dir vorgeschlagenen Code ändern?
     
  7. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Den kannst du im Style Editor ins eigene css eintragen (das geht über die 3 Punkte neben dem Haus)
     
  8. Anonymous

    Anonymous Mitglied

    Registriert seit:
    7. Dezember 2018
    Beiträge:
    23
    Danke erhalten:
    1
    Danke vergeben:
    4
    ähem, sorry CSS ist neues Terrain :( - ich habe jetzt keine 3 Punkte gefunden aber dennoch eine CSS Editor:
    upload_2020-2-23_15-16-12.png

    mit dem Ergebnis dass das Dropdown nur noch links angezeigt wird o_O
    upload_2020-2-23_15-17-52.png
     
  9. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Du nutzt noch ein Temoplate.... da hast Du noch den alten style Editor.
    Das ist der selbe Code, wie für die 1600px breite, der solle eigentlich auch so gehen....

    ändere mal bitte das
    left: 0;
    in
    left: auto;

    damit sieht es bei mir passend aus
     
  10. Anonymous

    Anonymous Mitglied

    Registriert seit:
    7. Dezember 2018
    Beiträge:
    23
    Danke erhalten:
    1
    Danke vergeben:
    4
    läuft! Besten Dank für die Sonntagsschicht :)