Simply create a images slideshow, using jQuery Cycle Plugin from www.jquery.malsup.com/cycle
Requirements ¶
Requirements (Yii 1.5 or above)
Install ¶
* Extract archive in your extensions folder
* In the site's root create a folder named "images" and copy content of "images" folder from archive
Usage ¶
To include a slider in page:
<?php $this->widget('application.extensions.slider.slider');?>
or
<?php $this->widget('ext.slider.slider');?>
If you wish to customize your slider, you can set options:
<?php
$this->widget('ext.slider.slider', array(
'container'=>'slideshow',
'width'=>960,
'height'=>240,
'timeout'=>6000,
'infos'=>true,
'constrainImage'=>true,
'images'=>array('01.jpg','02.jpg','03.jpg','04.jpg'),
'alts'=>array('First description','Second description','Third description','Four description'),
'defaultUrl'=>Yii::app()->request->hostInfo
)
);
?>
Parameters ¶
sliderBase = string - set the folder base for slider, related to webapp root
imagesPath = string - set the folder for images used in active page
container = string - container class for slider
width = integer - the width of container
height = integer - the height of container
timeout = integer - speed to change images
infos = string - display the information over every picture
constrainImage = boolean - force the image to fill the container
images = array - set the name and the order of the pictures which will be displayied
alts = array - set alt attribute for every picture used in slider and definder in images attribute
urls = array - set url for every picture used in slider and definder in images parameter
defaultUrl = url - set the url where will be redirected at click on picture
defaultAlt = url - set default alt atribute to be used for all pictures used in slider
sameToAll = boolean - if is set to true, the set of images will be taken from "all"" folder from sliderBase folder and can be displayied in all pages (as a banner for example), if is set to false, you must create a folder named by page id, and slider will use that folder
Malsup
Would probably be prudent to mention that this extension uses jQuery Slider from Malsup.com:
Malsup Slider
@jacmoe
Indeed. I forgot to mention his credit, but I did it now. Thanks.
Undefined offset: 0
I have tried it but getting this error Undefined offset: 0. line slider\slider.php(163) On windows wamp
@bonnie
Problem is in slider.php line 163:
$url = $this->urls[$k] ? $this->urls[$k] : $this->defaultUrl;change to
$url = isset($this->urls[$k]) ? $this->urls[$k] : $this->defaultUrl;Problem is that urls is not set in your widget custom options and all using default options will face this issue.
PHP Short Tag
container.php
<div class="<?=$this->container;?>"><?=$items;?></div>and much in _item.php
Documentation.
Hi, can you please make it sure that your installation instructions will properly work else this will degrade quality and could possibly become trash.
Thanks.
@ejac
Thank you for negative vote. Thumb up for you.
Sorry because my extension is so simply to install and use and not need too much documentation. I wrote all do you need to use it.
Or do you expect me to copy your technique? No. No. I will not upload a full yii app only to show you how to use this simple extension. Bye.
Can't use this properly.
Hi first of all, i'm kinda new to this framework, so sorry if my info is not accurate of if i lack the skills to use this type of extensions. I tested this and can't use it properly.
I see a grey rectangle with around 50px of height extended horizontally on my layout when i try to use this extension. What's missing here? perhaps the path to the images?
Can you provide me more instructions on how to use this or what i'm doing wrong about this. I put the images on the right place from your description.
By the way, when using this code:
$this->widget('extensions.slider.slider');
there's an error. Anyone else experiencing this?
What am i doing wrong?
To WebDevTP
Hi. You have right about using <?php $this->widget('extensions.slider.slider');?>. Please replace this with <?php $this->widget('application.extensions.slider.slider');?> or with <?php $this->widget('ext.slider.slider');?>. I will change on this page to reflect correct way. Thank you.
I am sure that your problem is with the path to your images. Please check if you copied the folder images from extension zip, to your webroot. You must see a structure like: /images/slider/19; /images/slider/all; /images/slider/system;
Hi again
Hi, thank you for the fast reply.
I tested again and this is what i used
<?php $this->widget('application.extensions.slider.slider');?> <?php $this->widget('ext.slider.slider');?> <?php $this->widget('ext.slider.slider', array( 'container'=>'slideshow', 'width'=>960, 'height'=>240, 'timeout'=>6000, 'infos'=>true, 'constrainImage'=>true, 'images'=>array('01.jpg','02.jpg','03.jpg','04.jpg'), 'alts'=>array('First description','Second description','Third description','Four description'), 'defaultUrl'=>Yii::app()->request->hostInfo ) ); ?>all 3 examples render me a grey rectangle, so i guess i'm not using the correct path for the images.
I'm placing my images inside the folder with *
i also tested to copy the images folder inside my protected dir.
What am i doing wrong, is there a parameter that i can use to tell where my pics are located? Thank you again for the quick update.
To WebDevTP
Hi. Please contact me from Contact page at http://dios.binary-technology.ro/. I will help you to make it to work.
It works
Hi again, I tested again with the help of the matricks and seems that this extension DOES WORK on a live server. (Yii 1.1.10)
I wasn't able to display the images on a local server running on WAMP with Windows environment. Perhaps there's something wrong my my settings.
Great Extension
You made my day! What can I do for you?
Thanks,
Peter
Changes to assign images from php
I need modify this extension to assign images from php:
public function run () { echo '<div id="slider-wrap" style="width: '.$this->width.'; height: '.$this->height.'"><div id="'.$this->id.'"><ul>'; foreach ($this->data as $key => $value) { if (is_array($value)){ foreach($value as $data){ if (isset($data['url']) and $data['url'] != '') { echo '<li><a href="'.$data['url'].'"><img src="'.$data['image'].'" alt="'.$data['title'].'"></a></li>'; } else { echo '<li><img src="'.$data['image'].'" alt="'.$data['title'].'"></li>'; } } } }$items = Items::Model()->findAll() if ($items){ foreach($items as $data){ $items[] = array( 'title' => $data->title, 'url' => Yii::app()->createUrl('items/'.$data->id), 'image' => $data->imagen ); } } $this->widget ('ext.EasySlider.EasySlider', array ( 'width' => '314px', 'height' => '400px', 'data' => array ( $items, )));Change effect
Hi. How can I change effects for this extension? There is fade and curtainY by default. I want to use the fade only. How can I do it?
I have tried to change fx in slider.js but it didn't help me.
Thanks.
solution of didn't display image
Hi .
tanks for good ext.
I first install ext ,but it didn't work correctly . extension didn't display image .
solution :I copied images folder to web root (where index.php exist)
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.