Hallo, Besucher der Thread wurde 1,2k aufgerufen und enthält 6 Antworten

letzter Beitrag von Belarus am

[Template] Top Bar Menü

Aktiviere jetzt die 2-Faktor-Authentisierung für deinen Account und erhalte die Trophäe Auf der sicheren Seite.

    Hallo,


    viele Internetseiten haben über die eigentliche Navigation eine weitere schmalere und so genannte Top-Bar in welchen u.a. der Seitentitel, ein Logo, Rufnummer, Email, eine Sprach- oder Währungsauswahl oder ähnliches untergebracht wurde. Solch eine Top-Bar ist unter anderen sehr nützlich um die eigentliche Navigation von zuvor genannten zu entlasten und optisch aufgeräumter zu gestalten und das sogar mit recht einfachen Mitteln ;)


    Features

    • Leichte Integration
    • Beliebig erweiterbar
    • Reines HTML und CSS
    • Individuell an Deinen Style anpassbar





    Demo


    Eine Live Demo kann auf Belarusinfo.de eingesehen werden ;)

    Quellcode

    Dieser BBCode ist nur für Mitglieder sichtbar! - Um den BBCode nutzen zu können Loggen Sie sich bitte ein oder Registrieren Sie sich.
    Dieser BBCode ist nur für Mitglieder sichtbar! - Um den BBCode nutzen zu können Loggen Sie sich bitte ein oder Registrieren Sie sich.


    Benutzung

    1. Gehe zu Anpassung Templates
    2. Wähle unter Templates (falls dort nicht schon markiert) über den Filter Deinen Style aus - siehe Screenhot im Anhang.
    3. Lege mit einen klick auf + Template hinzufügen ein neues Template an
    4. Wähle als Templatename: "TopBarMenu"
    5. Füge dann den HTML-Quellcode (siehe oben) ein und passe DEINE_URL und DEINE_EMAIL mit Deinen Daten an.
    6. Gehe zu Anpassung DEIN_STYLE Erweiterte Einstellungen Eigene Deklarationen - oder - Stilunabhängiges CSS und SCSS
    7. Füge dort den CSS-Quellcode (siehe oben) ein. Das ausblenden des Logos ist dabei wie gekennzeichnet optional.

    Um das Template nun einzubinden und anzeigen zu lassen gehe wie folgt vor:

    1. Gehe zu Anpassungen Templates DEIN_STYLE und suche das Template: header
    2. Klicke hier auf um das Template zu bearbeiten.
    3. Suche nun nach der Zeile {event name='beforePageHeader'} (relativ weit oben).
    4. Füge danach folgendes in einer neuen Zeile ein: {include file='TopBarMenu'} und speicher dieses ab.
    5. Fertig!

    Hinweis

    Die Top-Bar wurde auf den Standard Woltlab Style aufgebaut. Solltest Du ein individuellen Style benutzten, so muss der Quellcode ggfls. angepasst werden. Beachte entsprechend die Warnung weiter unten - Danke! Zudem handelt es sich bei der Top-Bar lediglich um ein Beispiel wie diese genutzt und dargestellt werden kann. Per HTML und CSS kann die Top-Bar natürlich ganz beliebig nach Deinen Vorstellungen erweitert und optisch angepasst werden. Mögliche weitere Nutzungsmöglichkeiten wären u.a.: Währungswechsler, Sprachwechsler, Links zu sozialen Netzwerken, Service-Rufnummern, Logos, etc. Auch wäre es möglich das User-Menü (Benutzermenü, Notifications, Konversationen, Suche, etc.) in diese Top-Bar zu intrigieren. Dazu sind jedoch weitere Anpassungen Templates notwendig, welche hier an dieser Stelle den Rahmen sprengen würden.


    Im übrigen harmoniert die Top-Bar sehr schön mit den Mega Menü ;)

    Warnung

    Das unachtsame (ver)ändern von Templates kann zu einem Templatefehler führen. Es wird daher dringend dazu geraten vorher ein Backup zu machen! Für etwaige Datenverluste oder Schäden kann keine Haftung übernommen werden! Bei Unsicherheiten frag entsprechend besser vorher nach oder wende Dich an einer Person Deines Vertrauens. Danke!

    Lizenz

    Copyleft oder mit anderen Worten, macht damit was Ihr wollt ;)

    Screenshots


    Vielen Dank an dieser Stelle an Hitman welcher bei der Umsetzung der Top-Bar mitgewirkt hat :thumbup:


    Viel Spaß damit ;)


    Gruss,
    Andreas

  • Belarus

    Hat den Titel des Themas von „Top Bar Menü“ zu „[Template] Top Bar Menü“ geändert.

    Ich bin vorgegangen wie beschrieben und habe jeden einzelnen Schritt doppelt und dreifach überprüft. Aber das Menü wird auf meiner Seite nicht angezeigt... :/

    Reminder

    Ein Fehler muss aber enthalten sein, denn ansonsten müsste Dir das TopBarMenu angezeigt werden.

    Hast Du das Template auch in der Templategruppe Deines Stils erstellt oder versehentlich in einer anderen Stilgruppe angelegt? Am includieren des Templates per dessen Bezeichnung (Name des Template) kann es jedoch nicht liegen, denn in einen solchen Fall würde dies zu einen Fatal-Error führen. Da Du den Standard-Stil bzw. ein darauf aufbauenden Stil benutzt, kann es zudem auch am Stil selbst nicht liegen, denn darauf wurde das TopBarMenu aufgebaut (auch wenn sich dieses an jenen x-beliebige anderen Still anpassen ließe). Bist Du Dir somit wirklich sicher, dass Du alles 100% der Anleitung nach durchgegangen bist und auch alles seine Richtigkeit hat? Andernfalls blieb nur die Möglichkeit sich dies auf der Testumgebung einmal selbst anzusehen. Jedoch wird dafür ein Profil mit entsprechenden Rechten erforderlich sein.


    Gruss,
    Andreas

    • Gäste Informationen
    Hallo,gefällt dir der Thread, willst du was dazu schreiben,
    dann melde dich bitte an.
    Hast du noch kein Benutzerkonto, dann bitte registriere dich, nach der Freischaltung kannst du
    das Forum uneingeschränkt nutzen.

    Dieses Thema enthält 4 weitere Beiträge, die nur für registrierte Benutzer sichtbar sind, bitte registriere dich oder melde dich an um diese lesen zu können.
  • Dieses Thema enthält 4 weitere Beiträge, die nur für registrierte Benutzer sichtbar sind, bitte registriere dich oder melde dich an um diese lesen zu können.

Jetzt mitmachen!

Du hast noch kein Benutzerkonto auf unserer Seite? Registriere dich kostenlos und nimm an unserer Community teil!