Caption Layer Builder

Created by PIXELONETRY LLC, Modified on Thu, 12 Dec at 6:08 PM by PIXELONETRY LLC

Captions are added to slides using the layer builder. This builder works by assigning each caption to a separate layer. Captions layers may contain text, images or HTML markup. Each layer is they given an X & Y coordinate position as well as animation parameters. In this way complex animated captions may be created for slides.

To create a caption do the following (Once the featured image has been set):

With the slide image showing in the preview box, enter a size for the slide in the Size box immediately below the preview box. This size should match the size of your slider when it will be inserted into the page. If you are creating a full Width slider, enter 940px for the width (even thought in a full width slider, the image will be bigger then this, the caption area will not be larger then 940px).
If you wish to change the image in this preview area, simply click the "Change Image" button and the WP media dialog will open so you can choose an alternative image.
Next click on "Add New Layer" to create a layer for your caption.
The layer will appear in a table under the slide preview, the dark outline of the table row signifies that this layer is currently being edited. As well as the table row appearing you should also see a set of layer properties. These properties will be explained in a moment here below.
Add content to this layer by typing in the Content field (if text/HTML content) or clicking on the green "+" icon (if image content). You will see your content appear at position 0,0 or the top left of the slide preview box.
Add an X & Y position for your caption. These values represent the final position of your caption (after animation) and are relative to the top corner of the image preview window, which is position X=0, Y=0. When you enter new values in these boxes you should see your caption content's position update reflected in the preview window.
Next enter a value in the Wait field. This value (secs) represents the delay before this caption's animation begins. Example, if a figure of 1.5 is entered, the animation of this caption will begin after one and a half seconds has elapsed.
Next enter a value in the Duration field. This value (secs) represents the amount of time the caption takes to animate. Therefore the longer the duration time the slower your caption will move/animate. Likewise, the shorter the duration time, the faster it will move.
Finally to complete this caption, you will need to set the caption's properties. These are as follows:

Caption Layer Properties

Theme	Choose the theme of the caption, White or Black. This determines whether the main coloring of the caption text is white or black.
Text	Set the size of the caption text from the available pre-made options. See the slide preview for live updates of the caption text once an option has been changed.
Transition	Choose the animation/transition you would like to apply to your caption. See the following page for a demo of all available transitions: http://daneden.me/animate/
Color	Select the color of the text using a color picker.
Background	If you require a background for the caption text you can set this here. The list contains different % settings for the background's transparency. 100% denotes a solid background.
BG Color	Select the color of the text background using a color picker.
Classes	Here you can enter custom class names which will be added to this caption. These class would then need to be styled in your CSS stylesheet.
Style	Here you can add inline CSS properties which will be added to the caption. Eg. "font-size=20px;" (without quotes)

To test your animation at any time click the "Run" button located immediately beneath the slide preview area.

Once the caption layer's properties are all set, click the "Save" button, and then proceed to add more layers as required. When multiple layers have been added, make sure that the layer you wish to edit has the dark color of the selected layer. To select a layer to edit, click the "Edit Icon" (paper & pencil) next to the "duration" field.

Tip: Position your caption layers by eye: 1. Once the layer is selected you can use the arrow keys on the keyboard to move the caption.
2. Alternatively hold the shift key and click on the caption in the preview window. Now move the mouse, no need to hold the mouse buttons, and click again where you want to drop the caption.

An empty slide is required to be created when the video home option is being used. This slide is added to the home video "view" when it is being created.