search

ewels / CPT-Bootstrap-Carousel

WordPress plugin which generates a custom post type for choosing images and content. Outputs Bootstrap Image Carousel (slider) HTML from a shortcode.
http://wordpress.org/plugins/cpt-bootstrap-carousel/
GNU General Public License v2.0
51 stars 36 forks source link
bootstrap bootstrap-carousel carousel php wordpress wordpress-plugin

readme

CPT Bootstrap Carousel

A custom post type for choosing images and content which outputs Bootstrap Image Carousel (slider) from the [image-carousel] shortcode.

Description

A custom post type for choosing images and content which outputs a carousel from Twitter Bootstrap using the shortcode [image-carousel].

The plugin assumes that you're already using Bootstrap, so you need to load the Bootstrap javascript and CSS separately.

This plugin is available from the WordPress Plugins Directory: https://wordpress.org/plugins/cpt-bootstrap-carousel/. The source code is maintained on GitHub: https://github.com/ewels/cpt-bootstrap-carousel.

Shortcode Options

As of version 1.5, nearly all of these options can be set in the CPT Bootstrap Carousel Settings page. However, if you'd like different settings for different carousels, you can override these by using shortcode options...

Credits

This plugin was written by @tallphil with help and suggestions from several others including (but not limited to) @reddo, @joshgerdes, @atnon, @grahamharper, @rchq, @oheijo, @smtk, @cla63, @cookierebes and @sipman.

The Serbo-Croation translation was kindly provided by Borisa Djuraskovic from http://www.webhostinghub.com

The Spanish translation was provided by Chema Bescós from IBIDEM GROUP (https://www.ibidemgroup.com)

Contributing

If you would like to contribute to this plugin, please make a personal fork of the GitHub repository and then submit a pull request. For more details please see the contributing guide.

Installation

The easy way

  1. Go to the Plugins Menu in WordPress
  2. Search for "CPT Bootstrap Carousel"
  3. Click 'Install'
  4. Activate the plugin

Manual Installation

  1. Download the plugin file from this page and unzip the contents
  2. Upload the cpt-bootstrap-carousel folder to the /wp-content/plugins/ directory
  3. Activate the cpt-bootstrap-carousel plugin through the 'Plugins' menu in WordPress

Once Activated

  1. Make sure that your theme is loading the Twitter Bootstrap CSS and Carousel javascript
  2. Place the [image-carousel] shortcode in a Page or Post
  3. Create new items in the Carousel post type, uploading a Featured Image for each.

Frequently Asked Questions

The carousel doesn't start sliding itself / setting interval doesn't work

This can be caused by having your jQuery and Bootstrap javascript files included in the wrong place.

How do I insert the carousel?

First of all, install and activate the plugin. Go to 'Carousel' in the WordPress admin pages and add some images. Then, insert the carousel using the [image-carousel] into the body of any page.

Can I insert the carousel into a WordPress template instead of a page?

Absolutely - you just need to use the do_shortcode WordPress function. For example:

echo do_shortcode('[image-carousel]');

I get grey bars at the side of my images / The image isn't aligned (or doesn't reach the far side of the carousel)

This happens when the carousel is bigger than your images. Either upload higher resolution images, or select the "Use background images?" option in the settings (this will stretch the images though, so they may get a little blurry).

Can I change the order that the images display in?

You can specify the order that the carousel displays images by changing the setting in the Settings page, or by using the orderby and order shortcode attributes. The settings page has common settings, or you can use any terms described for the WP_Query orderby terms for the shortcode.

Can I have different carousels with different images on the same site?

Yes - create a few categories and add your specific images to a specific category. Then, when inserting the shortcode into the page, specify which category you want it to display images from using the category shortcode attribute.

Can I customise the way it looks / works?

The carousel shortcode has a number of attributes that you can use to customise the output. These are described on the main plugin Description page.

Help! Nothing is showing up at all

  1. Is the plugin installed and activated?
  2. Have you added any items in the Carousel post type?
  3. Have you placed the [image-carousel] shortcode in your page?

Try writing the shortcode using the 'Text' editor instead of the 'Visual' editor, as the visual editor can sometimes add extra unwanted markup.

My images are showing but they're all over the place

Is your theme loading the Bootstrap CSS and Javascript? (look for bootstrap.css in the source HTML)

The carousel makes the content jump each time it changes

You need to make sure that each image is the same height. You can do this by setting an Aspect ratio in the Edit Image section of the WordPress Media Library and cropping your images.

Screenshots

  1. Admin list interface showing Carousel images and titles. screenshot-1
  2. Admin image interface showing optional title and caption (Excerpt) fields, along with Category, order, image and URL screenshot-2
  3. Example output. Requires Bootstrap CSS and Javascript to be loaded (see documentation). screenshot-3

Changelog

1.13

1.12

1.11

1.10

1.9.1

1.9

1.8.1

1.8

1.7

1.6

1.5

1.4

1.3

1.2

1.1

1.0

Upgrade Notice

1.3

1.2

1.1