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.6 is now available!


Will it continue with WB? It goes on! | Geht es mit WB weiter? Es geht weiter!
https://forum.websitebaker.org/index.php/topic,32340.msg226702.html#msg226702


The forum email address board@websitebaker.org is working again
https://forum.websitebaker.org/index.php/topic,32358.0.html


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 »
  • Twitter Bootstrap
  • Print
Pages: [1]   Go Down

Author Topic: Twitter Bootstrap  (Read 7070 times)

Offline Bart Raymakers

  • Posts: 38
Twitter Bootstrap
« on: June 01, 2013, 09:59:27 AM »
Does anyone have experience with bootstrap in combination with WebsiteBaker?
I wanted to create a responsive menu with dropdown menus. The rest is no problem I think.

I can easily set up a 'navigation bar '. Bootstrap uses the class "active" for the menu item of the current active page. Showmenu_2 uses the class "current-menu". Renaming those classes won't do it... So creating a responsive menu with dropdown menus is certainly not going to be easy!

Bootstrap and Website baker would be a fantastic combination ... If it works of course.

Pleasy, is there somebody who can help me?
Regards and thanks in advance! Bart
Logged

Offline Stefek

  • Posts: 6177
  • Gender: Male
  • ("ړ)
Re: Twitter Bootstrap
« Reply #1 on: June 01, 2013, 11:26:49 AM »
Quote from: Bart Raymakers on June 01, 2013, 09:59:27 AM
I can easily set up a 'navigation bar '. Bootstrap uses the class "active" for the menu item of the current active page. Showmenu_2 uses the class "current-menu". Renaming those classes won't do it... So creating a responsive menu with dropdown menus is certainly not going to be easy!
Hello Bart,

you can easily make the show_menu2 Function to rename the "current-menu" state to a phrase you want.

There are lots of possibilities with show_menu2. In doubt, read the documentation file (you'll find it in the show_menu2 directory).
Here is just a example how you could rename menu-current to active

Code: [Select]
<?php

show_menu2
(
0, 
SM2_ROOT, 
SM2_CURR+2, 
SM2_ALL, 

                
// here
'<li class="[if(class=menu-current){ active}]">'.

                                
// and here
'<a[if(class=menu-current){ class="active"}] href="[url]">'.

'<span>[menu_title]</span>'.
'</a>',

"</li>", 
'<ul[if(level=0){ class="topmenu" }][if(level=1){ class="submenu" }]>',
'</ul>'
);

Let me know if it helps.

Stefek
Logged
"Gemeinsam schafft man mehr."

gemeinsam
1. mehreren Personen oder Dingen in gleicher Weise gehörend, eigen
2. in Gemeinschaft [unternommen, zu bewältigen]; zusammen, miteinander
#Duden

Offline Bart Raymakers

  • Posts: 38
Re: Twitter Bootstrap
« Reply #2 on: June 01, 2013, 02:14:24 PM »
Hi Steffek,

you certainly got me on the right way! After changing a little bit of code, I have a nice bootstrap-menu!
For creating a navbar with submenus I need to change some ID's and classes.

Thanks to you I understand the conditional aspect of Showmenu_2.
I'm not that good at PHP, even after reading the manual several times I didn't understand it a 100 %.

When you're in Belgium a buy you a beer!  :wink:
Logged

Offline Stefek

  • Posts: 6177
  • Gender: Male
  • ("ړ)
Re: Twitter Bootstrap
« Reply #3 on: June 01, 2013, 02:36:04 PM »
Quote from: Bart Raymakers on June 01, 2013, 02:14:24 PM
When you're in Belgium a buy you a beer!  :wink:
Thanks.

Actaully you can change anything in the output of the show_menu2

Here is an example of a working menu I created once:

Code: [Select]
<?php
$sItemOpen 
=  '<li class="level[level]'.
'[if(class=menu-expand){ expandable_[level]}]'.
                
'[if(level=0){ top_[page_id]}]'.
'[if(class=menu-current || class=menu-parent){ selected}]"'.
'>'.
'<a if(class=menu-current){ class="selected"}] href="[url]">'.
'<span>[menu_title]</span>'.
'</a>';
$main_menu = show_menu2(
0, 
SM2_ROOT, 
SM2_CURR+2, 
SM2_ALL | SM2_BUFFER, 
$sItemOpen,
"</li>", 
'[if(level=1){<span class="haschilds"></span>}]<ul[if(level=0){ class="topmenu" }][if(level=1){ class="submenu" }]>',
"</ul>".
'' 

);
echo 
$main_menu;

With the "SM2_BUFFER" Flag, you can put your show_menu2 call into a variable (in my case $main_menu).
Doing so, you can place your Code somewhere on the top of the page (or even in a different file) and then print the content of the variable with "echo $main_menu;"

You can use level and many other conditions to get the menu-behavior you need and want.
Glad could help.

Have a nice WE.
Stefek
Logged
"Gemeinsam schafft man mehr."

gemeinsam
1. mehreren Personen oder Dingen in gleicher Weise gehörend, eigen
2. in Gemeinschaft [unternommen, zu bewältigen]; zusammen, miteinander
#Duden

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

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