how to add HTML CMenu in yii

Question

Hope you are all doing well. I have been trying to implement CMenu in Yii template. I am using,

$this->widget('zii.widgets.CMenu', array(
            'items'=>$this->menu,
            'htmlOptions'=>array('class'=>'collapse','id'=>'component-nav'),
));

And I want to dislpay my HTML output as

<li class=""><a href="icon.html"><i class="icon-angle-right"></i> List Registration </a></li>

But I can not insert this section: <i class="icon-angle-right"></i> beside the label ie "List Registration". Is there any way to insert this <i class="icon-angle-right"></i> html part beside every label of item.

Please help me someone.

Thanks in advance

Answer 1

A quick dirty way:

$this->menu = array_map(function($item){
        $item["label"] = "<i class='icon-angle-right'></i>" . $item["label"];
        $item["encodeLabel"] = false;
        return $item;
}, $this->menu);

$this->widget('zii.widgets.CMenu', array(
            'items'=>$this->menu,
            'htmlOptions'=>array('class'=>'collapse','id'=>'component-nav'),
));

Answer 2

Information from http://www.yiiframework.com/wiki/525/customizing-the-cmenu-widget/

1. Disable HTML encoding 'encodeLabel' => false,
2. Submenu change class 'submenuHtmlOptions' => array('class' => 'dropdown-menu',)
3. Use label property 'label' => '<i class="icon-user"></i><span class="username">Admin</span> <i class="icon-angle-down"></i>', Very useful with bootstrap
4. Use YII url property for correct adress ie 'url' => array('site/logout'),

Answer 3

I don't think Yii provides a way to add a html element inside a according to the class reference (yiiframework.com/doc/api/1.1/CMenu). If you want to do it the css way:

#component-nav li a { 
     background: url('path/to/image.png') no-repeat; 
     padding-left: 30px; // depends of the width of your image 
}