How to make a side menu portlet

Yii 1.1 General Discussion
1

I wonder how to make a left , side menu like the yii playground as the picture I attached.

Please suggest how to start. what a key I can search or example , source.

I’m newbie sometime I don’t know for what it’s name but I have a require to make a left menu .

each menu show the gridview once click.

help please…

foon…

2

You need a two column layout (usually)


$this->layout = '//layouts/column2';

in the left column use the CMenu widget


$this->widget('zii.widgets.CMenu',array(

            'id'=>'sideMenu',  

            'items'=>$menuArray,

                ));

usually you will want to create the $menuArray pulling stuff from a database but you could do a static menu easily.

The array looks something like this (two menu items only in this example).


Array ( 

[0] => Array ( [label] => Home [url] => Array ( [0] => site/index ) ) 

[1] => Array ( [label] => Browse [url] => Array ( [0] => site/categories ) )

 )

Style it with CSS


/*side menu styles*/


#sideMenu, .portlet

{

    background-color:#a7d896;

     border:2px #222 solid;

     border-radius:10px;

     padding:.75em;

     margin:0;

     margin-bottom: 10px;

}




#sideMenu li

{

    list-style: none;

    border-radius:5px;

    box-shadow:inset 0 0 3px #3d3a20;

    padding:.5em;

    margin-top:2px;

    margin-bottom:2px;

    padding-left:3.5em;

    background-color:#8c9e34;

    

}

#sideMenu li:hover

{

    background:#3d3a20;

}


#sideMenu li.active

{

    background:#3d3a20;

    padding-left:.5em;

}


#sideMenu li a

{

    text-decoration: none;

    color:#fff;

    font-size:14px;

    font-weight: 700;

}

That’s just one way to do it.

There are also a number of extensions available

doodle

3

:lol:

It’s the most my appreciated . Thank a lot ‘mbi’ and ‘doodle’ .

I’ll go from your source.

foon.

4

This is what i want… but unable to see the link what u have provided. can u provide me the exact link or anyother with same example ?