Hallo,
versuche nun schon seit Tagen eine responsive Navigation zu bauen, wie diese hier:
http://bootstrap.pepes-sandbox.de/
Das Thema ist für mich zumindest neu, weil ich mich bisher immer davor gesträubt hab.
Aber man kommt halt einfach nicht mehr drum herum...
Hab auch hier schon im Forum viel durchgelesen und auch in der Doku, komm aber irgendwie nicht ganz klar damit.
Bin ja auch kein Profi so wie ihr
wie muss ich Schritt für Schritt vorgehen und was muss ich einstellen, bzw. welche Dateien und welchen Code muss ich wo einfügen?
Ich hoffe hier hat jemand ein wenig Geduld für mich und kann mir helfen.
danke schon mal im Voraus!
Schöne Grüße Matze
responsive Navigation
Re: responsive Navigation
Die dort verwendete Navigation entsteht ja in Zusammenspiel von Bootstrap 3.x und phpwcms.
Wenn du Bootsrap im Hintergrund aktivierst, ist das Menü über ein simples {Replacement} von phpwcms aufrufbar, wodurch sich das Menü dann selber "erzeugt" aus den vorhandenen Navigations-Ebenen.
Aber wenn es dir in erster Linie auf eine responsive Navi geht, wäre die Variant mit einem mmenu vielleicht für den Anfang interessant und ggf. schneller umsetzbar. Siehe hier: http://mmenu.frebsite.nl
Wenn du Bootsrap im Hintergrund aktivierst, ist das Menü über ein simples {Replacement} von phpwcms aufrufbar, wodurch sich das Menü dann selber "erzeugt" aus den vorhandenen Navigations-Ebenen.
Aber wenn es dir in erster Linie auf eine responsive Navi geht, wäre die Variant mit einem mmenu vielleicht für den Anfang interessant und ggf. schneller umsetzbar. Siehe hier: http://mmenu.frebsite.nl
Re: responsive Navigation
ja, und wie geh ich bei der ersten Variante vor? Wie aktiviere ich Bootsrap im Hintergrund?
Dann brauch ich ja nur noch die Nav_List_UL und rufe diese dann mit dem Replacement Tag auf: {NAV_LIST_UL:P,0,,current|menu responsive-menu,current}, oder?
Dann brauch ich ja nur noch die Nav_List_UL und rufe diese dann mit dem Replacement Tag auf: {NAV_LIST_UL:P,0,,current|menu responsive-menu,current}, oder?
Re: responsive Navigation
Hier ist die Funktion und der komplette Dateisatz von Bootstrap zu bekommen und die Arbeitsweise ist beschrieben:
in ENGLISCH: http://getbootstrap.com
oder in DEUTSCH: http://holdirbootstrap.de
Hier steht, wie man startet:
http://holdirbootstrap.de/los-gehts/
bzw. welche Aufrufe in deinem Haupttemplate vorhanden sein müssen
Wenn du dir das HTML Muster in den Haupttemplatebereich lädst, hast du schon mal alle Bootstrap-Werkzeuge im Hintergrund Parat... dann nur noch ein paar Replacementtags {CONTENT} etc. einfügen... und du bist schon im Rennen.
Wenn du das hast, geht's an die Navigations-Anweisung per Replacemet-Tag ...
dann meldest du dich einfach hier noch einmal
in ENGLISCH: http://getbootstrap.com
oder in DEUTSCH: http://holdirbootstrap.de
Hier steht, wie man startet:
http://holdirbootstrap.de/los-gehts/
bzw. welche Aufrufe in deinem Haupttemplate vorhanden sein müssen
Wenn du dir das HTML Muster in den Haupttemplatebereich lädst, hast du schon mal alle Bootstrap-Werkzeuge im Hintergrund Parat... dann nur noch ein paar Replacementtags {CONTENT} etc. einfügen... und du bist schon im Rennen.
Wenn du das hast, geht's an die Navigations-Anweisung per Replacemet-Tag ...
dann meldest du dich einfach hier noch einmal
Re: responsive Navigation
ok, dann versuch ichs mal.
dankeschön schon mal
Und ich glaub ich werd mich auf jeden Fall hier nochmal melden
schöne Grüße
dankeschön schon mal
Und ich glaub ich werd mich auf jeden Fall hier nochmal melden
schöne Grüße
- Oliver Georgi
- Site Admin
- Posts: 9888
- Joined: Fri 3. Oct 2003, 22:22
- Contact:
Re: responsive Navigation
Schneller Erfolg gewünscht? Ist natürlich nur ein Beispiel und hilft sicherlich etwas besser zu verstehen.
In Deiner Vorlage einfach das hier einfügen:
In Deiner Vorlage einfach das hier einfügen:
Code: Select all
<!-- CSS:https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css -->
<!-- JS:https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js -->
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="./">phpwcms</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
{NAV_LIST_UL:PB,0,,active|nav navbar-nav|nav-sub,active}
</div>
</div>
</nav>
Re: responsive Navigation
wow! ich bin begeistert!
Das einzige, was jetzt nur nicht funktoniert ist das "Ausklappen" nch unten bei Unterseiten oder die Anzeige des Menü, wenn man auf den
Menübutton drückt (bei kleinen Bildschirm)
Hab ich was falsch gemacht?
Das einzige, was jetzt nur nicht funktoniert ist das "Ausklappen" nch unten bei Unterseiten oder die Anzeige des Menü, wenn man auf den
Menübutton drückt (bei kleinen Bildschirm)
Hab ich was falsch gemacht?
- Oliver Georgi
- Site Admin
- Posts: 9888
- Joined: Fri 3. Oct 2003, 22:22
- Contact:
Re: responsive Navigation
Beschäftige Dich intensiver mit dem Thema! Bootstrap Dropdowns sind per Default nicht Multilevel-fähig — doch dafür gibt es das Netz. Du bist nicht der Erste mit diesem Problem.
Und alles weitere, ja, vermutlich machst Du etwas falsch gemacht.
Und alles weitere, ja, vermutlich machst Du etwas falsch gemacht.