WebsiteBaker Support (2.8.x) > Templates, Menus & Design
Can I have a nav menu of text links AND images?
Ruud:
--- Quote from: seanie_morris on August 27, 2015, 11:56:29 AM ---...relevant for each language button I want displayed, but it's not showing the image icon.
--- End quote ---
Currently it has no images in the top menu.
Can you "reset" the menu to the point it should show the image?
crnogorac081:
You can use if in show_menu2 code:
--- Code: ---In show_menu2 find line for
$aItemFormat = '
[if(page_id==X1){[a]<img src=" .WB_URL ."/media/flags/[menu_title].gif />[/a] }]
[if(page_id==X2){[a]<img src=" .WB_URL ."/media/flags/[menu_title].gif />[/a] }]
[if(page_id==X3){[a]<img src=" .WB_URL ."/media/flags/[menu_title].gif />[/a] }]
',
--- End code ---
Under /media folder , create folder flags, and inside put images fre.gif, ger.gif ...etcc
Find page_id in Pages for page fre.php and replace X1 with its number.
Do the same for other pages for which you have images name.gif under /flags, and dont forget to put as menu lines as you need in $aItemFormat (code above)...
I hope it helps.. If you dont know how to do it contact me via pm, ill help you out and we will post the correct code on forum..
cheers
DarkViper:
another solution:
--- Code: ---<?php
show_menu2(
$aMenu,
$aStart,
$aMaxLevel,
$aOptions,
'[li][a][if(target==_self){<img src="'.WB_URL.'/templates/'.TEMPLATE.
'/flags/[menu_title].gif" alt="[menu_title]">}else{[memu_title]}]</a>',
'[/li]',
'[ul]',
'[/ul]',
false,
false
);
--- End code ---
This solution needs no modification in the PHP-code if something (more/less
pages and so on) becomes changed.
To toogle a menu item from text to icon in first step simply place the icon
in the (new) subfolder templates/#my_template#/flags/ with the same filename
as the [menu_title] and extension i.e. '.gif'
As second step switch the target of the page from 'top frame'(default) to 'self frame'
that's all.... have fun.
Manuela
crnogorac081:
Not sure why Manuela, but the code is not producing images.. *(there was a typo in else{[meNu_title]} but still it was not working )
I was playing with a code and here is a solution:
open nav.php (from bs_naturak/snippet) and replace $open with
--- Code: ---$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]" class="pid[page_id]">[menu_title]</a>}]';
--- End code ---
Notice I added class="pid[page_id]" with which we will match menu items to replace with images.
Now locate line
--- Code: ---$topnav = ob_get_contents();
and add line below it:
$topnav = preg_replace('/<a (.*?) class="pid(5|6)">(.*?)<\/a>/', '<a $1><img src="'.TEMPLATE_DIR.'/flags/'.strtolower("$3").'.png" /></a>', $topnav);
--- End code ---
Notice pid(5|6) ! 5 and 6 are page_id-s for which we need images. so you can add more and separate with pipe | for example 5|6|10|25|100
in bs_naturak create folder /flags and put images there. Image names must be same as menu name but lowercase eg: if menu name is Ger image is ger.png
cheers,
I.
seanie_morris:
:-D :-D :-D
--- Quote from: crnogorac081 ---open nav.php (from bs_naturak/snippet) and replace $open with
--- Code: ---$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]" class="pid[page_id]">[menu_title]</a>}]';
--- End code ---
Notice I added class="pid[page_id]" with which we will match menu items to replace with images.
Now locate line
--- Code: ---$topnav = ob_get_contents();
and add line below it:
$topnav = preg_replace('/<a (.*?) class="pid(5|6)">(.*?)<\/a>/', '<a $1><img src="'.TEMPLATE_DIR.'/flags/'.strtolower("$3").'.png" /></a>', $topnav);
--- End code ---
Notice pid(5|6) ! 5 and 6 are page_id-s for which we need images. so you can add more and separate with pipe | for example 5|6|10|25|100
in bs_naturak create folder /flags and put images there. Image names must be same as menu name but lowercase eg: if menu name is Ger image is ger.png
--- End quote ---
This is the solution that worked, thanks crnogorac081! Though, I did have to put the full website path in instead of '.TEMPLATE_DIR.'/flags to get it to work, but it works!
I can also remove the Code section of the pages in question and have just the WYSIWYG section as where relevant, the snippet for nav.php does the trick.
Thanks also Ruud and DarkViper for the input!
Is it worth putting up a sticky to highlight this little hack? It seems to have worked without errors for me, and I know from past history looking back on a search on these forums that it popped up a lot in the past with most threads still 'open' with no solution.
Seanie.
P.S. If a Mod can add [SOLVED] in the thread/topic title, that would be great!
Navigation
[0] Message Index
[#] Next page
[*] Previous page
Go to full version