You are viewing revision #3 of this wiki article.
This is the latest version of this article.
You may want to see the changes made in this revision.
The Yii Framework provides a sweet functionality that allows you to easily create page specific menus. What does this mean? This allows you to create one layout or CSS styling for your menu, and when each page is loaded, a new set of menu items is loaded in. This is useful for context specific sidebars within your application.
Setting up the CMenu Widget. ¶
First things first, you need to set up your CMenu widget. This will contain the logic that styles the menu to ensure that all your menus look the same. I've used some of the CMenu class's properties to customize my menu.
<?php $this->widget('zii.widgets.CMenu', array(
'items' => $this->menu,
'encodeLabel' => false,
'htmlOptions' => array(
'class' => 'page-sidebar-menu hidden-phone hidden-tablet' //You can customize this for your application
)
));?>
As you can see this is quite simple and concise. This code can be placed directly in your desired layout file, ensuring that every page that you render calls this script. The controller holds the menu items which will be set in your view file or controller. Personally, I prefer setting the menu items in the view file because it makes sense for it to be set there with the remainder of the UI related items (page title, breadcrumbs, etc).
Specifying Menu Items. ¶
This code can be put in your controller or view file as mentioned above.
$this->menu=array(
array(
'label'=>'<span class="title"><strong>Project Actions</strong></span>',
'url'=> '#'),
array('label'=>'<i class="icon-plus"></i> Create A New Project', 'url'=>array('site/index')),
array('label'=>'<i class="icon-archive"></i> View Archived Projects', 'url'=>'#'),
);
I like to put this right at the top of my view file along with the pageTitle
and breadcrumbs
set-up.
Let me know if I missed anything.
--bhavik . . .
Thanks
It is well elaborate and easy to implement.thanks
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.