Logo/Vereinslogo überlappend in Naviagtionsleiste

  • ist es möglich, ein Logo "überlappend" in meine Navigationsleiste einzufügen? Ich verwende das Theme "Nirvana" und möchte dies, wenn möglich, so hinbekommen. Im Anhang habe ich mal einen Screenshot abgelegt wie es derzeit aussieht und 2 Lösungen wie ich es gerne hätte.

    Ich hoffe ihr könnt mir weiterhelfen :)

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Sorry, aber ich behaupte mal, dass du so kaum Hilfe hier erwarten kannst.

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

  • header.php direkt nach

    Code
    <nav id="access" role="navigation">


    dein Logo mit Link einfügen(also vor dem php-Code)

    style.css

    dies einfügen

    Code
    #header {
        margin-top: 25px;
    }
    
    
    #access img {
        margin: -25px 0 0 25px;
        position: absolute;
    }

    und hier

    Code
    #access > .menu {
        display: table;
        float: none;
        margin: 0 auto;
    }

    margin ändern in

    Code
    margin: 0 0 0 150px;
  • nun falsch eingefügt

    Code
    <nav id="access" role="navigation"><a id="logo" href="http://shop-zirbelnusstv.de/"><img title="" alt="" src="http://shop-zirbelnusstv.de/wp-content/uploads/2015/03/copy-cropped-Logo-e1425849576719.png"></a>

    also wie oben geschrieben

    nicht nach dem php-Code und ohne <p></p>

    und der CSS Code ist genau angepasst, also auch da nix ändern

  • da du schon wieder alles veränderst

    diesen Teil

    PHP
    <nav id="access" role="navigation">	
    <?php cryout_access_hook();?>
    </nav><!-- #access -->

    ersetzen durch

    PHP
    <nav id="access" role="navigation">
    <a id="logo" href="http://shop-zirbelnusstv.de/"><img title="" alt="" src="http://shop-zirbelnusstv.de/wp-content/uploads/2015/03/copy-cropped-Logo-e1425849576719.png"></a>	
    <?php cryout_access_hook();?>
    </nav><!-- #access -->

    wenn du jetzt wieder falsch einfügst, gebe ich auf ;)

  • An welcher Stelle genau muss ich dann das Bild einfügen? Weil wenn ich es ohne die Pfeile einfüge dann wird nichts außer einem Link angezeigt und auch als ich alles zurückgesetzt habe ist der Header und das Menü so geblieben. Was kann ich da genau ändern?

  • siehe über deinem Beitrag

    und bitte meinen ersten Beitrag lesen


    das

    Code
    #header {
        margin: 0 0 0 150px;
    }

    habe ich nicht geschrieben

    Einmal editiert, zuletzt von Tutrix (9. März 2015 um 18:59)

  • Habe ich leider erst nach dem schreiben lesen können, sorry. Also ich habe jetzt einfach mal deinen Code genauso eingesetzt oder nicht? Trotzdem klappt es nicht. Ich würde dir auch kurz ein Account einrichten dass du es machen kannst, wäre kein Problem für mich da die Seite im Aufbau ist

  • Code
    #header {
        margin: 0 0 0 150px;
    }

    das habe ich nicht geschrieben

    bitte meinen ersten Beitrag lesen und "nur" diese Änderungen durchführen

  • So jetzt da. Tut mir leid, das kommt davon wenn man ein Simple CSS Plugin benutzt. Es ist jetzt genauso wie ich es wollte, danke für deine Mühe und entschuldigung dass ich so anstrengend war :)

  • Es ist jetzt genauso wie ich es wollte

    nicht ganz

    die Änderung hier

    Code
    #access > .menu {
        display: table;
        float: none;
        [COLOR="#FF0000"]margin: 0 auto;[/COLOR]
    }

    in

    Code
    margin: 0 0 0 150px;

    fehlt noch

    da sonst das Menü beim Ändern der Seitegröße, ins Logo rutscht

    ach ja und das Logo ist jetzt zu groß, überdeckt also die Überschriften der anderen Seiten

    Einmal editiert, zuletzt von Tutrix (9. März 2015 um 19:17)

  • die Formatierung in der style.css, wird durch eine Weitere im Dashboard überschrieben

    Die Entwicklertools deines Browser kennst, verwendest du?!

  • gerade mal kurz nach gesehen

    das Theme hat eine custom-styles.php die diese Formatierung enthält
    überschreiben kannst du mit !important

    auch eine style-mobile.css ist vorhanden, die du bei all deinen Änderungen beachten solltest
    also das auch auf z.B. dem iPad und diversen Smartphones alles korrekt angezeigt wird

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!