guided tour extension for yii
JavaScript PHP
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
assets
.gitattributes
.gitignore
EGuider.php
readme.md
sample.zip

readme.md

EGuiders

Would you like to focus user attention on this new feature you've implemented last night ? Do you need to need to introduce a brand new GUI to your users ? and what about a simple and interactive tutorial that can be easely added to your pages ? ... well, one solution is to use the Guiders JQuery plugin, now available in Yii as the EGuiders extension.

More than words, check the demo page.

The EGuiders is a wrapper for the Guiders JQuery Plugin.

##Requirements

Yii 1.1 or above

##Usage

To use this extension, simply declare a widget to create a guide.

[php]
$this->widget('ext.eguiders.EGuider', array(
		'id'			=> 'intro',
		'next' 			=> 'position',
		'title'			=> 'Welcome',
		'buttons'		=> array(array('name'=>'Next')),
		'description' 	=> $this->renderPartial('_guide_intro',null,true),
		'overlay'		=> true,
		'xButton'		=> true,
		'show'			=> true
	)
);

You can of course create many guiders for one page, chain them and create a complete step by step route to guide your user through your page.

Additional features :

  • custom CSS style : overloads default style and turn your guide into a beautiful guide
  • position and orientation : attach a guide to any HTML element with JQuery selector
  • dynamics : add your own buttons to a guide and define js handler
  • jump : a guided tour can also go from page to another (see demo)
  • highlight : display overlay except for the highlighted element

With some imaginaton, a boring tour can become a great interactive user experience ! I hope it will be useful to someone...

##Resources note that the EGuiders zip file to download includes the demo sample code.

Please report any issue in the Forum discussion thread and not as a comment in this page.

##Changes ###version 1.1.0.0

  • updated to Guider 1.2.8 new plugin options (autoFocus, closeOnEscape, isHashable, onClose, onHide)
  • demo pages updated

###version 1.0.0.0

  • initial release