We recently had a client that needed a dynamic way to insert their own jcarousel/carousel-style slideshows, both automatic and manual (ie click-through). Realizing we couldn’t find what we needed on the web, we decided to develop it and share it! (we’re even using it here on Social Ink’s portfolio of non-profits and educational institutions in NYC. Have a look around, thanks very much!)

Our yCyclista plugin overwrites WordPress’s basic gallery function with malsup’s jQuery Cycle plugin, allowing the lay user to dynamically add slideshows or clickthrough galleries to their site!

To use, download the plugin and copy the ycyclista directory to your wp-content/plugins directory. Go to your blog’s Plugins section and activate. Then navigate to the settings menu:

Choose the appropriate options: a transition effect (examples of many effects are available here). A speed for the transition. Finally, check if you want it a slideshow or a manual gallery. If you select a slideshow, with a transition of slideDown, for example, everything will happen on its own. If you uncheck this box, the user will have to click on the image to go to the next one.

The following section is for thumbnails: Do you want a mini thumbnail navigation section? If so, enter dimensions for your thumbnails, or leave blank to use the WordPress defaults. Note that yCyclista will always display the full images at the size marked in your Settings > Media panel. If you find your images are too small, you’ll need to change it there. We also provide a whole host of styles (in ycyclista.css, in the plugin directory) which you can use to style your gallery exactly how you want. By the way, some transitions conflict with WP’s gallery and won’t work.

The following section is for the next/previous navigation: select the checkbox if you want navigation on. Then choose if you want it above the gallery (above the large image, NOT above the thumbnails) or below the thumbnails. Currently you can’t have them in the middle. Finally give your text labels (next/previous, go forward/go back, next item/previous item).

FAQ

1. How do I change the location of things or how they look (eg add an image to the next/previous)?

CSS is your friend. Add a background image to yc_next and yc_prev… Move margin-tops (ha!). If you need me to do a custom version of this with everything suited for your needs, please contact me at through our contact form or email me at y...@social-ink.net. Note we will not respond to basic plugin support through emails, only through comments at this page.

2. Why isn’t it animating?

As stated above, many things don’t play well with WP’s gallery feature. Visit our support page at http://www.social-ink.net/blog/ycyclista-a-plugin-for-your-wordpress-gallery-that-allows-slideshows-transitions-etc and post your comments.

3. Can I click on the image to move to the next one?

Only if you disable navigation controls. It’s not compatible.

4. My thumbnails are checked, but they’re not showing

Is animation checked? It’s not designed to show thumbnails when it animates (kind of redundant).

5. Does this use the same features as the jcarousel jQuery plugin?

No, there are many carousel/cycling plugins for jQuery. We used this one because we felt it was the lightest and easiest. It has lots of options and great (little) overhead. If you’re interested in using a different one, drop us a line.

yCyclista by Yonatan Reinberg has been tested on all the latest versions of FireFox, Chrome, and, why not, Internet Explorer. It also validates 100% as HTML5, etc. Note too, as with every plugin or theme modification, you should do a backup of your files beforehand. Although we’ve tested this across many installs, we are not responsible for anything it does to your system and do not guarantee support.

Download it here from social ink’s site(48k zip) or go to the wordpress plugin directory for yCyclista. See it in action here or by browsing our portfolio items below.

Go ahead and install, and leave your comments and questions below! If you’re so inclined, please send us a small donation to cover the hours making this plugin by using that big ol’ donate button on the upper right! Carousel away!

See you in Vermont!

Update: Yes, this is a convoluted title. Sorry . Who knows if people are searching for WP3, WordPress 3, WordPress 3.0, or its unfortunately search-unfriendly title “Thelonious”.

WordPress 3/WP3 is out! Yes! There are tons of new features, tons of new deprecated features and tons of confusion…

Here at Social Ink we pride ourselves on WordPress expertise and one of our favorite features of WordPress 3 is the “Multisite” feature, which weaves together WPMU’s multi-blog features with WordPress’ better plugin management, theme management and the like. We’ll be running a feature on ways to use this new Multisite feature, and today we present our first: How to list sites, or how to get a dynamic list of links (with relative path) of all your various sites (similar to wp_list_categories, or as a replacement for the deprecated get_blog_list). Think of it as a kind of wp_list_sites.

Quick note: You should never use deprecated features if you can help it. WP3 actually still has get_blog_list in its bowels, but to rely on it would be dangerous for future updates. Better to use the newer functions WP3 provides. Without future ado, here is our function, wp_get_multisites, which will retrieve a list of all your sites in WordPress 3, with many extra features, explained below the code.

function wp_get_multisites($user = 1,$get_unwanted = false,$echo_it = true,$list_it = true,$ident = false,$class="") {
		//function to return a list of sites of all blogs on WP3 multisite. by yonatan reinberg/social ink - http://social-ink.net
		$output = ''; $myid = '';
		if($list_it) { $output .= '<ul>'; }
		$allsites = get_blogs_of_user($user, $get_unwanted);
			foreach ($allsites AS $blog) {
				if($ident)
					$myid = 'bloglist_' . $blog->blogname;
				if($list_it)
					$output .= '<li><a class="'.$class.'" id="'.$myid.'" href="'.$blog->path.'">'.$blog->blogname.'</a></li>';
				else
					$output .= '<a class="'.$class.'" id="'.$myid.'" href="'.$blog->path.'">'.$blog->blogname.'</a>';
			}
		if($list_it) { $output .= '</ul>'; }
		if($echo_it)
			echo $output;
		else
			return $output;
	}

To begin, put this whole function in the functions.php file of your ACTIVE THEME. Since Multisite has support for various themes, this seems like a no-brainer but it might get you in the end.

Now, on to how to use it. Put the following wherever you want to display a list of your blogs:

<? wp_get_multisites() ?>

That’s all! But wait, there’s many ways to customize it by passing it variables. The first is the user (use “1″ for the superadmin, to get all blogs). The second boolean is whether to get all the sites, or just the ones that are published/availale. The third is whether to to echo or to just return a string. The fourth is whether to create an unordered list or just return a string of the links. The fourth is whether you want special ids assigned to the individual links, and the 6th (!) is whether you’d like a class too… Here is is in all its glory:

<? wp_get_multisites(1,true,true,false,false,'testclass');  ?>

Will return

<a class="testclass" id="" href="/">socialinkdev</a><a class="testclass" id="" href="/anothertest/">anothertest!</a>

Whereas

<? wp_get_multisites(1,true,true,true,true,'mysites'); ?>

Will return

<ul>
<li><a class="mysites" id="bloglist_socialinkdev" href="/">socialinkdev</a></li>
<li><a class="mysites" id="bloglist_anothertest!" href="/anothertest/">anothertest!</a></li>
</ul>

Download the whole function here (1k zip). Any questions? Post em in the comments below – this really helped us with web design for nonprofits in New York City.