Menu Class
The Menu class is used to create hierchical html structures ideal for menu structures.
Initializing the Class
Like most other classes in CodeIgniter, the Menu class is initialized in your controller using the $this->load->library function:
$this->load->library('menu');
Alternatively, you can pass initialization parameters as the second parameter:
$this->load->library('menu', array('active_class'=>'on', 'render_type' => 'collapsible'));
Configuring Menu Information
There are several public properties you can use to configure the Menu Class:
| Preference | Default Value | Options | Description |
|---|---|---|---|
| active_class | active | None | The active css class |
| active | NULL | None | The active menu item |
| styles | NULL | None | CSS class styles to apply to menu items... can be a nested array |
| first_class | first | None | The css class for the first menu item |
| last_class | last | None | The css class for the last menu item |
| depth | 0 | None | The depth of the menu to render at |
| use_titles | FALSE | TRUE/FALSE (boolean) | Use the title attribute in the links |
| root_value | NULL | NULL or 0 | The root parent value |
| container_tag | NULL | For menus with a render_type property of basic, collapsible, or breadcrumb, the default is 'ul'. For menus with a render_type property of delimited is 'div'. For render_types of page_title or array, the container_tag property doesn't apply | The html tag for the container of a set of menu items. |
| container_tag_attrs | None | None> | HTML attributes for the container tag |
| container_tag_id | None | None | HTML container id |
| container_tag_class | None | None | HTML container class |
| cascade_selected | TRUE | TRUE/FALSE (boolean) | Cascade the selected items |
| include_hidden | FALSE | TRUE/FALSE (boolean) | Include menu items with the hidden attribute |
| item_tag | li | None | The html list item element |
| item_id_prefix | None | None | The prefix to the item id |
| item_id_key | id | either 'id' or 'location' | The key value to use for creating an id for an item |
| use_nav_key | FALSE | TRUE/FALSE (boolean) | Use the nav_key value to match active state instead of the id value |
| render_type | basic | basic, breadcrumb, collapsible, page_title, delimited, array | The type of menu to render |
| pre_render_func | NULL | None | function to apply to menu labels before rendering |
Specific to Breadcrumb AND/OR Page Title Menus |
|||
| delimiter | For menus with a render_type property of page_title, or breadcrumb, the default is ' > '. For menus with a render_type property of delimited is ' | '. For render_types of basic, collapsible and array, the delimiter property doesn't apply | None | The HTML element between the links |
| display_current | TRUE | TRUE/FALSE (boolean) | Display the current active breadcrumb item? |
| home_link | Home | None | The root home link. If value is an array, the key of array is the link and the value is the label |
Specific to Breadcrumb Menus |
|||
| arrow_class | arrow | None | The class for the arrows |
Specific to Page TItle Display |
|||
| order | 'asc' | asc,desc | The direction the page title should build |
The Menu Array Structure
The menu array can hav the following key/value pair:
- id - the id value of the menu item. If none is specified, then the array key value will be used
- parent_id - the parent's id value that the menu item should reside under. Top level (also called root items), should have a root value of NULL or 0 depending on what is specified for the root_value
- label - the text label to display for the menu item
- location - the link location of the menu item. If none is specified, the array key value will be used
- attributes - additional HTML link attributes (e.g. target="_blank") to assign to the menu item
- hidden - whether to display the menu item or not.
- active - a regular expression that determines whether it should be given active status. If none is specified, it will be the same as the location value (e.g. about/history$|about/contact$). You can also use the :children active magic selector, which will highlight a menu item if it or any of it's sub pages are active. For example, if you have a news page, it allows you to easily highlight the news in the menu for all URI locations of news and news/{literal}{any}{/literal} (translates to news$|news/.+ in regular expression).
Below is an common example:
$nav = array();
$nav['about'] = 'About';
$nav['about/history'] = array('label' => 'History', 'parent_id' => 'about');
$nav['about/contact'] = array('label' => 'Contact', 'parent_id' => 'about');
$nav['products'] = 'Products';
$nav['products/X3000'] = array('label' => 'X3000', 'parent_id' => 'products');
Function Reference
$this->menu->render(items, ['active'], ['parent_id'], 'render_type')
Will create the HTML for the menu. The $items the array of items to display. See above for format of the array. The $active parameter specifies which menu item is active. The $parent_id parameter specifies where in the $items to start the heirarchy. The $render_type parameter is the type of menu you want to render (basic, breadcrumb, collapsible).
$nav = array();
$nav['about'] = 'About';
$nav['about/history'] = array('label' => 'History', 'parent_id' => 'about');
$nav['about/contact'] = array('label' => 'Contact', 'parent_id' => 'about');
$nav['products'] = 'Products';
$nav['products/X3000'] = array('label' => 'X3000', 'parent_id' => 'products');
$active = 'about/history';
$menu = $this->menu->render($nav, $active, NULL, 'basic');
echo $menu;
/* echoed output looks something like this
*/
$this->menu->render_collapsible(items, ['active'], ['parent_id'])
Will create the HTML for a collapsible menu. The $items the array of items to display. See above for format of the array. The $active parameter specifies which menu item is active. The $parent_id parameter specifies where in the $items to start the heirarchy.
$nav = array();
$nav['about'] = 'About';
$nav['about/history'] = array('label' => 'History', 'parent_id' => 'about');
$nav['about/contact'] = array('label' => 'Contact', 'parent_id' => 'about');
$nav['products'] = 'Products';
$active = 'about/history';
$menu = $this->menu->render($nav, $active, NULL, 'collapsible');
echo $menu;
/* echoed output looks something like this. Note the difference in the product items not have a sub ul
*/
$this->menu->render_breadcrumb(items, ['active'], ['parent_id'])
Will create the HTML for a breadcrumb menu. The $items the array of items to display. See above for format of the array. The $active parameter specifies which menu item is active. The $parent_id parameter specifies where in the $items to start the heirarchy.
$nav = array();
$nav['about'] = 'About';
$nav['about/history'] = array('label' => 'History', 'parent_id' => 'about');
$nav['about/contact'] = array('label' => 'Contact', 'parent_id' => 'about');
$nav['products'] = 'Products';
$active = 'about/history';
$menu = $this->menu->render($nav, $active, NULL, 'breadcrumb');
echo $menu;
/* echoed output looks something like this.
*/
$this->menu->render_page_title(items, ['active'], ['parent_id'])
Will create a page title based on the nav structure. The $items the array of items to display. See above for format of the array. The $active parameter specifies which menu item is active. The $parent_id parameter specifies where in the $items to start the heirarchy.
$nav = array();
$nav['about'] = 'About';
$nav['about/history'] = array('label' => 'History', 'parent_id' => 'about');
$nav['about/contact'] = array('label' => 'Contact', 'parent_id' => 'about');
$nav['products'] = 'Products';
$active = 'about/history';
$menu = $this->menu->render($nav, $active, NULL, 'page_title');
echo $menu;
/* echoed output looks something like this.
Home > About > History
*/
$this->menu->render_delimited(items, ['active'], ['parent_id'])
Will create a delimited navigation structure (one level deep only). Useful for pipe delimited footer navigations. The $items the array of items to display. See above for format of the array. The $active parameter specifies which menu item is active. The $parent_id parameter specifies where in the $items to start.
$nav = array(); $nav['about'] = 'About'; $nav['history'] = 'History'; $nav['contact'] = 'Contact'; $nav['products'] = 'Products'; $active = 'about/history'; $menu = $this->menu->render($nav, $active, NULL, 'delimited'); echo $menu; /* echoed output looks something like this. Home | About | History */
$this->menu->render_array(items, ['active'], ['parent_id'])
Will output a nested array. The key of children will contain any child menu items. The $items the array of items to display. See above for format of the array. The $active parameter specifies which menu item is active. The $parent_id parameter specifies where in the $items to start the heirarchy.
$nav = array();
$nav['about'] = 'About';
$nav['about/history'] = array('label' => 'History', 'parent_id' => 'about');
$nav['about/contact'] = array('label' => 'Contact', 'parent_id' => 'about');
$nav['products'] = 'Products';
$active = 'about/history';
$menu = $this->menu->render($nav, $active, NULL, 'array');
print_r($menu);
/* echoed output looks something like this.
Array
(
[about] => Array
(
[id] => about
[label] => About
[location] => about
[attributes] => Array
(
)
[active] =>
[parent_id] =>
[hidden] =>
[children] => Array
(
[about/history] => Array
(
[id] => about/history
[label] => History
[location] => about/history
[attributes] => Array
(
)
[active] =>
[parent_id] => about
[hidden] =>
)
[about/wcontact] => Array
(
[id] => about/contact
[label] => Contact
[location] => about/contact
[attributes] => Array
(
)
[active] =>
[parent_id] => about
[hidden] =>
)
)
)
[products] => Array
(
[id] => products
[label] => Products
[location] => products
[attributes] => Array
(
)
[active] =>
[parent_id] =>
[hidden] =>
)
)
*/
$this->menu->reset()
Will reset the parameters back to their default values. Good to use when multiple menus are generated.
$menu = $this->menu->clear();