NivoSlider Usage Discussion

Just released the nivoslider extension. Try yorself.

Excellent extension. I have some recommendations:

[list=1]

[*]Images list should be a parameter (example below)

[*]slices paramenter should be automatically calculated (it will be easy if recommendation 1 is done)

[*]customCss parameter should have a default value (‘fancy’ should be set)

[*]Some other parameters should have a default value too (eg: effect, animSpeed, pauseTime, startSlide, …)

[/list]

A minimal full-working example could be:


$this->widget('application.extensions.nivoslider.CNivoSlider', array(

    'target'=>'#highlight',

    'images'=>array(

            array('url'=>'images/img01.png','label'=>'Comment for pic 1','link'=>'http://www.something.com'),

            array('url'=>'images/img02.jpg','label'=>'This is the picture 2'),

    )

)



Best regards.

Nice sugestions. I will consider them all. I will work on this today. Perhaps until evening I post the new version.

No problem, I’ll wait for it.

Best regards.

Hey robregonm. Thanks for suggestions. I tried to make the best version.

Just finish. Go there and download the 2.0 alpha version.

Please could you post the instructions from old version 1.0? I forgot to save it.

If you find any bugs please report me.

Excellent job, I’ll give it a try, in fact, I’ll implement it within a project I’m currently developing. If I find some bug I’ll post it.

PS:

I think, it is not necessary to re-post the instructions of old version 1.0.

Best regards.

Hi!

Where is the "images" directory?

NivoSlider is located at: protected/extensions

Documentation says the image path is: images/image-1.jpg

Where is the "images" directory?

images

protected/images

protected/extensions/images

I am using Yii 1.1.4 and NivoSlider 2.0

I am trying to use NivoSlider, but I just see the menu images control (some dots in the screen), but no images.

Many thanks!

Marcos

Hey dude.

You can retrieve images from anywhere. Just use the correct relative path

if you want to retrieve the image located on root in folder images

use this

$this->widget(‘application.extensions.nivoslider.CNivoSlider’, array(

'images'=>array( //@array images with images arrays.


    array('src'=>'/images/image1.jpg'),


    ),


)

);

To solve the problem of visualization create a CSS linked to the nivoslider id and set the width and height to a fixed value.

Support add me on msn. thiagovidal@gmail.com

Bye

Hi Thiago!

How to use thumbs?

I have created the thumbs for each image.

In the "config" array, I am using:

‘controlNavThumbs’=>true,

‘controlNavThumbsSearch’=>’.jpg’,

‘controlNavThumbsReplace’=>’_thumb.jpg’,

It works, but I just can see the last thumb.

Reading the documentation: http://dev7studios.com/blog/resources/using-thumbnails-with-the-nivo-slider/

It asks to configure CSS like:

#slider .nivo-controlNav {

position:absolute;


bottom:-70px; /* Put the nav below the slider */

}

#slider .nivo-controlNav img {

display:inline; /* Unhide the thumbnails */


position:relative;


margin-right:10px;

}

I wrote the code at:

/protected/extensions/nivoslider/assets/nivo-slider.css

/protected/extensions/nivoslider/assets/fancy-nivo-slider.css

But nothing changed.

Could you help?

Thanks

Marcos

Anyone have any problems with NivoSlider not displaying the images on the first page load with a cleared cache? Other images on the page display fine, but the images for the slider will not show up unless the page has been viewed at least once.

Any suggestions would be greatly appreciated!

Thanks.




<?php

$this->widget('application.extensions.nivoslider.CNivoSlider', array(

    'images'=>array(

        array('src'=>Yii::app()->request->baseUrl.'/images/slider/image1.jpg', 'caption'=>false,

            'url'=>Yii::app()->request->baseUrl.'/site/page?view=solutions',

            'linkOptions'=>array(),

            ), //only display image.

        array('src'=>Yii::app()->request->baseUrl.'/images/slider/image2.jpg', 'caption'=>false,

            'url'=>Yii::app()->request->baseUrl.'/site/page?view=events',

            'linkOptions'=>array(),

            ),

        ),

    )

);

?>



can i see the page runing?

It’s only running local right now.

ok

i really never experienced this problem.

try this

<?php

$this->widget(‘application.extensions.nivoslider.CNivoSlider’, array(

'htmlOptions'=&gt;array('style'=&gt;'width: the width of images; height: the height;'),


'images'=&gt;array(


    array('src'=&gt;Yii::app()-&gt;request-&gt;baseUrl.'/images/slider/image1.jpg'),


    array('src'=&gt;Yii::app()-&gt;request-&gt;baseUrl.'/images/slider/image2.jpg', 'url'=&gt;array('/site/pages', 'view'=&gt;'events')),


)

);

?>

Thanks, your code got me close. A small correction and a few extra params and it works perfect. Looks like it was probably the htmlOptions that was the culprit. Unsure why, but it works now and that’s all that matters!

Thanks again!




<?php

	$this->widget('application.extensions.nivoslider.CNivoSlider', array(

    	'htmlOptions'=>array('style'=>'width: 480px; height: 265px;'),

    	'images'=>array(

        	array('src'=>Yii::app()->request->baseUrl.'/images/slider/image1.jpg', 'caption'=>false),

        	array('src'=>Yii::app()->request->baseUrl.'/images/slider/image2.jpg',

            	'url'=>array('/site/pages', 'view'=>'cue60'),

            	'caption'=>false,

            	'linkOptions'=>array(),

            	),

    	)

	)

);

?>



nice man. by the way… its a nivoslider js problem… not from the widget. u don`t need to set caption to false… just strip it out… goto my site and see other style for the component/

htpp://www.othys.com.br

If I strip out the caption I get errors. Also, I tried looking around your site for examples, but I couldn’t find any. My Spanish isn’t that great either :)

PHP Error

Description

Undefined index: caption

Source File

/Applications/MAMP/htdocs/digistream/protected/extensions/nivoslider/CNivoSlider.php(99)

I sent a new version of extension. try use the new one. ok?

Hi, guys can some body help me with this extension as I did follow to extract all files in Extension folder and trying to use with following codes…


<?php

        $this->widget('application.extensions.nivoslider.CNivoSlider', array(

        'images'=>array(

                array('src'=>Yii::app()->request->baseUrl.'/static/images/systemimages/up.jpg', 'caption'=>'caption-A'),

				array('src'=>Yii::app()->request->baseUrl.'/static/images/systemimages/nemo.jpg', 'caption'=>'caption-B'),

				array('src'=>Yii::app()->request->baseUrl.'/static/images/systemimages/toystory.jpg', 'caption'=>'caption-C'),

                array('src'=>Yii::app()->request->baseUrl.'/static/images/systemimages/walle.jpg',

                'url'=>array('/site/pages', 'view'=>'cue60'),

                'caption'=>false,

                'linkOptions'=>array(),

                ),

        )

        )

);

?>

But what I see after rendering the page is just those pictures on top of each and no slides working, please see the attached result of pic how they looks like.

Any thing missing as I can see all .JS and .CSS files loaded.

I look forward to see any help soon,

Have a good weekend.

Chao

Hi guys, it’s look like got landed on wrong place :), anyway I got solved myself some how with little efforts and give a bit touch of CSS work and now looks more nice see the attached pic.

happy new year to all

Sorry the pic didn’t uploaded so here it is…