WordPress plugin to show jcarousel of images from posts

arousel of Post images is a fully integrated jcarousel Image Gallery plugin for WordPress to allow quick and easy galleries built from the iamges attached to posts. Built using the excellent JQuery Carousel

Sample Screenshot

Operation

The images can be selected based on post ID, or from all images attached to posts. The default is to select 10 random images from all posts.

You can specify a post as an argument to the shortcode, or let the plugin pull a random selection of images from the posts, by default in random order.

Installation

  1. Install & Activate the plugin
  1. Use the shortcode in your posts or pages where you want a gallery
  1. Go to your post/page an enter the shortcode ‘[carousel-of-post-images imagesize=small visible=2 count=15]’
  1. or add to a PHP file in your template: show_wp_copi_carousel($args)

Usage

Use the shortcode to display a random selection of images from the posts on your site.

CSS is used to set the sizing of the Carousel areas.

Example:

Show a carousel containing 15 images – using the small size from the attachments. The sizing of the div will come from the CSS

[carousel-of-post-images imagesize=small count=15]

PHP Example

      if (function_exists( "show_wp_copi_carousel"  )) 
          echo  show_wp_copi_carousel(array(
                                            'div' => 'mycarousel',
                                            'size' => '30',
                                            'imagesize' => 'thumbnail')); 
      else
          echo "Please install and activate plugin carousel-of-post-images";?>

Defining the number of visible items

This needs explaining because it can appear confusing; the following is taken from the JCarousel docs.

You simply define the number of visible items by defining the width (or height) with the class .jcarousel-clip (or the more distinct .jcarousel-clip-horizontal and .jcarousel-clip-vertical classes) in your skin stylesheet.

This offers a lot of flexibility, because you can define the width in pixel for a fixed carousel or in percent for a flexible carousel (This example shows a carousel with a clip width in percent, resize the browser to see it in effect).

So, why there is an option visible? If you set the option visible, jCarousel sets the width of the visible items to always make this number of items visible. Open this example and resize your browser window to see it in effect.

Options for Carousel of Post Images

Property Type Default Description
skin   tango Skin to use
imagesize   medium Size of images to select. Does not affect the display just the images that are selected from the posts small,medium,large,full
orderby   rand Display order, possible options see Wordress WP_Query Orderby parameters
postid   all The ID of the post to select images from. If omitted will select from all posts
size   10 Number of images to select
div   post-carousel ID of the list for the images. Only necessary to set when using more than one post carousel in a page/post
vertical bool false Specifies wether the carousel appears in horizontal or vertical orientation. Changes the carousel from a left/right style to a up/down style carousel.
rtl bool false Specifies wether the carousel appears in RTL (Right-To-Left) mode.
start integer 1 The index of the item to start with.
offset integer 1 The index of the first available item at initialisation.
scroll integer 3 The number of items to scroll by.
visible integer null If passed, the width/height of the items will be calculated and set depending on the width/height of the clipping, so that exactly that number of items will be visible.
animation mixed “fast” The speed of the scroll animation as string in jQuery terms (“slow” or “fast”) or milliseconds as integer (See jQuery Documentation). If set to 0, animation is turned off.
easing string null The name of the easing effect that you want to use (See jQuery Documentation).
auto integer 0 Specifies how many seconds to periodically autoscroll the content. If set to 0 (default) then autoscrolling is turned off.
wrap string null Specifies whether to wrap at the first/last item (or both) and jump back to the start/end. Options are “first”, “last”, “both” or “circular” as string. If set to null, wrapping is turned off (default).

Credits.

JQuery and all its contributors; a truly amazing project.

JQuery Carousel

Originally started with the wp-simple-carousel but heavily modified, so much so that it’s a virtual rewrite but
even so Sergio Milardovich deserves a mention.

Support & Questions

Feel free to use the contact forms with any questions.

Donations

If you’d like to thank me for my time making this plugin by you can make a donation.