If you've embedded a slideshow published by Director (click here for instructions) there are additional options available to you. These are made in your HTML document's player embed code.
If you need to fine-tune the width and/or height of the embedded slideshow, simply edit the width and height values. The player will automatically adjust to the new size, and Director will publish new content formatted for those updated dimensions.
To change content, sign-in to Director and click on the album/gallery you want to change to. In the same "Publish" box where you originally copied the embed code will be a row labeled "XML File Path". Click the "Copy" button in that row. Return to your HTML document and replace the xmlFilePath flashvars currently assigned. Your new album/gallery will load.
Director provides access to all major player parameters, but there are a number of minor ones that can be adjusted to further customize layout, behavior, and style. For a complete list of all available parameters, click here.
If you'd like to edit a player parameter, add the parameter name and assign a new value, like captionAppearance below:
flashvars: {
captionAppearance: "Fixed",
paramXMLPath: "http://you.slideshowpro.com/m/params/techno.xml",
xmlFilePath: "http://you.slideshowpro.com/images.php?album=1"
}
Save the HTML document, refresh your web browser, and your changes will be applied.
You can modify the visibility of two of the mobile player's buttons. To show the back button (which is not shown by default), add a showBackButton attribute to the mobile properties and set it to true, like so:
mobile: {
showBackButton: true
},
To hide the info button (which is shown by default), add a showInfoButton attribute to the mobile properties and set it to false, like so:
mobile: {
showInfoButton: false
},
As explained in the slideshow overview, Director will create a poster preview of your gallery for those on a (supported) mobile device that does not include the Flash Player plugin. Tapping the poster leads the user to the mobile player which loads all the same content.
To auto-forward users with a compatible mobile device to the mobile player, add an auto attribute to the mobile properties and set it to true, like so:
mobile: {
auto: true
},
To see the poster without uninstalling Flash, add a devMode attribute to the mobile properies and set to true. Remember to remove this when finished editing!
mobile: {
auto: false,
devMode: true
},
Edit the slideshow div where the SWF and/or poster is rendered with an interior ssp-mobile-poster div, like so:
<div id="album-1"> <div class="ssp-mobile-poster"> </div> </div>
Place content inside ssp-mobile-poster and it will display instead of Director's default poster. The poster dimensions are the exact same size as the Flash Player width and height, as assigned in attributes. Keep that in mind if creating your own graphic or HTML content.
To display the title/description of the album or gallery, add the following:
<div id="album-1">
<div class="ssp-mobile-poster">
<h3>{{title}}</h3>
<p>{{description}}</p>
</div>
</div>
To publish a hyperlink to the mobile player, add the following:
<div id="album-1">
<div class="ssp-mobile-poster">
<a href="{{mobile_link}}" title="Mobile link">View mobile player</a>
</div>
</div>
SlideShowPro Director will automatically assign a hyperlink to your entire custom poster that (when clicked) transports the user to the mobile player. But you can use the {{mobile_link]] tag to publish your own links inside the player's JavaScript code.
SlideShowPro Director automatically attaches the 'tap link' to the poster that's displayed (whether generated by SlideShowPro Director or created by you). If you don't want that link to be attached, you can turn it off like so:
mobile: {
linkToPlayer: false
}
If you don't want any poster to be published, simply add an empty ssp-mobile-poster div inside the content div, like so:
<div id="album-1"> <div class="ssp-mobile-poster"> </div> </div>
If you wish to use Director's default poster but need to modify its markup, you can do so by appending a style sheet that overrides the poster styles. Here's a template:
<style type="text/css">
.ssp-mobile-poster-content {
/* Parent div of content underneath image */
}
.ssp-mobile-poster-label {
/* "Media Gallery" text */
}
.ssp-mobile-poster-title {
/* Album and gallery title */
}
.ssp-mobile-poster-description {
/* Album and gallery description */
}
.ssp-mobile-poster-button {
/* "View Gallery" button */
}
</style>
When applying your own styles, use !important to override existing values. For example:
.ssp-mobile-poster-title {
/* Album and gallery title */
color:#ffcc00 !important;
font-size:24px !important;
}
Some Android devices (and others coming soon) have the Flash Player plugin and will display the same content seen by desktop users. If you'd prefer to use the mobile player for all mobile devices (Flash Player included or not), add a flash attribute to the mobile properties and set it to false, like so:
mobile: {
auto: false,
flash: false
},
If you want the mobile player to load different content than the Flash player, assign the XML File Path of the album/gallery you want to load to the mobile object, like so:
mobile: {
auto: false,
xmlFilePath: "http://you.slideshowpro.com/images.php?gallery=1"
},
By default, Director adds a small amount of sharpening to images that are fed to the mobile player. Most of the time, it is advisable to leave this enabled, but if you would like to disable the sharpening, you can do so:
mobile: {
sharpening: false
},