Highlighting Current Menu
-
- Forum Members
- Posts: 38
- Joined: Wed May 22, 2013 8:11 am
Highlighting Current Menu
I want to highlight current menu in my CMS MS website, I have created my own HTML template for home and inner pages and I am applying same inner page template to all inner pages, but I am unable to highlight the current menu item because navigation I have used is static in template itself.
Is there any tag, which can be used for highlighting current menu? Until now I am creating separate template for all pages and then applying that to related inner page for highlighting current menu, which is lengthy process because If I have 50 pages then I do not want to crate 50 template and then 50 pages.
Please let me know if any confusion in question.
Is there any tag, which can be used for highlighting current menu? Until now I am creating separate template for all pages and then applying that to related inner page for highlighting current menu, which is lengthy process because If I have 50 pages then I do not want to crate 50 template and then 50 pages.
Please let me know if any confusion in question.
Re: Highlighting Current Menu
Why do you want to have static menus?
MenuManager module is built to handle most possible situations. And using MenuManager means too highlight the current menu entry.
But not using MenuManager means to use only the half CMSMS power .
MenuManager module is built to handle most possible situations. And using MenuManager means too highlight the current menu entry.
But not using MenuManager means to use only the half CMSMS power .
Re: Highlighting Current Menu
You can use Smarty conditionals in your template to detect which page you're on and apply a class.
For example {$page_alias} will tell you what the alias of the page you're on is, so you could write out your menu like:
If you want to find make the parent of a subpage active then you'll need to find the alias of the parent page. You can either use CGExtensions which includes a tag for that you can write a user defined tag.
Rolf has an example of a UDT here: https://www.cmscanbesimple.org/blog/get ... ents-alias
You can do more complicated things using smarty in the templates but you should probably be looking at using MenuManager if you want to do much more than this.
For example {$page_alias} will tell you what the alias of the page you're on is, so you could write out your menu like:
Code: Select all
<a href="hats.html" class="{if $page_alias eq 'hats'} active {/if}">Hats</a>
Rolf has an example of a UDT here: https://www.cmscanbesimple.org/blog/get ... ents-alias
You can do more complicated things using smarty in the templates but you should probably be looking at using MenuManager if you want to do much more than this.
-
- Forum Members
- Posts: 38
- Joined: Wed May 22, 2013 8:11 am
Re: Highlighting Current Menu
The design that I want for my menu is different and I am unable to get same from menu manager at desired location. But still I will give one more try with menu manager as it will be easy in future as well, if I can learn to play with this because I have faced this issue for many of my website like this.singhabhishek251 wrote:I want to highlight current menu in my CMS MS website, I have created my own HTML template for home and inner pages and I am applying same inner page template to all inner pages, but I am unable to highlight the current menu item because navigation I have used is static in template itself.
Is there any tag, which can be used for highlighting current menu? Until now I am creating separate template for all pages and then applying that to related inner page for highlighting current menu, which is lengthy process because If I have 50 pages then I do not want to crate 50 template and then 50 pages.
Please let me know if any confusion in question.
-
- Forum Members
- Posts: 38
- Joined: Wed May 22, 2013 8:11 am
Re: Highlighting Current Menu
Thanks for the reply, I think this is a perfect solution for me if I can get this as explained because I got tired by searching into Google with different search terms and then I remembered about this forum to get help. Thanks for your time. Just for confirmation and better understanding I am writing what I understood from your post, please confirm once if it is correct. Is this a correct code as given below, where "active" is a class name?scooper wrote:You can use Smarty conditionals in your template to detect which page you're on and apply a class.
For example {$page_alias} will tell you what the alias of the page you're on is, so you could write out your menu like:
If you want to find make the parent of a subpage active then you'll need to find the alias of the parent page. You can either use CGExtensions which includes a tag for that you can write a user defined tag.Code: Select all
<a href="hats.html" class="{if $page_alias eq 'hats'} active {/if}">Hats</a>
Rolf has an example of a UDT here: https://www.cmscanbesimple.org/blog/get ... ents-alias
You can do more complicated things using smarty in the templates but you should probably be looking at using MenuManager if you want to do much more than this.
Code: Select all
<a href="about-us.html" class="{if $page_alias eq 'about-us'} active {/if}">About Us</a>
<a href="services.html" class="{if $page_alias eq 'services'} active {/if}">Services</a>
<a href="contact.html" class="{if $page_alias eq 'contact'} active {/if}">Contact</a>
Re: Highlighting Current Menu
I built only one site where I did NOT use menu manager: And probably, if I really wanted it to, I could have used Menu Manager.The design that I want for my menu is different and I am unable to get same from menu manager at desired location.
I don't see why you can't use it for your website. Note that the Menu Manager templates make it possible to almost every menu that has some logical structure.
Re: Highlighting Current Menu
Velden is right that menu manager is well worth getting to know and might save you time later on - but that code looks ok to me - give it a go.singhabhishek251 wrote:Code: Select all
<a href="about-us.html" class="{if $page_alias eq 'about-us'} active {/if}">About Us</a> <a href="services.html" class="{if $page_alias eq 'services'} active {/if}">Services</a> <a href="contact.html" class="{if $page_alias eq 'contact'} active {/if}">Contact</a>
And btw - since we're in the accessibility section of the forum - it's not the issue it once was but it's best practice not to have immediately adjacent links. You should make sure you put a separator between your menu items.
Re: Highlighting Current Menu
What you are trying to do is exactly what menu manager does, I haven't found a menu that can't be done using Menu Manager...
I made one that will do this menu...
http://www.alinga.com.au/
I made one that will do this menu...
http://www.alinga.com.au/
-
- Forum Members
- Posts: 38
- Joined: Wed May 22, 2013 8:11 am
Re: Highlighting Current Menu
Thanks.scooper wrote:Velden is right that menu manager is well worth getting to know and might save you time later on - but that code looks ok to me - give it a go.singhabhishek251 wrote:Code: Select all
<a href="about-us.html" class="{if $page_alias eq 'about-us'} active {/if}">About Us</a> <a href="services.html" class="{if $page_alias eq 'services'} active {/if}">Services</a> <a href="contact.html" class="{if $page_alias eq 'contact'} active {/if}">Contact</a>
And btw - since we're in the accessibility section of the forum - it's not the issue it once was but it's best practice not to have immediately adjacent links. You should make sure you put a separator between your menu items.
May be I have never worked with menu manager or I think I assumed that it will not work that way made me struggle a lot, but thanks for the support that I got here. I am going to explore menu manager.
Thanks again for saving me with this solution and this has saved a lot of time for me because I was not having time for experiment at this time, but going to learn after this website.
-
- Forum Members
- Posts: 38
- Joined: Wed May 22, 2013 8:11 am
Re: Highlighting Current Menu
The website menu reference that you have given is really wonderful and I have not imagined such a beautiful menu design until now.Dr.CSS wrote:What you are trying to do is exactly what menu manager does, I haven't found a menu that can't be done using Menu Manager...
I made one that will do this menu...
http://www.alinga.com.au/
I am going to bookmark your website for future reference and going to give some extra time for menu manager also to understand it.
-
- Forum Members
- Posts: 38
- Joined: Wed May 22, 2013 8:11 am
Re: Highlighting Current Menu
Hi,scooper wrote:You can use Smarty conditionals in your template to detect which page you're on and apply a class.
For example {$page_alias} will tell you what the alias of the page you're on is, so you could write out your menu like:
If you want to find make the parent of a subpage active then you'll need to find the alias of the parent page. You can either use CGExtensions which includes a tag for that you can write a user defined tag.Code: Select all
<a href="hats.html" class="{if $page_alias eq 'hats'} active {/if}">Hats</a>
Rolf has an example of a UDT here: https://www.cmscanbesimple.org/blog/get ... ents-alias
You can do more complicated things using smarty in the templates but you should probably be looking at using MenuManager if you want to do much more than this.
I am sorry to disturb you once again.
For highlighting parent of subpage can I use code as given below, where hats is "subpage" of "accessories":
Code: Select all
<a href="hats.html" class="{if $root_page_alias eq 'accessories'} active {/if}">Hats</a>
I was unable to try this live in my project because it is in initial phase itself, so I thought to ask you because once after starting I need not to struggle and switch to anything else. That is the reason I was trying to clear my doubts before finalizing anything.
Thanks for the help, I have started loving CMS MS because of you guys support else I was fearing from using this.
I am a regular WP user, but I think now that CMS MS is also easy to handle.
In the mean time if anyone can share some tutorial with me about using menu manager and using our own menu template, then it would be great help. I also wanted to learn how to use our own menu template with menu manager.
Re: Highlighting Current Menu
That's not what you want probably.
Note that you need to create the UDT first AND you need to call it first.
Then you want to check if you need to highlight the 'active parent'. Then you should not add a class to the child.
That said: use Menu Manager!
Note that you need to create the UDT first AND you need to call it first.
Code: Select all
{get_root_page_alias}
Code: Select all
<a href="#" class="{if $root_page_alias eq 'accessories'} activeparent{/if}">Accessories</a>
-
- Forum Members
- Posts: 38
- Joined: Wed May 22, 2013 8:11 am
Re: Highlighting Current Menu
I have created UDT, but where to place thisvelden wrote:That's not what you want probably.
Note that you need to create the UDT first AND you need to call it first.
Then you want to check if you need to highlight the 'active parent'. Then you should not add a class to the child.Code: Select all
{get_root_page_alias}
That said: use Menu Manager!Code: Select all
<a href="#" class="{if $root_page_alias eq 'accessories'} activeparent{/if}">Accessories</a>
Code: Select all
{get_root_page_alias}
Please bear with me as I am new to this CMS MS, but getting interest with all your support here.
I have Placed in header of template: {get_root_page_alias}
Then, below code I am using in Navigation, but it is not highlighting 'About Us' tab
Code: Select all
<li><a href="index.php?page=ceo-president-message" class="{if $root_page_alias eq 'about-us'} active{/if}">CEO & President Message</a></li>
Re: Highlighting Current Menu
Note that the <head> section of a template is processed AFTER the </__body> section.
I would suggest to put the {get_root_page_alias} at the VERY top of the page template. So really as the first line of template before anything else.
Then somewhere in your </__body >you could just put
and see of it actually prints a value.
If it does, you can start using conditional statements inside menu.
That said: use Menu Manager!
I would suggest to put the {get_root_page_alias} at the VERY top of the page template. So really as the first line of template before anything else.
Then somewhere in your </__body >you could just put
Code: Select all
root: {$root_page_alias}
If it does, you can start using conditional statements inside menu.
That said: use Menu Manager!
-
- Forum Members
- Posts: 38
- Joined: Wed May 22, 2013 8:11 am
Re: Highlighting Current Menu
Yes, it is printing the value.velden wrote:Note that the <head> section of a template is processed AFTER the </__body> section.
I would suggest to put the {get_root_page_alias} at the VERY top of the page template. So really as the first line of template before anything else.
Then somewhere in your </__body >you could just putand see of it actually prints a value.Code: Select all
root: {$root_page_alias}
If it does, you can start using conditional statements inside menu.
That said: use Menu Manager!
But I do not know how to use conditional statements inside menu for this.
I am placing like below, but no luck. Here I want to highlight "About Us" tab when some one is at "CEO & President Message" tab these are parent and child respectively.
Code: Select all
<li><a href="index.php?page=ceo-president-message" class="{if $root_page_alias eq 'about-us'} active{/if}">CEO & President Message</a></li>