1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Menü responsiv

Dieses Thema im Forum "Design" wurde erstellt von max brandt, 3. Mai 2017.

  1. max brandt

    max brandt Well-Known Member

    Registriert seit:
    26. September 2016
    Beiträge:
    159
    Zustimmungen:
    1
    Hallo Leute

    Knifflige Sache:

    Ich verwende das Theme Customizr. Ich habe dort das Menü zentriert dargestellt. Die Menüpunkte sind bei mir in einer Linie. Sobald der Bildschirm kleiner wird, rutschen die Menüpunkte untereinander. Ist ja standardmäßig so vorgesehen.
    Ich müsste es aber so hinkriegen, das das eben nicht passiert, sondern auf jedem Monitor, egal wie groß, die Menüpunkte immer in einer Linie bleiben.

    Was kann ich da tun? Bitte um Hilfe
     
  2. Edi

    Edi Well-Known Member

    Registriert seit:
    26. Juli 2006
    Beiträge:
    3.728
    Zustimmungen:
    1
    Alle Menü-Einträge auf einem Smartphone auf einer Zeile?!

    Und: Ohne Link weiss niemand, was Du gebastelt hast. ;)
     
  3. max brandt

    max brandt Well-Known Member

    Registriert seit:
    26. September 2016
    Beiträge:
    159
    Zustimmungen:
    1
  4. Edi

    Edi Well-Known Member

    Registriert seit:
    26. Juli 2006
    Beiträge:
    3.728
    Zustimmungen:
    1
    Derzeit wechselt das Menü bei etwa 960 Pixel (Tablet-Grösse) von der "Desktop"-Ansicht auf ein responsives Menü und wird davor bereits auf zwei Zeilen angezeigt (ab ca. 1500 Pixel).

    Um alles auf eine Zeile zu bringen, müsstest Du eine kleinere Font-Grösse definieren und/oder den Menübereich verbreitern oder verschiedenen Bildschirmgrössen mit Media Queries verschiedene Menü- und/oder Font-Grössen zuordnen (oder dynamische Font-Grössen verwenden).

    Ansonsten ist der Menü-Aufbau beim Theme Customizr nicht ganz einfach. Da müsstest Du Dich einarbeiten.
     
  5. max brandt

    max brandt Well-Known Member

    Registriert seit:
    26. September 2016
    Beiträge:
    159
    Zustimmungen:
    1
    Danke für die Info. Werde mich damit spielen.
     
  6. max brandt

    max brandt Well-Known Member

    Registriert seit:
    26. September 2016
    Beiträge:
    159
    Zustimmungen:
    1
    So...
    Habs jetzt geschafft, die Menüpunkte kleiner, mittig und die navbar-inner ist auf 100% wobei es trotzdem nicht bis zum Rand geht....?
    Die Punkte springen aber trotzdem um wenn ich aufzoome.
    Hast du da noch eine Idee dazu?
     
  7. spickzettel

    spickzettel Well-Known Member

    Registriert seit:
    19. Januar 2006
    Beiträge:
    1.848
    Zustimmungen:
    0
    div.navbar-wrapper hat zusätzlich die Klasse span9. Dadurch wird die Breite des Menüs auf 9 von 12 Spalten (ca. 75%) begrenzt. Die Klasse span10 reicht bei mir, damit das Menü einzeilig bleibt.
     
  8. max brandt

    max brandt Well-Known Member

    Registriert seit:
    26. September 2016
    Beiträge:
    159
    Zustimmungen:
    1
    Hallo

    Da das Theme keine direkte Style.css hat, habe ich mit dem String Locator diese Zeile gefunden und den span auf 10 gestellt:
    $_navbar_classes = implode( " ", apply_filters( 'tc_navbar_wrapper_class', array('navbar-wrapper', 'clearfix', 'span10') ) );

    Es wird aber nix anders. Wo liegt der Fehler. Kann das SPAN nur dort finden

    Bitte dich um Hilfe.
     
  9. spickzettel

    spickzettel Well-Known Member

    Registriert seit:
    19. Januar 2006
    Beiträge:
    1.848
    Zustimmungen:
    0
    Das ist schon ein sehr komplexes Theme und eigentlich sollte man da nicht so einfach im Quelltext rumändern :) Aber die Zeile mit den $_navbar_classes gibt es an zwei verschiedenen Stellen. Die Stelle in der function czr_fn_new_menu_view() ist hier die entscheidende.
     
  10. b3317133

    b3317133 Well-Known Member

    Registriert seit:
    21. November 2014
    Beiträge:
    6.142
    Zustimmungen:
    542
    Damit man nicht im Quellcode rumändern muss, hat der Programmierer offenbar den tc_navbar_wrapper_class Filter bereitgestellt, also einfach benutzen.
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden