Modificar MENU y CSS en Yii

Yii por defecto viene con un menú básico (CMenu):

<div id="mainmenu">
 <?php $this->widget('zii.widgets.CMenu',array(
 'items'=>array(
 array('label'=>'Home', 'url'=>array('/site/index')), //Se muestra para todos los usuarios ya que no tiene ninguna restricción
 array('label'=>'About', 'url'=>array('/site/page', 'view'=>'about')), //Se muestra para todos los usuarios ya que no tiene ninguna restricción, a parte de eso noten que es una página, generalmente esas páginas se utilizan para mostrar contenidos estáticos, como por ejemplo puede ser el Aviso Legal de la aplicación web.
 array('label'=>'Contact', 'url'=>array('/site/contact')), //Se muestra para todos los usuarios ya que no tiene ninguna restricción
 array('label'=>'Login', 'url'=>array('/site/login'), 'visible'=>Yii::app()->user->isGuest), //Se muestra para todos los usuarios que no están logueados.
 array('label'=>'Logout ('.Yii::app()->user->name.')', 'url'=>array('/site/logout'), 'visible'=>!Yii::app()->user->isGuest) //Se muestra para todos los usuarios logueados.
 ),
 )); ?>
 </div><!-- mainmenu -->

Ese código lo podrán encontrar dentro de la carpeta protected -> views -> layouts -> main.php

Por ejemplo si se quiere agregar el acceso para un crud creado hay que agregar lo siguiente dentro del arreglo items del widget menu de Yii:

array('label'=>'NOMBRE', 'url'=>array('/CONTROLADOR/ACCION'), 'visible'=>!Yii::app()->user->isGuest),

Si se quiere un menú mas potente usar la extensión mbmenu:
– Bajar la extensión de la pagina oficial de Yii y copiamos la carpeta /protected/extensions
– En /protected/views/layouts/main.php cambiar el widget del CMenu por algo como:

<?php

$this->widget('application.extensions.mbmenu.MbMenu',array(
 'items'=>array(
 array('label'=>'Home', 'url'=>array('/site/index')),
 array('label'=>'Principal', 'url'=>array('/site/contact'),
 'items'=>array(
 array('label'=>'Usuarios', 'url'=>array('/usuario')),
 ),
 ),
 array('label'=>'Prueba',
 'items'=>array(
 array('label'=>'Sub 1', 'url'=>array('/site/page','view'=>'sub1')),
 array('label'=>'Sub 2',
 'items'=>array(
 array('label'=>'Sub sub 1', 'url'=>array('/site/page','view'=>'subsub1')),
 array('label'=>'Sub sub 2', 'url'=>array('/site/page','view'=>'subsub2')),
 ),
 ),
 ),
 ),
 ),
 ));

?>

Al colocar el nuevo menú seguramente se ve extraño, para evitar esto debemos quitar el id=“mainmenu”, con estos cambios queda mas espacio para las vistas y el pequeño menú de la derecha queda por debajo del menú principal.

CSS por defecto en Yii:

Yii por defecto utiliza blueprint que es un framework CSS compatible con la mayoría de los navegadores webs actuales.

Si se quiere modificar la apariencia básica de una aplicación ingresar a la carpeta CSS que se encuentra en la carpeta creada por el framework y modificar el main.css que es el archivo principal, si se quiere cambiar el color de fondo del menú, solamente se debe editar la imagen bg.gif que se encuentra en dicha carpeta, y si por ejemplo se quiere cambiar el color de fondo de la aplicación completa, abrir el archivo main.css y editar lo siguiente:

body
{
 margin: 0;
 padding: 0;
 color: #555;
 font: normal 10pt Arial,Helvetica,sans-serif;
 background: black; //En este caso puse negro, se puede elegir cualquier otro color y se puede utilizar también colores expresados en hexadecimal.
}