Add a Portfolio Slider to Your Site

Sample Slider (speed at 30)

Directions

Add a Custom Script Element to the page

  • Click the Click Here to insert new element link on the page where you want to add the Portfolio Slider Widget.
  • Select Miscellaneous Elements from the list of categories when the Element Gallery window appears.
  • Choose Custom Script from the list of items under Miscellaneous Elements.
  • The page will refresh to include the link, Click here to define the Custom Script element.
Customize the Custom Script Element
  • Click the Click here to define the Custom Script element link to open the Custom Script Element Window.
  • Make sure the Properties tab is selected at the top of the window.
  • Copy /www/portfolios/customcf/slider.cfm into the textbox under the Explicit Module header.
  • Click the Parameters tab at the top of the Custom Script Element window to tell the plugin which portfolio to display.

    Required Variables

    • portfolioID=[number]

      The ID of the Portfolio as listed in the URL - only the numbers after the = sign in the URL.

      How to find the portfolio ID:
      • Go to the portfolio listings at http://cms.skidmore.edu/portfolios/ and select the portfolio you wish to highlight.

      • The portfolio ID is at the end of the URL for the individual event. For example, the URL for the 2011 Academic Festival is http://cms.skidmore.edu/portfolios/portfolio.cfm?catID=912. The portfolioID is 912 at the end of the address.

      • portfolioID=912 in this example

  • Add optional variables to further customize the display of your portfolio slider. You can add a title, set the width, and set the scrolling speed.

    Optional Variables
    • width=[integer] How wide the slider should appear. The default width is 500px.
    • portfolioTitle=[string] The title listed above the slider, text only.
    • scrollSpeed=[integer] How fast the images should scroll down. The lower the number, the faster the slider scrolls through the images. The default speed is 20.

  • Once your settings are made, click Finish.
  • Publish your changes.

You can have multiple sliders on a page, but the first will dictate the speed of the following sliders.

Example: Code for Sample Slider above

portfolioID=912
portfolioTitle=Sample Slider (speed at 30)
scrollSpeed=30