Slide Show: imc3Added by IBM on November 23, 2010 | Version 1 (Original)
|The Slide Show widget displays a set of images as a slide show. Users can advance the slides automatically or manually, skip to specific images, and select whether or not to display bubble descriptions. The images that you include in the slide show can originate from another widget on the mashup page or from a feed that represents a set of images.
The Slide Show
widget displays a set of images as a slide show. Users can advance the slides automatically or manually, skip to specific images, and select whether or not to display bubble descriptions. The images that you include in the slide show can originate from another widget on the mashup page or from a feed that represents a set of images.
You can populate the Slide Show
widget with images in the following ways:
- Create an RSS or Atom feed in the catalog, add it to the mashup builder, and then drag it onto the Slide Show widget to generate an automatic wire.
- Configure the Slide Show widget settings directly by adding the fully qualified URLs or relative paths to images
- Configure the Slide Show widget settings directly by pointing to a file that contains a set of images. These images can either replace or append the current images.
When configuring the Slide Show
widget, use the following tips:
- The Slide Show widget is preconfigured with a set of images. You can press the Shift key on your keyboard, select all of the images in the list, and then click Remove Selected Images to remove them from the widget.
- When adding an image from a URL or by specifying the relative path to an image on your machine, click Add New Image and then complete the row cells with the URL/path to the image as well as the title, the bubble description, and finally the position of the bubble description on the widget.
- When using data from a file, open the Configuration File section, and type in the path to the file. In the Load from File field, type the path to the file, and then select to either replace or append the current images configured the display in the slide show.
- To load the default images provided with Mashup Center, click Load.
- When using data from a feed, complete the element fields to specify the URL, title, hint, and hint position. See the following descriptions for more information about these elements:
- URL - provides the image to display as a slide
- Title (optional) - specifies the title to display in the header above the slide
- Hint (optional) - specifies the text to display in the pop-up bubble
- Hint Position (optional) - specifies the position of the pop-up bubble. Values can be Top Left, Top Right, Bottom Left, and Bottom Right. The default position is Top Left.
- Element values must use an element.attribute notation, for example media:content.url. To see which elements are available, load the feed URL in your browser and view the page source. If the feed is an Atom feed, you can reference any element in the <entry> block. If the feed is an RSS feed, you can reference any element in the <item> block.
- In the Options section, select to enable or disable the auto-play and auto-repeat functions as well as the delay time for advancing slides.
See the following table to learn which events the Slide Show
widget can send and receive:
Table 1. Slide Show events
|This widget does not send content.||Accept Feed URL using URL: receives data from a feed URL.|
|Accept Data using Any Data: receives data in any format, for example a table, text, object, or array.|
: Display images from a feed that you create in the feed generator.
- Do the following steps to create a new feed and add it to the mashup builder.
- Open the Mashup Center feed generator, and select to create a new feed.
- On the Select a feed data source page, select Existing RSS or Atom Feed (Registration).
- Click Next.
- On the Specify the URL for the RSS or Atom feed page, paste in the following URL: http://feed.photobucket.com/images/sunset/feed.rss.
- Click Next.
- On the next page, type a title and description of the new feed, for example Sunset pictures.
- Click Finish.
- Click View feed details.
- Click Add to mashup builder.
- In the Feed Viewer field, change the widget to the Feed Reader widget.
- Click Finish.
- In the mashup builder, refresh the current page to see the new widget in your palette. Note: Be sure to save the page before refreshing it.
- Drag the Slide Show widget onto the mashup page.
- In the Slide Show configuration dialog box, remove the default images provided with Mashup Center.
- In the Configuration File section, type media:content.url in the Image URL Element field and Title in the Image Hint Element field.
- Click Save.
- Drag the new Sunset pictures feed from the palette onto the mashup page, and drop it directly onto the header of the Slide Show widget.
- Mashup Center automatically wires the feed to the slide show and sends the Feed Reader widget to the hidden widgets corral. Now you should see the images load in the Slide Show widget.
Parent topic: Widget reference: imc3