This plugin adds a countdown timer animation to Pulse slideshows. The timer visualizes the amount of time left until the next item is requested. Plugin includes two timer animation styles and may be repositioned.
Follow these steps to setup and use the plugin.
Enabling the plugin
After the plugin has successfully downloaded and installed you will be redirected to Settings > Plugins inside Koken. Click the plugin's Enable button to activate the plugin.
Adding to a slideshow
The timer element added by this plugin may be used with any Pulse slideshow (Koken's built-in slideshow player). These are slideshows published using the
<koken:pulse> template tag. The timer element may be added to a slideshow by following these steps.
- Click on Site in the console's main navigation.
- Navigate to the page containing the slideshow you wish to use the timer with.
- Mouseover the slideshow and click the gear button that appears at top-right.
- A slideshow edit panel will appear. At the bottom will be a new "Timer" row with a checkbox labeled Enabled. Check the box.
- Click the Publish changes button at the bottom right of Site.
Your slideshow should now display a countdown timer in the top-right-hand corner.
Editing timer appearance
Once enabled the slideshow settings panel (see above) offers a few configurable options to change the appearance of the timer. They are as follows:
- Style - The animation style. Options include "Beam" (default), "Pie" and "Bobber".
- Position - Move the timer to the one of nine positions.
- Countdown - Reverses the "Beam" and "Pie" animations so that they walk backward and erase themselves instead of building-up.
- Size - Dimensions of the timer, in pixels.
- Progress - Color of the primary animation element.
- Background - (Beam only) Color of the timer background.
- Alpha - (Beam only) Transparency of the timer background.
This plugin adds additional attributes to the
<koken:pulse> template tag. If you are designing your own site theme you may add these new attributes to the tag if you'd like to assign a default value that differs from the ones applied.
|timer:enabled||Boolean||Show (true) or hide (false) a countdown timer while in auto-playback. The default value is "true".|
|timer:type||String||The animation style of the Timer. Options include "Beam" and "Pie". The default value is "Beam".|
|timer:position||String||Where the timer element should be positioned. Options include "Center", "Top Left", "Top Center", "Top Right", "Center Right", "Bottom Right", "Bottom Center", "Bottom Left", and "Left Center". Default value is "Top Right".|
|timer:size||Number||Size of the timer element.|