# Animated Ads (Pro)

The Animated Ads feature helps you to select multiple ads, arrange them in the desired order and display them with animation effects.\
\
Note: AMP Ads are not compatible with animation effects.

### Displaying Animated Ads

#### Display Animated Ads using Gutenberg Block

{% hint style="danger" %}
Please note that the Gutenberg Block for displaying Animated Ads will be deprecated soon. Refer <https://docs.wpeka.com/wp-adcenter/placing-ads/placing-ad-using-consolidated-block-elementor-widget> to replace the Animated Ads Gutenberg block with the Consolidated Ad Gutenberg Block.
{% endhint %}

* Select **WPAdCenter Animated Ads** block in the editor as shown below.

![](/files/4SuOJONr4LoJflpKfcxY)

* Select the display animation type from the dropdown.
* Display animation types are Carousel, Top Scrollbar, Bottom Scrollbar, Floating Top Right, Floating Top Left, Floating Bottom Right, Floating Bottom Left and Pop Up.
* Select ads that are to be displayed on the front end.
* The order of the ads can be set by drag and drop or also clicking on the arrow buttons.
* Set the number of columns for displaying ads( if applies to animation-type ).
* To provide maximum width for an ad, enable the **Max Width** option and provide a maximum width value.
* To display ads on specific devices, select the corresponding checkboxes. The changes will take effect on the preview page or live page and not while editing.
* Click on **Publish**/**Update** button.

#### Display Animated Ads using Shortcode

* Shortcode for reference:\[wpadcenter\_animated\_ads ad\_ids=48,49 display\_animation\_type='carousel' num\_columns=1 max\_width='on' max\_width\_value=300 devices=mobile,tablet,desktop]

![](/files/-MeT5WwhRtCg7lKq7Uwa)

* Provide the display animation value as carousel, scrollbar-top, scrollbar-bottom, floating-top-right, floating-top-left, floating-bottom-right, floating-bottom-left or popup.
* Provide comma-separated ad IDs in the order that they should be displayed on the front end.
* Set number of columns for displaying ads on the front end( if applies to animation-type ).
* Max width can be set to  "on" or "off".
* Max Width Value is the value in pixels.
* To display ads on specific devices, specify the names of devices. If the 'devices' attribute is not provided the ad will be shown on all devices.
* Click on **Publish**/**Update** button to save the shortcode.

#### Display Animated Ads using Widget

* Select **WPAdCenter Animated Ads** widget as shown in the image below.

![](/files/-MeT8eLejtPIsMcFrwSR)

* Select the display animation type from the dropdown.
* Display animation types are Carousel, Top Scrollbar, Bottom Scrollbar, Floating Top Right, Floating Top Left, Floating Bottom Right, Floating Bottom Left and Pop Up.
* Select ads that are to be displayed on the front end.
* The order of the ads can be set by drag and drop or also clicking on the arrow buttons.
* Set the number of columns for displaying ads( if applies to animation-type ).
* To provide maximum width for an ad, enable the **Max Width** option and provide a maximum width value.
* To display ads on specific devices, select the corresponding checkboxes.
* Click on the **Save** button.

#### Display Animated Ads using Elementor

{% hint style="danger" %}
Please note that the Elementor Widget for displaying Animated Ads will be deprecated soon. Refer <https://docs.wpeka.com/wp-adcenter/placing-ads/placing-ad-using-consolidated-block-elementor-widget> to replace the Animated Ads Elementor widget with the Consolidated Ad Elementor widget.
{% endhint %}

* Select **WPAdcenter Animated Ads** widget which is present under the **General** category.

![](/files/4SuOJONr4LoJflpKfcxY)

* Select the display animation type from the dropdown.
* Display animation types are Carousel, Top Scrollbar, Bottom Scrollbar, Floating Top Right, Floating Top Left, Floating Bottom Right, Floating Bottom Left and Pop Up.
* Click on the **ADD ITEM** button to add ads.
* Set the order by drag and drop of the items in the ads list.
* Specify the number of columns for ads( if applies to animation-type ).
* To provide maximum width for an ad, enable the **Max Width** option and provide a maximum width value.
* To display ads on specific devices, select the corresponding checkboxes. The changes will take effect on the preview page or live page and not while editing.
* Click on **Publish**/**Update** button.

{% embed url="<https://youtu.be/wbhhO_p5gx8>" %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.wpeka.com/wp-adcenter/placing-ads/animated-ads-pro.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.