Possible to change just one menu item color?
Possible to change just one menu item color?
I am far from a stylesheet expert but my initial guess is what I want to do is not possible. I would like to change just ONE menu item to bright yellow for color. From what I see not possible to do with this template/stylesheet?
Attached both as text files as pasting here exceeds character limit.
Re: Possible to change just one menu item color?
Well, it usually is perfectly possible. However, it would require a little customization of the menu template.
For example: you could use the menu manager template to add the alias as an id/class to the menu-item.
Then use a stylesheet to give a specific id/class the yellow color.
For example: you could use the menu manager template to add the alias as an id/class to the menu-item.
Then use a stylesheet to give a specific id/class the yellow color.
Re: Possible to change just one menu item color?
Thank you Velden!
No idea how to do this (yet) but you have at least helped me in that now I know what I need to learn to do! Thank you.
No idea how to do this (yet) but you have at least helped me in that now I know what I need to learn to do! Thank you.
Re: Possible to change just one menu item color?
Use menu manager to import menu template to database (use icon behind the default templates)
For this example I imported 'minimal_menu.tpl (read only)' and called it 'minimal'. This one you can edit.
From Menu manager help:
Add page alias as a class:
Use extra1 value to add color:
On the Options tab of the specific page you should then type a valid css color value in the 'Extra Page Attribute 1' text input. (e.g. 'yellow' or '#FFFF00' without the quotes)
ps. I did not test the code above so it might contain errors
For this example I imported 'minimal_menu.tpl (read only)' and called it 'minimal'. This one you can edit.
From Menu manager help:
So, now you can change the template to include either (or both) a class name based on alias or a inline style based on extra1 value (extra1-3 are on options tab of Edit page in admin).$node->alias -- Page alias
$node->extra1 -- This field contains the value of the extra1 page property, unless the loadprops-parameter is set to NOT load the properties.
Add page alias as a class:
Code: Select all
{* CSS classes used in this template:
.currentpage - The active/current page
.bullet_sectionheader - To style section header
hr.separator - To style the ruler for the separator *}
{if $count > 0}
<ul class="clearfix">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true}
<li><a href="{$node->url}" class="currentpage {$node->alias}"{if $node->target ne ""} target="{$node->target}"{/if}> {$node->menutext} </a>
{elseif $node->parent == true && $node->depth == 1 and $node->type != 'sectionheader' and $node->type != 'separator'}
<li class="activeparent"> <a href="{$node->url}" class="activeparent {$node->alias}"{if $node->target ne ""} target="{$node->target}"{/if}> {$node->menutext} </a>
{elseif $node->type == 'sectionheader'}
<li class="sectionheader {$node->alias}">{$node->menutext}
{elseif $node->type == 'separator'}
<li style="list-style-type: none;"> <hr class="separator" />
{else}
<li><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if} class="{$node->alias}"> {$node->menutext} </a>
{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
On the Options tab of the specific page you should then type a valid css color value in the 'Extra Page Attribute 1' text input. (e.g. 'yellow' or '#FFFF00' without the quotes)
Code: Select all
{if !empty($node->extra1)} style="color:{$node->extra1};"{/if}
Code: Select all
{* CSS classes used in this template:
.currentpage - The active/current page
.bullet_sectionheader - To style section header
hr.separator - To style the ruler for the separator *}
{if $count > 0}
<ul class="clearfix">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true}
<li><a href="{$node->url}" class="currentpage"{if $node->target ne ""} target="{$node->target}"{/if}{if !empty($node->extra1)} style="color:{$node->extra1};"{/if}> {$node->menutext} </a>
{elseif $node->parent == true && $node->depth == 1 and $node->type != 'sectionheader' and $node->type != 'separator'}
<li class="activeparent"> <a href="{$node->url}" class="activeparent"{if $node->target ne ""} target="{$node->target}"{/if}{if !empty($node->extra1)} style="color:{$node->extra1};"{/if}> {$node->menutext} </a>
{elseif $node->type == 'sectionheader'}
<li class="sectionheader"{if !empty($node->extra1)} style="color:{$node->extra1};"{/if}>{$node->menutext}
{elseif $node->type == 'separator'}
<li style="list-style-type: none;"> <hr class="separator" />
{else}
<li><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}{if !empty($node->extra1)} style="color:{$node->extra1};"{/if}> {$node->menutext} </a>
{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
Re: Possible to change just one menu item color?
So far unable to get this to work without errors .
I copied the menu template, made the changes, and then set the template to use the changed menu.
Unable to load template module_db_tpl 'MenuManager;tpl-buddy-006JEFFONLY'
Must be some way to do what would be a very simple thing outside of CMSMS?
I copied the menu template, made the changes, and then set the template to use the changed menu.
Unable to load template module_db_tpl 'MenuManager;tpl-buddy-006JEFFONLY'
Must be some way to do what would be a very simple thing outside of CMSMS?
-
- Support Guru
- Posts: 8169
- Joined: Tue Oct 19, 2004 6:44 pm
- Location: Fernie British Columbia, Canada
Re: Possible to change just one menu item color?
instead of logic like this:
{if !empty($node->extra1)} style="color:{$node->extra1};"{/if}
I would just add {$node->alias} to the class section.
then you could style the menu items for each page any way you wanted in CSS.
{if !empty($node->extra1)} style="color:{$node->extra1};"{/if}
I would just add {$node->alias} to the class section.
then you could style the menu items for each page any way you wanted in CSS.
Follow me on twitter
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.
Re: Possible to change just one menu item color?
Thanks for the effort but none of this is working at all - likely due to me.
Looks like we'll have to hire someone to do this for us.
Thanks again though!
Looks like we'll have to hire someone to do this for us.
Thanks again though!
Re: Possible to change just one menu item color?
Feel free to contact me (private message) or post in the 'Commercial Help' forum http://forum.cmsmadesimple.org/viewforum.php?f=34