Navigationsleiste anpassen

  • Guten Morgen zusammen,

    ich benutze das Top Responsive Layout für ein neue Projekt und möchte die Navigationsleiste genau wie auf der https://www.basf.com/ Seite aussehen lassen, So dass zum oberen Rand ein Abstand besteht und beim Scrollen dieser dann verschwindet. Ihr seht das ja wie ich das meine.

    Auch habe ich versucht das mit dem Flat Responsive Layout zu machen. Leider bekomme ich das so nicht hin.

    Wer kann mir helfen ?

    Mit freundlichem Gruß
    Markus

    Zeta 17.0.4| Business

    Über 230 tolle und kostenlose Widgets für Zeta Producer: widget-zp.de

  • Hallo Markus,

    über die Layout-Einstellungen kannst Du nur die Farbe und die Höhe der Topline bestimmen. Den gewünschten Abstand bzw. den nicht gewünschten Abstand nach Scrollen kannst Du nur mittels CSS erreichen.

    <style>

    #topline {

    margin-top: 40px;

    }

    </style>

    <style>

    #topline.smaller {

    margin-top: 0px;

    background-color: #000000B3

    }

    </style>

    Mit dem Wert für den Abstand musst Du noch etwas spielen. Die Hintergrundfarbe der Topline nach Scrollen ist der BASF-Farbton.

    Viele Grüße

    Tom

  • Hallo Duschgel

    Oder alternativ: Versuchs mal mit Flat Responsive.

    Per "Wireframe" im Banner z.B. ein "Spacer-Widget" einfügen.

    Unter "Einstellungen" -> "Logo anzeigen" und "Website-Name anzeigen" das Häkchen entfernen.

    Vielleich kommst Du durch diese Anmerkung schon etwas weiter und zu weiteren Inspirationen. :)

    Viel Erfolg und eine gute Zeit.

    Viele Grüsse

    elch

    Zeta Producer 17.x - Express

    Website, zu einer nicht primär gewinnorientierten und/oder ernst zu nehmenden Nebentätigkeit: Heubeere.ch ;)
    (PS: "ß" gibt es nicht - und kann ich nicht. Sorry!)

  • Hallo Mario,

    danke. Top Bar habe ich eingebunden, funktioniert aber irgendwie nicht, Ich sehe keine Schrift. Farbe und Animation funktionieren hingegen.

    Und noch einmal ein ganz besonders Dankeschön für Deine tollen Widgets. Genau das Richtige für so einen Loser wie mich, in CSS, HTML; PHP und sonstige komische Sprachen :)

    Ich hatte vorher, als man den ganzen Kram noch manuell einbinden musste, richtig Probleme. Bin halt Netzwerkadministrator und kein Programmierer.

    Ist halt blöde, wenn man unter Zeitdruck steht, denn dann geht meistens eh nix mehr gescheit.

    Hallo elch,

    auch dir ein Danke. Das habe ich auch schon probiert. Die Schwierigkeit besteht aber dann im Hintergrundbild. Dies soll ja komplett und durchgehend angezeigt werden.

    Ich habe jetzt 3 Stunden herumgetüftelt und bin immer noch nicht auf das Ergebnis gekommen.

    Am ehesten komme ich, so wie Mario das auch erwähnt hat auf das Flat Responsive und der Top Bar, wobei wie schon erwähnt keine Schrift erscheint.

    Ich gebe nicht auf. Evtl. hilft Tipp-Ex ein bisschen. Unnötige Stellen einfach wegstreichen. Perfekt ^^

    Mit freundlichem Gruß
    Markus

    Zeta 17.0.4| Business

    Über 230 tolle und kostenlose Widgets für Zeta Producer: widget-zp.de

  • So, meine Lieben,

    Ein Teil vom Mario mit der Top Bar und ein Teil von elch mit dem Space Widget. Ich habe hinter dem Space Widget noch einmal das gleich Bild hinterlegt. Zufälligerweise seiht es passend aus.

    Werde aber noch nicht zu früh jubeln. Aber bis jetzt passt das sehr gut.

    Lieber Mario,

    Ich blöd. Es steht ja groß da, Schrift wird nur sichtbar, wenn das Icon ausgewählt ist. Klar funktioniert es jetzt. Sorry.

    Dennoch eine Frage. Kann ich das Facebook Side Plugin in das Side BTN SlideWindow Widget einbinden ? Der Kunde möchte das nur sehen, wenn man in der Side Bar klickt und das Fenster sich dann aufschiebt.

    Hoffentlich bin ich nicht zu stressig.

    Mit freundlichem Gruß
    Markus

    Zeta 17.0.4| Business

    Über 230 tolle und kostenlose Widgets für Zeta Producer: widget-zp.de

  • Dennoch eine Frage. Kann ich das Facebook Side Plugin in das Side BTN SlideWindow Widget einbinden ? Der Kunde möchte das nur sehen, wenn man in der Side Bar klickt und das Fenster sich dann aufschiebt.

    Das Widget bietet die Möglichkeit den Code alternativ über den HTML-Editor einzufügen (Gruppe HTML/CSS). Somit also kein Problem.

    Das FB-PlugIn bietet ja 2 Möglichkeiten zur Einbindung. Diese sollten beide funktionieren.

    Variante "iFrame":

    Einfach den generierten Code über den HTML-Editor im Widget einfügen.

    Variante "JavaScript-SDK":

    Den ersten Teil über "Website > Erweitert > Attribute > body_start" einbinden.

    Den 2. Teil im Widget mit dem HTML-Editor einfügen.


    Hoffentlich bin ich nicht zu stressig.

    Nö


    PS: zu weiteren Fragen zu den Externen Widgets bitte im entsprechendem Forum.

Jetzt mitmachen!

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