cogApplication that allows users to easily create carousels, while still offering a variety of settings, like auto-sliding(on/off), interval, width, height and background color for the carousel, and for each slide you can set the image and caption text with
TypeXAR
CategoryApplication
Developed by

Paul Pantiru, Yacine Kebir

Active Installs40
Rating
Rate!
1 Votes
LicenseGNU Lesser General Public License 2.1
Installable with the Extension Manager

Description

Application that allows to create carousels.

For each carousel you create you have a variety of settings:

For the general carousel:

  • Auto-sliding on/off
  • The interval for automatic sliding
  • The width of the carousel
  • The height of the carousel
  • The background color (with a color picker or by hand if you know the css id for the color)

For each slide you can set:

  • An image
  • A caption title
  • The size for the caption title
  • The color for the caption title (with a color picker or by hand if you know the css id for the color)
  • Some caption text
  • The size for the caption text
  • The color for the caption text (with a color picker or by hand if you know the css id for the color)
  • And a link for the caption title

Usage

After installing the extension, click on the "XCarousel" icon in the Applications Panel:

Applications_Panel.png

Home page:

Home.png

Here click the ADD NEW ENTRY from the Actions section on the right, and give a name to your new carousel.

Give_it_a_name.png

You will then be prompted to the carousel's edit mode, where you can set it up as you like.
By default the auto-sliding optin will be enabled, and 3 empty slides will be created automatically.

Add_or_remove_slides.png

Create or delete as many slides as you want using "Add new slide/Delete Slide" buttons, and set an image for each of your slides.

  • Adding an image for each slide is the only mandatory thing to do for the carousel to function.

Attach_an_image.png

Customize your carousel. You can set caption text and change the size or color for it. You can also add a link for the caption title.

Customize_Slides.png

After the setup is done, save the page and you can insert the new carousel into any page using the XCarousel Macro.
You can edit the carousel at any time by clicking the little pencil from the livetable in the XCarousel Home page (see first image), or by going directly to the carousel's page and entering edit mode.

ex: {{xcarousel carousel='Demo'/}}

And there you go, you have a carousel.

The_result.png

Tested on

This extension has been tested with the following configurations.

Extension VersionXWiki FlavorNotes
1.0XWiki Enterprise 6.2.2
1.0XWiki Enterprise 6.4.4
1.0XWiki Enterprise 7.4
1.1XWiki Enterprise 6.2.2
1.1XWiki Enterprise 6.4.4
1.1XWiki Enterprise 7.4

Prerequisites & Installation Instructions

We recommend using the Extension Manager to install this extension (Make sure that the text "Installable with the Extension Manager" is displayed at the top right location on this page to know if this extension can be installed with the Extension Manager). Note that installing Extensions when being offline is currently not supported and you'd need to use some complex manual method.

You can also use the following manual method, which is useful if this extension cannot be installed with the Extension Manager or if you're using an old version of XWiki that doesn't have the Extension Manager:

  1. Log in the wiki with a user having Administration rights
  2. Go to the Administration page and select the Import category
  3. Follow the on-screen instructions to upload the downloaded XAR
  4. Click on the uploaded XAR and follow the instructions
  5. You'll also need to install all dependent Extensions that are not already installed in your wiki

Release Notes

v1.2

  • Closed XCAROUSEL-11 When one of the slides does not have have an image attached, a velocity error appears
  • Closed XCAROUSEL-10 Delete slide button only removes the slide temporarily, but does not delete the slide object
  • Closed XCAROUSEL-9 The Add new slide button does not work dynamically ( only after refresh )
  • Closed XCAROUSEL-8 Missing issues management element in the pom

v1.1

  • Closed XCAROUSEL-4 Center carousel on page
  • Closed XCAROUSEL-3 The edit form of the carousel should not be displayed in the pages that includes it.
  • Closed XCAROUSEL-2 The carousel image doesn't follows the carousel dimensions & image has low quality
  • Closed XCAROUSEL-1 designing the extension edit mode in using bootstrap + colourtheme relations
Tags:
Created by Paul Panțiru on 2016/03/11 13:43
    

Get Connected