Image carousel in home page

Hi! I’d like to add an "image carousel" in home page... can you tell how can I add this with modx?

Thanks

Quote from: il_dandi at Apr 08, 2011, 04:17 PM

Hi! I’d like to add an "image carousel" in home page... can you tell how can I add this with modx?

Thanks

Find an image carousel you want to use - there’s numerous out there, here’s an example: http://www.gmarwaha.com/jquery/jcarousellite/

Integrate it into the template for the front page of your site

Rock’n’Roll

Seriously though, if you have/find the code for the carousel you want, it’s just a matter of adding it your template for the front page.

Here’s one that I did recently http://www.sottwell.com/rotating-tabs.html

This one is also very flexible: jQuery Orbit

Simple setup instructions too, check it out!

One of my favorite sites http://www.webdesignshock.com/showcase/100-best-jquery-image-gallery-plugins/

Thanks to all for all detailed replies!!

Is there a carousel that automatically reads all images in a specified folder?? Without link each single image I’d like to read all that I’ve in a folder

Tnanks

You need to use a snippet to collect the images you want to display and generate the HTML your chosen carousel requires. Since the carousel itself is javascript and processed in the browser, they aren’t concerned with how you get the list of images.

Have a look at modifying this one:
http://modxcms.com/forums/index.php/topic,62700.msg356182.html

The working code is in the last message posted. Depending on which carousel you use, if you want the images output as an unordered list you can wrap the <img...> tag in the snippet with <li></li> tags.

Then call it like this:

<ul>
[[getFolderImages? &path=`path/to/image/folder/`]]
</ul>

Thanks for your reply and your help!!

I’m trying to use your code


The steps are:

I create this snippet:

named??

<?php
$dir_handle = @opendir($path) or die(’Unable to open ’ . $path);

$array = array();
while (($file = readdir($dir_handle)) !== false)
{
if ($file != ’.’ && $file != ’..’)
{
$pathinfo = pathinfo($file);
if (isset($pathinfo[’extension’])) {$ext = strtolower($pathinfo[’extension’]);} else {$ext = ’’;}
if ($ext == ’jpg’ || $ext == ’jpeg’) {$array[] = $file;}
}
}
if ($array)
{
sort($array); // Use rsort for Z-A order
foreach ($array as $value)
{
echo ’<img src="’ . $path . $value . ’" alt="" />’ . "\n";
}
}

I don’t have a specifi carousel, for example I can use a simple jquery carousel.

What I’ve to do now??

Thanks

You really need to decide which Carousel to use first as the markup will likely depend on that. Best to get your preferred carousel working first with hard coded paths to your image folder.

Is there any reason why you couldn’t perhaps achieve this with some Image TVs instead?