Ocean Custom Header 2-Zeilig&Sticky

  • hallo forum

    bin ein ganz neuer was wp angeht.

    ich such mich schon seit tagen die finger wund und habe alle möglichen lösungen versucht aber es will mir nicht gelingen.
    ich verwende das theme ocean und elementor free.

    nun möchte ich mir einen custom header machen. soweit so gut.
    dieser header soll aus 2 zeilen in unterschiedlichen farben bestehen und sticky sein.

    und hier scheitere ich. ich schaffe es zwar den header so zu erstellen wie er aussehen soll, haben dann aber 2 abschnitte und kann diese beiden nicht sticky machen.

    dann habe ich versucht die tob-bar auch als template zu erstellen und ein seperates header-template. auch dass funktioniert, nur wieder nicht dass ich es sticky hinbekomme.

    habs mit div. plugins versucht und css schnippseln bin aber immer gescheitert.

    ich versuche schon die ganze zeit für den header 1 abschnitt zu schaffen, wo ich dann beide färbige zeilen einfüge. und im nächsten zug diesen 1 abschnitt sticky zu machen.[Blockierte Grafik: https://ibb.co/Wnvvjhv] so in der art soll es aussehen. https://ibb.co/Wnvvjhv

    vielen dank für eure hilfe

    eugen

    Einmal editiert, zuletzt von OidaLassmich (11. April 2022 um 14:58)

    • 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

  • elementor free


    mit der pro geht es ganz einfach

    für umsonst
    schau mal auf youtube da gibt es jede menge videos die dir weiterhelfen
    free elementor header sticky

    oder wieder ein plugin was unötig ist
    Sticky Header Effects for Elementor

  • hey. ja das mit dem pro ist noch so eine sache.
    ich glaub ich habs gerade mit css lösen können. werde das am abend noch weitertesten und morgen meine erkenntnisse kundtun.

    aber aller anfang ist und bleibt mal schwer.

  • hey.
    ich konnte es mit css lösen. hab mir 2 templates gebaut unter Theme Panel->my templates. und diese dann für die top bar und den header zugewiesen. für jedes template hab ich eine eigene class id vergeben. und dann unter Design->Customize folgende zeilen zum custom css eingefügt:

    #meineID1 {
    height:70px;
    z-index:999;
    margin:0 auto;
    width:100%;
    position:fixed;
    top:0;
    left:0;
    right:0;
    }

    #meineID2 {
    height:155px;
    margin:10px auto;
    width:100%;
    position:fixed;
    top:56px;

    }

    somit funktioniert nun alles wie ich es im sinn hatte. ich habe das plugin elementor header&footer installiert, da ich nur damit das navigations.-widget für meinen custom header bekomme.

    wenn ich das nicht verwende, müsste doch mein "standardmenü" dennoch in meinem custom-header angezeigt werden. oder funktioniert das nicht?

    ich versuch mir mal einen lokale testumgebung zu schaffen und das zu testen. soll ich meine erkenntnisse dann hier posten - denn eigentlich ist der thread ja gelöst.

Jetzt mitmachen!

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