menu manager--different color links?

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
User avatar
velden
Dev Team Member
Dev Team Member
Posts: 3497
Joined: Mon Nov 28, 2011 9:29 am

Re: menu manager--different color links?

Post by velden »

Code: Select all

{menu template="cssmenu.tpl" number_of_levels='4'}
As far as I know this must be an 'file' template of menu-manager. (because of the .tpl extension).

I would suggest that you import the cssmenu.tpl template (see attached image). You must supply a name then (e.g. 'colored_menu').
Menu Manager
Menu Manager
Then change your code:

Code: Select all

{menu template="colored_menu" number_of_levels='4'}
If your site then still works :) try altering that colored_menu template.

Applied changed should be visible immediately after a refresh of the front-end webpage.

If you can't get it working with the colors, post your colored_menu template here. We must get this to work!
RyanC
Forum Members
Forum Members
Posts: 97
Joined: Fri Aug 05, 2011 9:02 pm

Re: menu manager--different color links?

Post by RyanC »

Hi velden,
I went to the menu manager and I see this is checked as my default:

Code: Select all

simple_navigation.tpl (read only)
I also see the cssmenu.tpl but I'm afraid of overwriting what I already have/ruining my menu. If I import this will it affect what I already have?
User avatar
velden
Dev Team Member
Dev Team Member
Posts: 3497
Joined: Mon Nov 28, 2011 9:29 am

Re: menu manager--different color links?

Post by velden »

No, it will NOT ruin anything. It will make a COPY of that template (with another name) in the database. Imported templates can be edited.

Nothing will change regarding the front end website. UNTIL you edit the new (imported) template AND you change the 'template' parameter in the PAGE template(s):

Code: Select all

{menu template="cssmenu.tpl" number_of_levels='4'}
to

Code: Select all

{menu template="<new name you've choosen>" number_of_levels='4'}
RyanC
Forum Members
Forum Members
Posts: 97
Joined: Fri Aug 05, 2011 9:02 pm

Re: menu manager--different color links?

Post by RyanC »

ok so I made the copy, gave it a name and put the code in the particular page template I am using. What part of this new menu template gets edited?
User avatar
velden
Dev Team Member
Dev Team Member
Posts: 3497
Joined: Mon Nov 28, 2011 9:29 am

Re: menu manager--different color links?

Post by velden »

I think all the answers to that question are already in this topic.

Nevertheless I did an (blind) attempt to alter the template (COPY YOUR TEMPLATE CONTENTS FIRST so you can revert quickly if necessary)

Code: Select all

{* CSS classes used in this template:
#menuwrapper - The id for the <div> that the menu is wrapped in. Sets the width, background etc. for the menu.
#primary-nav - The id for the <ul>
.menuparent - The class for each <li> that has children.
.menuactive - The class for each <li> that is active or is a parent (on any level) of a child that is active. *}

{assign var='number_of_levels' value=10000}
{if isset($menuparams.number_of_levels)}
  {assign var='number_of_levels' value=$menuparams.number_of_levels}
{/if}

{if $count > 0}
<div id="menuwrapper">
<ul id="primary-nav">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string='<ul class="unli">' 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->parent == true or $node->current == true}
  {assign var='classes' value='menuactive'}
  {if $node->parent == true}
    {assign var='classes' value='menuactive menuparent'}
  {/if}
  {if $node->children_exist == true and $node->depth < $number_of_levels}
    {assign var='classes' value=$classes|cat:' parent'}
  {/if}
  <li class="{$classes}{if $node->extra1} {$node->extra1}{/if}"><a class="{$classes}" 
{elseif $node->type == 'sectionheader' and $node->haschildren == true}
  <li class="menuparent{if $node->extra1} {$node->extra1}{/if}"><a class="menuparent"><span class="sectionheader">{$node->menutext}</span></a>
{elseif $node->type == 'sectionheader'}
  <li{if $node->extra1} class="{$node->extra1}"{/if}><a ><span class="sectionheader">{$node->menutext}</span></a>
{elseif $node->type == 'separator'}
  <li style="list-style-type: none;"> <hr class="menu_separator" />
{elseif $node->children_exist == true and $node->depth < $number_of_levels and $node->type != 'sectionheader' and $node->type != 'separator'}
  <li class="menuparent{if $node->extra1} {$node->extra1}{/if}"><a class="menuparent" 
{else}
  <li>
  <a 
{/if}

{if ($node->type != 'sectionheader' and $node->type != 'separator') or $node->parent == true or $node->current == true }
 {if $node->target}target="{$node->target}" {/if}
href="{$node->url}"><span>{$node->menutext}</span></a>
{/if}
{/foreach}
{repeat string='</li></ul>' times=$node->depth-1}
</li>
</ul>
<div class="clearb"></div>
</div>
{/if}

RyanC
Forum Members
Forum Members
Posts: 97
Joined: Fri Aug 05, 2011 9:02 pm

Re: menu manager--different color links?

Post by RyanC »

ok thanks for all your help velden. Once I get some time I'll try to figure out what I missed, I'm sure this will work out. I'll post an update once I have something. Thanks again.
Post Reply

Return to “Layout and Design (CSS & HTML)”