responsive Navigation

Hier bekommst Du deutschsprachigen Support. Keine Fehlermeldungen oder Erweiterungswünsche bitte!
Post Reply
matzeb
Posts: 94
Joined: Tue 29. Nov 2011, 06:10

responsive Navigation

Post by matzeb »

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 :D

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
Old Boy
Posts: 1203
Joined: Fri 23. Nov 2012, 13:52

Re: responsive Navigation

Post by Old Boy »

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
matzeb
Posts: 94
Joined: Tue 29. Nov 2011, 06:10

Re: responsive Navigation

Post by matzeb »

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?
Old Boy
Posts: 1203
Joined: Fri 23. Nov 2012, 13:52

Re: responsive Navigation

Post by Old Boy »

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 :D
matzeb
Posts: 94
Joined: Tue 29. Nov 2011, 06:10

Re: responsive Navigation

Post by matzeb »

ok, dann versuch ichs mal.
dankeschön schon mal :)
Und ich glaub ich werd mich auf jeden Fall hier nochmal melden :lol:

schöne Grüße
User avatar
Oliver Georgi
Site Admin
Posts: 9888
Joined: Fri 3. Oct 2003, 22:22
Contact:

Re: responsive Navigation

Post by Oliver Georgi »

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:

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>
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Систрон
matzeb
Posts: 94
Joined: Tue 29. Nov 2011, 06:10

Re: responsive Navigation

Post by matzeb »

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? :?
User avatar
Oliver Georgi
Site Admin
Posts: 9888
Joined: Fri 3. Oct 2003, 22:22
Contact:

Re: responsive Navigation

Post by Oliver Georgi »

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.
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Систрон
Post Reply