[SOLVED] Replace bullets with arrow image

[PolarWolf]

Hello,

I am using ellnav-vert.tpl that is floating around here, the problem is that I want to use an image of a right arrow instead of the default bullets, with the code below it displays both:

Code: Select all

{* CSS classes used in this template:
.current - The current page in the vertical (local) menu. 
.bullet_sectionheader - To style section header
hr.separator - To style the ruler for the separator *} 

{if $count > 0}
<ul class="menu_horiz">
{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 class="current"><a class="current" href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>
{elseif $node->type == 'sectionheader'}
<li><span class="bullet_sectionheader">{$node->menutext}</span>
{elseif $node->type == 'separator'}
<hr class="separator" />
{else}
<li style="list-style-image: url('uploads/images/arrow.png') ">
<li><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>{/if}
{/foreach}

{repeat string="</li></ul>" times=$node->depth-2}</li>
</ul>
{/if}

Any help will be much appreciated.

Regards,
Wolf

[uniqu3]

I think your problem should be fixed by adding in your css

.menu_horiz ul {liste-style:none;}

I am not sure if menu_horiz ul is the right place or even exists in your css but bullet is default for list-style somthing so with setting it to none bullet should no longer be visible.

[RJK]

First off you need to get hold of an image of an arrow that you're happy using. You can easily substitute the standard bullets etc... which are part of CSS by entering something like the following in your CSS file:

ul#menu_horiz {
list-style-image:url(images/arrow.gif) }

Obviously change arrow.gif to whatever your image is actually called.

[PolarWolf]

Thank you, that did the trick!

Regards,