Stehende Navigation mit page4

Tags: TippsDesign | Kommentare: 10 | Views: 2968

Mittwoch 25.November 2015

 

Stehende Navigation

Durch kleine Scripte page4 erweitern.

 

Mit dem heutigen Blogartikel möchten wir euch zeigen, wie ihr mit einem kleinen Script von uns in jedem neuen Design aus einer normalen horizontalen Navigation eine stehende Navigation macht. Dazu wollen wir erst einmal kurz erklären, was eine stehende Navigation überhaupt ist.

 

Wenn ihr unsere Webseite anschaut, dann bemerkt ihr, dass die Navigation immer stehen bleibt, auch wenn ihr scrollt um den Rest einer Seite zu lesen. Bei unserer Seite ist die Navigation immer oben, daher fällt das nicht so auf. Wenn ihr nun eine Webseite mit einem Header habt und die Navigation ist unter dem Header dann würde eine stehende Navigation solange nach oben scrollen bis der obere Rand vom Browserfenster erreicht ist und dann stehen bleiben und die Inhalte würden dann weiter nach ober scrollen "unter" der Navigation hindurch und verschwinden. Der Vorteil: Eure Besucher sehen immer die Hauptnavigation, egal wo sie sich auf der Seite befinden.

 

Wie könnt ihr nun so eine stehende Navigation erzeugen? Wir haben seit gestern ein kleines Update online und unter anderem die Software so erweitert, dass fast alle neuen Vorlagen durch ein kleines Script eine stehende Navigation erhalten. Das ist allerdings nur mit einer Kaufversion möglich, da ihr dieses Script über das Feld für Google Analytics in den Head einbinden müsst. Wenn ihr das Script auf der Webseite mit einem HTML Content einfügt, funktioniert es nicht.

 

Es müssen drei Voraussetzungen erfüllt sein: a) Eine Premiumversion um Zugriff auf das Google Analytics Feld zu bekommen und b) eine neue Designvorlage oder eine konvertierte Designvorlage. c) Die horizontale Navigation darf nicht in einem Head integriert sein sondern muss unter, zwischen oder über dem Head sein. Hat das Design keinen Head sondern nur eine horizontale Navigation, geht das auch. Es funktioniert also für die meisten neuen und konvertierten Vorlagen.

 

Das sind auch schon alle Hintergrundinformationen, die ihr braucht. Eine Sache noch. Im Admin-Modus ist das Script nicht aktiv. Ihr müsst euch also ausloggen um die stehende Navigation zu sehen und auf eurer Seite muss natürlich so viel Inhalt vorhanden sein, dass ihr diesen Inhalt nach oben scrollen könnt.

 

Kommen wir jetzt zur Praxis.


So funktioniert der Trick.

 

Meldet euch als Admin an. Dann öffnet ihr den Dialog "Allgemeine Einstellungen", den ihr unter dem Menü "Optionen findet. Dieser Dialog hat noch Karteikarten. Auf der letzten Karteikarte findet ihr das Feld für Google Analytics. Klickt auf die Karteikarte und fügt das weiter unten im Blog stehende Script in dieses Feld ein. Wenn ihr bereits ein Script von Google Analytics eingebaut habt, dann setzt dieses Script einfach darunter ein. Achtet darauf, dass der Programm-Code komplett ist.

 

Danach abspeichern und fertig. Sobald ihr ausgeloggt seid, könnt ihr die stehende Navigation ausprobieren. Natürlich bleibt dieser Effekt erhalten auch wenn ihr das Design wechselt. Solange, wie der Code eingebaut ist und ihr ein neues Design nutzt. Möchtet ihr keine stehende Navigation mehr, entfernt ihr einfach das Script.

 

Hier ist das kleine Script, welches ihr braucht:

 

<script src="/system/mods/mod.layout_fixed_nav.js" type="text/javascript"></script>

 

Also viel Spaß beim Ausprobieren. Mit dem Update haben wir noch einige kleine Verbesserungen vorgenommen. Nächste Woche gibt es dazu einen weiteren Blog-Artikel. Zu diesem Tipp werden wir noch ein kleines Video machen und in einem neuen Videokanal veröffentlichen, in dem wir zukünftig viele kleine Videos zur Verfügung stellen wollen.

 

Bis dann

Manfred F. Schreyer

Neuer Kommentar



Kommentar veröffentlichen

Blogarchiv