HTML5 Widgets can be great for adding a little bit of color and motion to your publications, but can sometimes be a hassle to put together. For simple text and image animations, we have a solution! The Zmags Widgetizer makes it easy to generate an animation on the fly:
To start, click one of the tabs at the top to choose text, image/SVG, or an AddThis social sharing bar. The top half of the settings allows you to choose the content of your animation, such as text and formatting, image source, or what URL to share.
Note: For your publication to play HTML5 animations, it must be using a HTML5 Viewer.
Text: Allows you to animate text that can then be added to a Publication. Standard HTML5 fonts and all Google fonts are supported.
Image: Allows you to animate an image file which is currently hosted online.
Share: Allows you to select a Social Media Icon that can be animated and placed on a Publication; the Publication can then be shared to that specific Social Network when clicking the icon.
The second half of the settings allows you to specify the parameters for the animation:
- Slide in from: If you would like the object to slide in, choose from what side.
- Fade in: Check this box if you would like the object to fade in.
- Duration: How long, in milliseconds, the animation will take to complete.
- Delay: How long, in milliseconds, to wait before starting. There are 1000 milliseconds in one second.
- Easing: Provides more advanced animation options. Click the blue (i) icon for more information.
- Clear: Click this to start over.
When finished, simply copy the provided "Widget URL" to your HTML5 widget in Zmags Enriched.