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

Navigation Elemente umstylen - Größe und den Abstand zueinander verändern

Dieses Thema im Forum "Design" wurde erstellt von wort, 4. August 2013.

  1. wort

    wort Well-Known Member

    Registriert seit:
    23. Juli 2013
    Beiträge:
    49
    Zustimmungen:
    0
    Hallo,

    ich möchte gerne Änderungen an meinem Main-Menü und Sub-Menü vornehmen. Dabei suche ich den nötigen Eintrag im Theme Editor, um die Schriftgröße der einzelenen Links in der Navigation ändern zu können.

    Gleichzeitig möchte ich den Abstand zwischen den einzelen Links in der Navigation (sowohl im oberen Menü, als auch im unteren Menü) ändern wollen.

    Für die Website nuzte ich das Yoko Theme von elmastudio.

    Wäre für jeden Rat dankbar!
     
  2. Monika

    Monika Well-Known Member
    Ehrenmitglied

    Registriert seit:
    4. Juni 2005
    Beiträge:
    14.126
    Zustimmungen:
    2
    wenn jeder einzelne Link eine andere Schriftgröße haben sollte,
    brauchst du die ID der Menüpunkte
    die findest Du im Source

    jedes dieser Menüs hat auch eine eigene css Klasse so kannst du sie dann ansprechen,
    der Rest ist css,...

    findest du im style.css das Menü?
    kannst du genug css, um das zu realisieren...
     
  3. wort

    wort Well-Known Member

    Registriert seit:
    23. Juli 2013
    Beiträge:
    49
    Zustimmungen:
    0
    Wo finde ich die entsprechenden ID's, bzw. die Source?

    Ich möchte nicht jedem einzelnen Link eine unterschiedliche Größe vergeben, vielmehr sollen die Links im Main-Menü (die Navigation über den Banner) kleiner und die Links im Sub-Menü (die Navigation unter dem Banner) größer dargestellt werden.

    Leider beherrsche ich kein CSS und daher sind meine Lösungsansätze sehr stark begrenzt. Aus diesem Grund waren meine Bemühungen die style.css dem entsprechend anzupassen ohne Erfolg.
     
  4. Frost Agent

    Frost Agent Well-Known Member

    Registriert seit:
    10. März 2010
    Beiträge:
    77
    Zustimmungen:
    0
    Für die Links über dem Banner schau mal in deiner style.css Zeile 247 nach und für die Links unter dem Banner in Zeile 309. Dort kannst du dann unter font-size die Größe der jeweiligen Navigationen ändern.
     
  5. wort

    wort Well-Known Member

    Registriert seit:
    23. Juli 2013
    Beiträge:
    49
    Zustimmungen:
    0
    Das mit der Anpassung der Schriftgrößen habe ich nun hinbekommen, obwohl ich gerne auch wissen würde wie es ab font-size: .9em; aufwärts geht. :smile:

    Jetzt möchte ich die Links näher zueinander rücken, bei der oberen Navigation ist es mir gelungen in dem ich in Zeile 248 unter
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    den Wert der 14 ändere.

    Aber wo muss ich welchen Wert ändern damit die untere Navigation A: zentriert dargestellt wird und B: die einzelnen Links des Sub-Menü zusammen rücken?

    Danke!
     
  6. wort

    wort Well-Known Member

    Registriert seit:
    23. Juli 2013
    Beiträge:
    49
    Zustimmungen:
    0
    Also so sieht der Eintrag vom Sub-Menü in der style.css aus:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  7. Frost Agent

    Frost Agent Well-Known Member

    Registriert seit:
    10. März 2010
    Beiträge:
    77
    Zustimmungen:
    0
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Probier es mal so.
     
  8. wort

    wort Well-Known Member

    Registriert seit:
    23. Juli 2013
    Beiträge:
    49
    Zustimmungen:
    0
    Super, das mit dem Aneinanderrücken hat prima geklappt, nur der Eintrag für die Zentrierung ergab nicht den gewünschten Effekt. Die Navigationsleiste ist nur ein kleines Stück nach rechts verschoben und dadurch nicht zentriert.

    Ist es nicht möglich die Navigationsleiste zu zentrieren?

    Ich bedanke mich im Voraus für jegliche Unterstützung!
     
  9. wort

    wort Well-Known Member

    Registriert seit:
    23. Juli 2013
    Beiträge:
    49
    Zustimmungen:
    0
    Wieso lässt sich die untere Navigationsleiste nicht korrekt zentrieren und wie kann ich diese so einstellen, damit sie auch wie die obere Navigationsleiste den gleichen Roll-Over Effekt hat und keinen Unterstrich, sobald man mit der Maus auf einen Link gleitet.

    Wenn ich dieses Anliegen bewältigen kann, bin ich vorerst mit dem groben Basteln fertig und kann mich auf andere Dinge konzentrieren.

    Daher wäre ich den Wordpress Experten überaus dankbar, wenn sie mich noch aus diesem Dilemma befreien könnten.
     
  10. Monika

    Monika Well-Known Member
    Ehrenmitglied

    Registriert seit:
    4. Juni 2005
    Beiträge:
    14.126
    Zustimmungen:
    2
    das ist kein WordPress Problem, das ist ein CSS Problem und könnt selbst bei einer reinen html Seite auftreten

    #mainnav alles was in der style.css irgendwo ein #mainnav hat
    bezieht sich auf die Navigation ganz oben rechts

    alles was in der style.css ein #subnav vorne dran hat bezieht sich auf die Navi, die Kopfzerbrechen macht

    mein 1. Lösungsvorschlag,
    die Original CSS Datei sichern, irgendwo auf einen Ordner auf dem PC wo sie sicher ist

    dann die style.css des verwendeten Themes dahingehend bearbeiten, dass alle Angaben von #mainnav
    auf #subnav übertragen werden
    ich mache das so: alle Angaben von #mainnav in einem Texteditor kopieren und dort statt #mainnav #subnav hinschreiben
    dann erst alles in die style.css laden und zwar ganz ganz ganz unten
    normalerweise überschreibst dann alles was weiter oben steht..

    testen wie es nun aussieht...
    dann weiter ändern


    weiters die header.php des verwendeten Themes öffnen und dort nach


    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    suchen und gleich danach das einfügen


    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    so nun ist die ganze horizontale Navi auf der rechten Seite :)
    aber sie funktioniert wie die ganz oben rechts und es gibt keine Inhaltsverschiebungen

    das liegt an folgender Angabe von der #mainnav

    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    und aufgrund der Änderungen, die ich oben erklärte hat nun die #subnav folgende Angabe



    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    dies könnte mit
    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    geändert werden, dann ist alles zentriert....



    #######################################

    2. der perfekte Weg wäre für diesen Vorgang ein ChildTheme anzulegen, dann hat man immer die Originaldateien...
     
  11. wort

    wort Well-Known Member

    Registriert seit:
    23. Juli 2013
    Beiträge:
    49
    Zustimmungen:
    0
    Hallo Monika,


    danke für deine Antwort. Ich habe deine Anleitung soweit umgesetzt, allerdings hat sie leider nur bedingt geholfen.


    Die untere Navigationsleiste ist nach wie vor nicht zentriert dargestellt.


    Das mit dem Roll-Over Effekt hat funktioniert, aber mit einem Schönheitsfehler. Es wird nur eine Unterkategorie angezeigt, obwohl mehr vorhanden sind. Auch wird der Text der Unterkategorien nicht mittig angezeigt.


    Das ist der Teil den ich unten in meine style.css eingebaut habe:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  12. Monika

    Monika Well-Known Member
    Ehrenmitglied

    Registriert seit:
    4. Juni 2005
    Beiträge:
    14.126
    Zustimmungen:
    2
    wie du zentrierst habe ich in meinem vorherigen Beitrag erklärt, ganz unten, das funktioniert bei mir oder

    du nimmst das

    was du da alles bei dir ändern musst ist anhand meiner Angaben sichtbar, ich habe es mit Firebug gemacht und es funktioierte bei mir....

    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  13. wort

    wort Well-Known Member

    Registriert seit:
    23. Juli 2013
    Beiträge:
    49
    Zustimmungen:
    0
    Wenn ich das so mache wie du es erklärt hast, rückt die untere Navigation zwar mehr in die Mitte, doch gleichzeitig vergrößert sich der Abstand der einzelnen Links in der unteren Navigation. Aber ich möchte das die untere Navigation sowohl zentriert dargestellt wird, als auch dass die Links dicht zueinander stehen.
     
  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