---
title: How To Use The Floating Effects Extension By Wow Elements Pro
description: "The [Floating Effects](https://wowelements.com/extensions/floating-effects-extension-for-elementor/) extension in [Wow Elements](https://wowelements.com/) allows you to add smooth floating and motion animations to your website elements without any coding. It helps create interactive and visually engaging designs by making sections, images, icons, or widgets move dynamically…"
url: "https://wowelements.com/docs/floating-effects-extension/"
updated: "2026-08-10"
category: Extensions Customization Guide
tags:
  - Elementor
  - Elementor Addon
  - Elementor Extensions
  - Elementor Templates
---

# How To Use The Floating Effects Extension By Wow Elements Pro

The [Floating Effects](https://wowelements.com/extensions/floating-effects-extension-for-elementor/) extension in [Wow Elements](https://wowelements.com/) allows you to add smooth floating and motion animations to your website elements without any coding. It helps create interactive and visually engaging designs by making sections, images, icons, or widgets move dynamically on the screen. With flexible customization controls and animation settings, you can easily enhance the creativity and user experience of your Elementor website. In this documentation, we will guide you through how to use and customize the Floating Effects extension in Wow Elements.

## Enabling the Floating Effects Extension

![Enabling the Floating Effects Extension](https://wowelements.com/wp-content/uploads/2026/05/Enable-the-extension-8-1024x486.webp)

To use the **Floating Effects **Extension from Wow Elements Pro, first, you have to enable the extension.

1. Go to **WordPress dashboard → Wow Elements** Plugin dashboard.
2. Then, Click the **Extension** Tab.
3. Search the **Floating Effects** Extension Name.
4. Enable the **Floating Effects** Extension.
5. Hit the **Save Settings** Button

## Initial Setup for Floating Effects Extension

![Initial Setup for Floating Effects Extension](https://wowelements.com/wp-content/uploads/2026/05/Things-Need-to-do-first-1024x561.webp)

Before using the Floating Effects extension, you first need to create or select an existing design where you want to apply the extension. Here, we have create a design to show you the example.

## Where To Find Floating Effects Extension

![Where To Find Floating Effects Extension 01](https://wowelements.com/wp-content/uploads/2026/05/Where-to-find-the-extension-01-1-1024x506.webp)

**1.**To find the**Floating Effects Extension**, you must need to select the element where you want to use the extension. 
**2.**Now, move to Advanced Tab of the selected widget.
**3.** Here, you will find the default Motion Effects.

![Where To Find Floating Effects Extension 02](https://wowelements.com/wp-content/uploads/2026/05/Where-to-find-the-extension-02-1-1024x542.webp)

**4.** Now inside the Motion Effects section, you will find the Floating Effects.

## **Configuring the Floating Effects Extension**

![Configuring the Floating Effects Extension - Translate](https://wowelements.com/wp-content/uploads/2026/05/Configuring-the-floating-effects-Translate-1024x553.webp)

**1. Translate**: With this option you can move the element from one position to another along the X and Y axes, creating a smooth floating or shifting animation effect. Let's see what we can customise with this Translate option -

- **Translate X** - You can move the element horizontally (left to right) with this option.
- **Translate Y** - You can move the element vertically (up and down). **Note:**The From → To values define the starting and ending position of the movement.
- **Duration** - This option controls how long the animation will take.
- **Delay** - You can set how long it waits before starting with this option.

### Preview of Translate Option

Now, let's get back to configuring the Floating Effects Extension. This time we will discuss about the Rotate option -

![Configuring the Floating Effects Extension - Rotate](https://wowelements.com/wp-content/uploads/2026/05/Configuring-the-floating-effects-Rotate-1024x548.webp)

**2. Rotate:** You can add a rotation animation to the element along different axes, creating a 2D or 3D spinning effect. Let's see what we can customise with this Rotate option -

- **Rotate X** - This option allows you to rotate the element along the horizontal axis (tilts it forward or backward in 3D).
- **Rotate Y** - This option allows you to rotate rotate it along the vertical axis (spins it side‑to‑side in 3D).
- **Rotate Z** - This option allows you to rotate rotate it normally from the front (standard clockwise or counterclockwise spin).
  **(Note:** From → To sets the starting and ending rotation angles.**)**
- **Rotate Infinite** - Enable the switcher to make the rotation loop continuously with this option.
- **Duration** - This option controls how long the rotation will take.
- **Delay** - You can set how long it waits before starting.

### Preview of Rotate Option

Now, let's get back to configuring the Floating Effects Extension. This time we will discuss about the Scale option -

![Configuring the Floating Effects Extension - Scale](https://wowelements.com/wp-content/uploads/2026/05/Configuring-the-floating-effects-Scale-1-1024x513.webp)

**3. Scale:** This option allows you to animate the size of the element, making it grow or shrink smoothly.

- **Scale X** - You can make changes the width (horizontal size) from the “From” value to the “To” value.
- **Scale Y** - You can make changes the height (vertical size) from the “From” value to the “To” value.
- **Duration** - This option controls how long the rotation will take.
- **Delay** - You can set how long it waits before starting.

### Preview of Scale Option

Now, let's get back to configuring the Floating Effects Extension. This time we will discuss about the Skew option -

![Configuring the Floating Effects Extension -Skew](https://wowelements.com/wp-content/uploads/2026/05/Configuring-the-floating-effects-Skew-1024x492.webp)

**4. Skew:** This options allow you to animate the element by slanting or distorting its shape along the X or Y axis.

- **Skew X** tilts the element horizontally (left or right), shifting the top and bottom edges.
- **Skew Y** tilts it vertically (up or down), shifting the left and right edges.
- **Duration** - This option controls how long the rotation will take.
- **Delay** - You can set how long it waits before starting.

### Preview of Skew Option

Now, let's get back to configuring the Floating Effects Extension. This time we will discuss about the Border Radius option -

![Configuring the Floating Effects Extension - Border Radius](https://wowelements.com/wp-content/uploads/2026/05/Configuring-the-floating-effects-Border-Radius-1024x501.webp)

**5. Border Radius:** You can animate the corner as roundness of the element over time with this option.

- **Start and End (From → To)** - You can set the initial and final corner radius values, changing the shape from slightly rounded to more circular with this option.
- **Duration** - You can control how long the shape transition will take with this option.
- **Delay** - You can set how long it waits before starting the animation.

### Preview of Border Radius Option

Now, let's get back to configuring the Floating Effects Extension. This time we will discuss about the Opacity option -

![Configuring the Floating Effects Extension - Opacity](https://wowelements.com/wp-content/uploads/2026/05/Configuring-the-floating-effects-Opacity-1024x499.webp)

**6. Opacity:** You can control the transparency animation of the element how it will be visible during the effect with this option. You can make changes to -

- **Start** - You can set the initial transparency level with this option.
- **End** - You can set the final transparency level with this option.
- **Duration** - You can control how long it takes to transition from the start opacity to the end opacity.

### Preview of Opacity Option

Now, let's get back to configuring the Floating Effects Extension. This time we will discuss about the Easing option -

![Configuring the Floating Effects Extension - Easing](https://wowelements.com/wp-content/uploads/2026/05/Configuring-the-floating-effects-Easing-1024x485.webp)

**7. Easing:** This option control the speed style of the animation — how it starts, moves, and ends instead of moving at a constant speed. You will find some options and you can choose any of those that meet your expectation.

All done, You have successfully customised the Floating Effects Extension on your website.

## Video Assist

[How to Use the Floating Effects Extension in Elementor | Wow Elements Tutorial](https://www.youtube.com/embed/_13R_x0Vgy8?feature=oembed&enablejsapi=1)

You can also watch the tutorial video about the Floating Effects Extension. Please visit the [demo page](https://wowelements.com/extensions/floating-effects-extension-for-elementor/) for examples.

Thanks for staying with us.