WebsiteBaker Logo
  • *
  • Templates
  • Help
  • Add-ons
  • Download
  • Home
*
Welcome, Guest. Please login or register.

Login with username, password and session length
 

News


WebsiteBaker 2.13.8 is now available!


R.I.P Dietmar (luisehahne) and thank you for all your valuable work for WB
https://forum.websitebaker.org/index.php/topic,32355.0.html


* Support WebsiteBaker

Your donations will help to:

  • Pay for our dedicated server
  • Pay for domain registration
  • and much more!

You can donate by clicking on the button below.


  • Home
  • Help
  • Search
  • Login
  • Register

  • WebsiteBaker Community Forum »
  • WebsiteBaker Support (2.8.x) »
  • Templates, Menus & Design »
  • Showmenu 2 Bootstrap 3.3 menu code
  • Print
Pages: [1]   Go Down

Author Topic: Showmenu 2 Bootstrap 3.3 menu code  (Read 21990 times)

Offline nibz

  • Posts: 684
  • Gender: Male
Showmenu 2 Bootstrap 3.3 menu code
« on: October 31, 2017, 07:54:53 PM »
The working code for a default bootstrap 3.3 navbar, so you don't have to reinvent the wheel.

When you use the menu on root.

Code: [Select]
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <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="#">Brand</a>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<?php 
$open = '<li class="[if(class=menu-current||class=menu-parent){active}] [if(class==menu-expand){dropdown}]">
[if(class==menu-expand){<a href="[url]" class="dropdown-toggle" data-toggle="dropdown">[menu_title]<b class="caret"></b></a>}
else {<a href="[url]">[menu_title]</a>}]'
;
show_menu2(
$aMenu          = 1,
$aStart         = SM2_ROOT, 
$aMaxLevel      = SM2_CURR+1,
$aOptions       = SM2_ALL,
$aItemOpen      = $open,
$aItemClose     = '</li>',
$aMenuOpen      = '<ul class="[if(level==0){nav navbar-nav} else {dropdown-menu}]">',
$aMenuClose     = '</ul>',
$aTopItemOpen   = false,
$aTopMenuOpen   = false
);?>

    </div>
</div>
</nav>
« Last Edit: October 31, 2017, 08:04:41 PM by nibz »
Logged

johnbroeckaert

  • Guest
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #1 on: October 31, 2017, 08:00:32 PM »
 :-D
THANKS!
Logged

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #2 on: October 31, 2017, 08:05:25 PM »
@johnbroeckaert no thanks :).
Changed a little thing so if you copied the code please replace it by the new one
Logged

Offline rumen

  • Posts: 480
  • Gender: Male
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #3 on: November 04, 2017, 01:26:40 AM »
I use that code, but instead of this the menu appears like this. Couldn't find why.
Logged

Offline jacobi22

  • Betatester
  • **
  • Posts: 5921
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #4 on: November 04, 2017, 01:45:03 AM »
please add somewhere in a HTML-area of your template / index.php this code here to show the actual level of this page - best position: somewhere in the top or in the footer of your page

Code
Code: [Select]
<?php
echo "Level: ".LEVEL;
?>

i'm sure, it's only a question of the level
(was this not a multi-lingual page before??)

important is this line in the code from nibz and specially the red marked part. if you're not in the root of your page tree (in level = 0), play with this, use level = 1 or what ever you have there. This Level switch is the different between your two links

Quote
$aMenuOpen      = '<ul class="[if(level==0){nav navbar-nav} else {dropdown-menu}]">',
Logged

Offline rumen

  • Posts: 480
  • Gender: Male
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #5 on: November 04, 2017, 01:51:51 AM »
It is below the footer, it shows Level=0 and there is no any chage in the menu. Never mind. It works, that's most important.
Logged

Offline jacobi22

  • Betatester
  • **
  • Posts: 5921
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #6 on: November 04, 2017, 09:48:07 AM »
it's simple, if your compare both menu's in the source code

the target: ul class="sub-menu"  ++ a-href use # instead of the url

i try to explain and hope you can understand this

Quote
$open = '<li class="[if(class=menu-current||class=menu-parent){active}] [if(class==menu-expand){dropdown}]">
         [if(class==menu-expand){<a href="[url]" class="dropdown-toggle" data-toggle="dropdown">[menu_title]<b class="caret"></b></a>}
         else {<a href="[url]">[menu_title]</a>}]';

blue = the condition - if class == menu-expand - means: if there are child's at this menu point

red: the reaction, if this condition is true - <a href="[url]" class="dropdown-toggle" data-toggle="dropdown">

you need here a simple <a href="#"> instead of the red line like

Code: [Select]
$open = '<li class="[if(class=menu-current||class=menu-parent){active}] [if(class==menu-expand){dropdown}]">
         [if(class==menu-expand){<a href="#">[menu_title]<b class="caret"></b></a>}
         else {<a href="[url]">[menu_title]</a>}]';


next point
Quote
$aMenuOpen      = '<ul class="[if(level==0){nav navbar-nav} else {dropdown-menu}]">',

red: the condition  - if level == 0 - means: if you're in the root of your page tree

red: answer, if the condition is true (level 0 only)

green: answer, if condition is false (level 1 and higher)

what you need, is a different class (sub-menu) instead of dropdown-menu.
Solution:

Code: [Select]
$aMenuOpen      = '<ul class="[if(level==0){nav navbar-nav} else {sub-menu}]">',
Result: works for me  ;-)
Logged

Offline rumen

  • Posts: 480
  • Gender: Male
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #7 on: November 04, 2017, 12:26:05 PM »
Thanks buddy! With this code really wors fine. Thank you onse again!
Logged

Offline macsmet

  • Posts: 255
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #8 on: March 27, 2018, 08:25:44 PM »
Hi there,

Is it correct that a bootstrap menu (like mentioned here) doesn't open a URL to a new page?
Even when you set in in WB to open the link with _blank?

Greetings,

William
Logged

Offline dbs

  • Betatester
  • **
  • Posts: 8920
  • Gender: Male
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #9 on: March 27, 2018, 10:50:34 PM »
Hi, if you need target you have to add it like so
Code: [Select]
<a href="[url]" target="[target]" ...
Logged
https://onkel-franky.de

Offline macsmet

  • Posts: 255
Re: Showmenu 2 Bootstrap 3.3 menu code
« Reply #10 on: March 28, 2018, 08:48:53 AM »
Thanks!
Logged

  • Print
Pages: [1]   Go Up
  • WebsiteBaker Community Forum »
  • WebsiteBaker Support (2.8.x) »
  • Templates, Menus & Design »
  • Showmenu 2 Bootstrap 3.3 menu code
 

  • SMF 2.0.19 | SMF © 2017, Simple Machines
  • XHTML
  • RSS
  • WAP2