Kotha theme navigation breackpoint

Ansicht von 2 Antworten – 1 bis 2 (von insgesamt 2)
  • Moderator Bego Mario Garde

    (@pixolin)

    vor 8 Jahren, 3 Monaten

    Was hast du denn versucht?

    Öffne mal deine Website im Browser Chrome. Dann … 

    1. Seite soweit verkleinern, dass die Mobil-Navigation erscheint.
    2. Rechtsklick auf das Menü > Element untersuchen
    3. Links wird das HTML angezeigt, rechts das CSS. Im HTML suchst du das <div>-Tag, das das mobile Menü umfasst und mit einer MediaQuery @media (max-width:767px) gestaltet wird. Vergrößerst du jetzt den Bildschirm, siehst du, dass die MediaQuery verschwindet und statt dessen für die Klasse {display:none} gilt. Hier musst du also eine Ergänzung vornehmen.
    4. Die Ergänzung betrifft die Bildschirmgröße zwischen 768 und 1189 Pixel, also @media (min-width: 768px) and (max-width: 1189px). Als Regel kannst du das Styling der MediaQuery für Bildschirme < 767px verwenden.
    5. Die fertige CSS-Regel kannst du entweder in einem Child Theme oder über das Plugin Simple Custom CSS hinzufügen.

    Eine Einführung in CSS findest du z.B. beim Mozilla Developer Network

    Thread-Starter andre1960

    (@andre1960)

    vor 8 Jahren, 3 Monaten

    Besten Dank für den Tip.

    @media (min-width: 768px) and (max-width: 1189px) {
    .slicknav_menu {
    display: block !important;

    }
    .menu{
    display:none !important;
    }
    .sub-menu .menu-item-has-children> a:after,
    .menu-item-has-children> a:after{
    display:none;
    }

    .slicknav_nav {
    margin-left: 0px;
    margin-right: 0px;

    }
    }

Ansicht von 2 Antworten – 1 bis 2 (von insgesamt 2)
  • Das Thema „Kotha theme navigation breackpoint“ ist für neue Antworten geschlossen.