Slideshow

The Slideshow module is a custom module, meaning that it is not automatically available to all Javelin users. If you feel that your site would benefit from a Slideshow module, please call us at 405-478-4080 or file a support ticket or pricing details.

What is the JQuery slideshow module used for?

The slideshow module will display images that fade-in and are set in a specific order.

How do I add images to my slideshow?

Step 1: Hover over the image currently being displayed and click the pencil icon that will appear in the top left corner.

Step 2: Scroll down to the bottom of the list of images already in the slideshow and click the "Add Another Image" Link. (You may have to scroll down again to see the fields after clicking the link.)

Step 3: Click the "Images" link next to the first text field.

Step 4: Select the properly sized image you want from the image manager. View the tutorial on the image manager.

Step 5: Click "Save".

How do I delete images from my slideshow?

Step 1: Hover over the image currently being displayed and click the pencil icon that will appear in the top left corner.

Step 2: Find the image you want to remove on the screen.

Step 3: Click the "Remove" link. It should be just below the preview of the image.

Step 4: Click "Save".

How do I resize an image to fit in my slideshow?

Step 1: Click the "Settings" button on the module bar.

Step 2: Write down the width and height. These are the dimensions you will need to resize your image to.

Step 3: View the tutorial on editing images through the image manager.

Remember, you must resize images to the proper dimensions or the module may not look like it should.

How do I change the order of the images displayed?

Step 1: Hover over the image currently being displayed and click the pencil icon that will appear in the top left corner.

Step 2: Find the image you want to move on the screen.

Step 3: Click and hold the word "Sort" above the image preview.

Step 4: Drag and drop the image to the desired position.

Step 5: Click "Save".

How do I add a link to a specific image?

Step 1: Hover over the image currently being displayed and click the pencil icon that will appear in the top left corner.

Step 2: Find the image you want to add a link to on the screen.

Step 3: Type the URL of the page you want the image to go to when clicked in the "Link" field. If it is a link to a page within your site, please view the tutorial on making links to inside pages.

Step 4: Click "Save".

How do I add a caption?

The slideshow module does not automatically display captions. Please contact us at (405) 478-4080 for details.

Step 1: Hover over the image currently being displayed and click the pencil icon that will appear in the top left corner.

Step 2:  Find the image you want to add a caption to on the screen.

Step 3: Add the desired text to the final field below the image preview.

Step 4: Review the caption on the slideshow to ensure it isn't too long.

Oops! I broke it!

Do any of the images have the .JPG extension?

If any of the images have .JPG as an extension, all uppercase, that will break the module. We are working on a fix, but in the meantime, please complete the following steps:

  • Edit the image as if you were going to resize it but don't change anything.
  • Save the image with a new name.
  • Re-enter the image into the slideshow module and save.

If that doesn't fix it, contact us at (405) 478-4080 or file a support ticket and we'll figure out the problem.

Has the XML file been deleted?

Click the "Settings" button. if the final field is empty, try entering images.xml or slideshow.xml. If those don't work, contact us at (405) 478-4080 or file a support ticket and we'll fix it. 

Does clicking the pencil icon give you a blank page?

First, contact us at (405) 478-4080 or file a support ticket, because we have to fix it on our side.

Second, avoid the issue. It's probably an ampersand.

What's an ampersand? & ← That.

If you need to use an ampersand (in a link and/or caption), replace it with it's HTML entity, &. Yes, it starts with an ampersand but the browser will read it correctly.

Third, you will have to redo all your ampersands as entities every time you edit the module. This is because your browser will parse the entity (replace it with the appropriate character) on the page as it loads.