Caption Slider Snippet
There are several steps in order to make the slideshow snippet work on a web page
such as creating a new scripts folder, uploading images and creating a customized
java script file (fadeshow1.js).
- Create a scripts folder in your website in OU Campus by choosing New>>New Folder in the interface.
- Create the java script file (fadeshow1.js) from www.ttuhsc.edu/it/is/training/oucampus/content/scripts/fadeshow1.js using one of the two options listed below.
- Click on the link and do a File>>Save As>>fadeshow1.js in your browser. (The file
should default to the .js extension during the Save As process.)
- Click on the link, copy the text, paste into Notepad and Save As fadeshow1.js.
- Upload the file into the scripts folder that was created in step 1.
- (optional) Create a slideshow sub-folder in the images folder of your website in OU
Campus. (The images can actually be uploaded to the images folder without creating
a new sub-folder.)
- Upload the web-ready images into the images folder or slideshow sub-folder. In order
for the slideshow to be uniform, all images should be the same size. The snippet images
are 700 x 300. If you want a smaller slideshow be sure and adjust the width and height
in the java script file, (fadeshow1.js) to the same size as your images.
- Customize the java script file (fadeshow1.js) by adding your image URL's, captions,
size, speed etc. Links can also be added by putting the URL in the second set of double
["path_to_image", "optional_url", "optional_linktarget", "optional_description"]
- Insert the snippet into your page by placing the cursor where the slideshow will be
Snippet widget in the WYSIWYG editor.
- Publish both the java script file (fadeshow1.js) and the page containing the snippet.
Depending on where your scripts and images (slideshow) folders are located, you may
be done using the HTML widget in the WYSIWYG editor.
If you have any questions about using this snippet please contact Information Services
by email at IS.Training@ttuhsc.edu.