Animation Presets^New

How Presets Work

🔶 Creating Your First Preset

1. Edit any page with Bricks Builder
2. Add or select an element (Heading, Text, Image, Container, etc.)
3. Go to the Style tab and find the “OoohBoi Kinekt” panel
4. Enable “Activate Kinekt?” and configure your animation:
   • Choose animation type (From-To, Text Effects, Image Effects, SVG Line Effects)
   • Set triggers, duration, easing, and other properties
   • Configure any specific settings for your chosen animation type
5. Enter a Preset Name in the “Preset Name” field (at the very bottom of the panel)
6. Save the page – your animation will be automatically saved as a preset

Managing Presets in WordPress Admin

🔶 Access your presets at: WordPress Admin → OB Kinekt → Presets

Column Name	Description
Preset Name	The name you gave your preset
Animation Type	The type of animation (From-To, Text Effects, etc.)
Element Type	The Bricks element type (heading, text, image, etc.)
Animation ID	Unique system-generated ID for Timeline Controller removed since version 2.1.3
Created	When the preset was first created
Updated	Last time the preset was modified
Actions	Export and Delete buttons

Export and Import Presets

🔶 Exporting Presets

Export Single Preset

1. Find the preset in the table
2. Click the “Export” button
3. The preset will download as a .json file

Export All Presets

1. Click “Export All” in the Import/Export section
2. All presets download as a single .json file

🔶 Importing Presets

Import Single or Multiple Presets

1. Click “Choose File” in the Import section
2. Select your .json file
3. Click “Import”

Import Results

After import, you’ll see:

• Added: New presets that were imported
• Updated: Existing presets that were updated
• Skipped: Presets that couldn’t be imported

• Using Presets in Your Designs

🔶 Method 1: Load Existing Preset

1. Add any element in Bricks Builder
2. Go to Style tab → “OoohBoi Kinekt” panel
3. Enable “Activate Kinekt?”
4. Change Animation Type to “Preset”
5. Select your preset from the dropdown
6. The animation loads instantly!

NOTE: If the preset you created doesn’t show up on the list immediately, use the search from the list top!

Preset “Animation ID”

Since OB Kinekt version 2.1.3 presets are pure animation templates without embedded IDs! Users can optionally assign a unique Animation ID to that specific preset instance. It means that the Animation ID is being removed from preset storage. This involves changes to preset creation, export, import, and admin UI.

Dynamic data support

• {post_id} → resolves to current post ID
• {echo:myFunction()} → executes custom PHP function
• My animation {post_id} → resolves to “My animation POST_ID”
• {acf_field_name} → resolves to ACF field value
• Any other Bricks dynamic data tag

🔶 Method 2: Timeline Controller

Use presets with the Timeline Controller for advanced animation control:

1. Add a Timeline Controller element (almost any element can be a controller)
2. Configure it to trigger your preset animations
3. Set execution mode: Simultaneous or Sequential
4. Choose trigger event: Click or Hover

❗️Element Type Awareness

Presets work best when used with matching element types:

• Text presets → Heading, Text elements
• Image presets → Image elements
• Layout presets → Container, Section elements

❗️Preset Limitations

• 50 preset limit – older presets are automatically cleaned up
• Animation ID consistency – required for Timeline Controller — NOTE: A preset CAN HAVE only 1 unique animation ID
• Element compatibility – some animations work better with specific element types