cdropdownmenu

Yii Framework Extensions

Createnew extension

Popular Tags

cdropdownmenu CDropDownMenu is a extension to CMenu that allows Drop-Downs via superfish

Documentation
Change Log

CDropDownMenu is a extension to CMenu that allows Drop-Downs via the superfish jquery plugin.

Documentation ¶

Requirements ¶

Installation ¶

Extract the release file under protected/extensions

Usage ¶

See the following code example:

$this->widget('ext.CDropDownMenu.CDropDownMenu',array(
			'style' => 'vertical', // or default or navbar
      'items'=>array(
				array(
					'label'=>Yii::t('Login'),
					'url'=>array('//user/user/login'),
					'visible'=>Yii::app()->user->isGuest,
					), 
				array(
					'label'=>Yii::t('Register'),
					'url'=>array('//registration/registration/registration'),
					'visible'=>Yii::app()->user->isGuest,
					), 
				array(
					'label'=>Yii::t('Demo'),
					'url'=>array('//demo/index'),
					'visible'=>Yii::app()->user->isGuest,
					), 
				array(
					'label'=>Yii::t('Demo'),
					'visible'=>!Yii::app()->user->isGuest,
					'items' => array(
						array(
							'label'=>Yii::t('Browse demos'),
							'url'=>array('//demo/index'),
							), 
						array(
							'label'=>Yii::t('Create new Demo'),
							'url'=>array('//demo/create'),
							), 
						array(
							'label'=>Yii::t('Demos'),
							'url'=>array('//demo/index', 'owner' => true),
							), 
	),
				array('label'=>'Logout ('.Yii::app()->user->name.')',
						'url'=>array('/site/logout'),
						'visible'=>!Yii::app()->user->isGuest)
					)
    ) 
)
);

Attention: please be sure to not use this Widget inside the div id="mainmenu" of standard-generated webapps because there seems to be some css inconsistency between yii's default css and superfish's default css.

Also be sure to read the API Documentation of CMenu to fully understand how this Menu works.

Options passed to superfish need to be inserted into the js/superfish.js file.

Change Log ¶

June 2, 2011 ¶

added style = 'navbar' and style = 'vertical'
Codecleanup

January 25, 2010 ¶

Version 0.2 released
possible to pass 'cssFile' option
bugfix: added div clear:both after menu
possibility to move extension anywhere in file system path
added shadow.png and arrows.png from default
made the default css-file a lot more beautiful

January 20, 2010 ¶

Initial release.

15 5

18 followers

8 801 downloads

Yii Version: 1.1

License: BSD-2-Clause

Category: User Interface

Tags: CMenu, css, DropDownMenu, js, menu, superfish

Developed by: thyseus

Created on: Jan 20, 2010

Last updated: 13 years ago

Downloads

show all

Related Extensions

User Contributed Notes 17

#249

0 0

How can I center in my page a CDropDownMenu?

How can I center in my page a CDropDownMenu?

lichunter at Jul 27, 2010, 10:55:29 PM

#442

0 0

Ability to set superfish options

Perhaps replace CDropDownMenu.js with PHP code:

//Yii::app()->clientScript->registerScriptFile($baseUrl . '/' . 'CDropDownMenu.js',CClientScript::POS_HEAD);
$sfOptions = '{delay:300,speed:"fast"}';
Yii::app()->clientScript->registerScript('sf-menu', '$("ul.sf-menu").superfish('.$sfOptions.');', CClientScript::POS_READY);

tri at Jun 1, 2010, 5:04:46 PM

#724

0 0

Hope for a new release...

Yep, would be great to have a workin superfish plugin... this way is quite not usable...

sp1D3R at Mar 11, 2010, 11:13:20 AM

#828

0 0

Thank you

this bugfix and some more default styles will be released in the next version soon

thyseus at Feb 22, 2010, 9:40:19 PM

#848

0 0

Missing Closing Div

Hi and thanks for your contribution.

I just wanted to report that your code appears to have a missing closing div element.

$this->registerClientScript();

echo '<div style="clear:both;">';

The last line should read:

echo '<div style="clear:both;"></div>';

Kind regards.

outrage at Feb 19, 2010, 5:36:48 AM

#885

0 0

excellent

the use of hoverIntent.js is a big improvement over any other javascript menus.

Thanks for creating this in Yii!

jeremy at Feb 12, 2010, 6:39:08 PM

#953

0 0

thanks for Your Contributions

@ got2doodle: yes, of course. Any Contribution is wanted !

@ jonah: already fixed this in the new Version i am releasing soon (among other additions...)

thyseus at Jan 21, 2010, 1:07:21 PM

#955

0 0

Excellent

I would only recommend this change on line 47 of CDropDownMenu:

$basePath=dirname(__FILE__).DIRECTORY_SEPARATOR.'vendors';

This way the vendor folder can be located in the same directory as the extension no matter where the extension is located

jonah at Jan 20, 2010, 10:25:08 PM

#956

0 0

Nice extension

I modified CDropDownMenu.php so that I could pass the name of the css file that I want to use. Let me know if you want the modified code.

doodle

got 2 doodle at Jan 20, 2010, 7:01:12 PM

#2022

2 0

Problems with using this extension

Unfortunatelly, this extension does not work as supposed!

Extension author assumed that it's files (CDropDownMenu.php file and vendors folder) will be put directly in extensions folder, not in own subfolder which introduces mess inside. Attempts to use subfolder makes extension to not work at all, because paths inside it (especially to vendors folder, which should be published via assetsManager) are hardcoded -> very bad developer attitiude! One must do manual extension code rewrite to be able to put it in subfolder of extensions folder. Please not that Yii definitive guide strongly advises to use subfolder per each extension being used in page!

Even if ones decides to use extension directly in extensions folder, it works, but looks ugly! Seems like CSS styling does not work. Double checked that superfish.css is properly published and linked to page and that menu structure does not collide with original div id="mainmenu", but with no results.

Overall note: Idea of use superfish.js is great but one need to search for another Yii extensions or write own to use it inside Yii app as this one requires to much work to made it working.

Trejder at Nov 2, 2010, 11:21:34 AM

#3046

0 0

Beautiful

Well, it needs fine-tuning to make it look good...but functionally beautiful.

Thanks for keeping it so clean!

stutteringp0et at Mar 10, 2011, 4:43:25 AM

#4008

0 0

changing the background color

How do I change the lightgray background color of the menu? Changing the color in superfish.css has no effect.

abhimir at May 27, 2011, 5:30:18 AM

#4797

0 0

@abhimir

It will take effect if you delete content of assets folder.

klod at Aug 17, 2011, 3:28:20 PM

#4798

1 0

Suggestion

Suggestion for next release for configuring superfish options:

comment this first line and add the second

//$cs->registerScriptFile($baseUrl . '/js/' . 'CDropDownMenu.js',$this->position);
$cs->registerScript('superfish',$this->getJs(),CClientScript::POS_READY);

add this public var:

public $options;

and finally this function

protected function getJs(){
		$js_options = CJavaScript::encode($this->options);
	return <<<EOF
$(document).ready(function() { 
	$('ul.sf-menu').superfish($js_options);
}); 
EOF;
	}

klod at Aug 17, 2011, 5:39:23 PM

#5375

1 0

Suggestion

add:

public $options;
public $activeCssClass = 'current';

Move files:
directory /js, /images/, /js into subfolder /assets/*

Delete file:
/assets/js/CDropDownMenu.js

Relace #1:

//$basePath = Yii::getPathOfAlias('ext.CDropDownMenu');
//$baseUrl = Yii::app()->getAssetManager()->publish($basePath);

$dir = dirname(__FILE__) . DIRECTORY_SEPARATOR . 'assets';
$baseUrl = Yii::app()->getAssetManager()->publish($dir);

Replace #2:

//$cs->registerScriptFile($baseUrl . '/js/' . 'CDropDownMenu.js',$this->position);

$cs->registerScript('superfish', '$("ul.sf-menu").superfish('.CJavaScript::encode($this->options).'); ',$this->position);

Add:

protected function renderMenuItem($item)
{
	$options=isset($item['linkOptions']) ? $item['linkOptions'] : array();
	$class = array();
	if($item['active'] && $this->activeCssClass!='')
		$class[]=$this->activeCssClass;
	if($class!==array())
	{
		if(empty($options['class']))
			$options['class']=implode(' ',$class);
		else
			$options['class'].=' '.implode(' ',$class);
	}
	$item['linkOptions'] = $options;
	return parent::renderMenuItem($item);
}

puritania at Oct 8, 2011, 6:48:54 AM

#13073

0 0

Demo and git

Is there any Demo and git repository?

Shahcheraghean at May 2, 2013, 9:36:12 AM

#19347

0 0

Css images path error

In my assets folders, the 'images' folder is not inside the 'css' folder.

So this code in superfish.css does not find the required file:

background: url('images/arrows-ffffff.png') no-repeat -10px -100px;

Change it to:

background: url('../images/arrows-ffffff.png') no-repeat -10px -100px;

Do the same for:

background: url('../images/shadow.png') no-repeat -10px -100px;

Gerhard Liebenberg at May 28, 2015, 9:03:51 AM

Categories