# Ordered Ads (Pro)

The ordered ads feature helps you select multiple ads and set an order for them to show up on the front end.

### Displaying Ordered Ads

#### Display Ordered Ads using Gutenberg Block

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

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

![](https://456431625-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhZhxDAXbXHWmZ3dUIK-754427264%2Fuploads%2F2ZgoRvXJt4SsUrNOnNlz%2Forderedads2.png?alt=media\&token=99119b6f-4059-43e6-a2cc-c3e4bceed27e)

* 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.
* Provide alignment for the ads.
* Set the number of columns for displaying ads.
* 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 Ordered Ads using Shortcode

* Shortcode for reference:\[wpadcenter\_ordered\_ads ad\_ids=139 align='center' num\_columns=1 max\_width='on' max\_width\_value=300 devices=mobile,tablet,desktop]

![](https://456431625-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LhZhxDAXbXHWmZ3dUIK%2F-M_tyZnTZAYiUvHGPVng%2F-M_u0Jq3BBGdvF0l3F7D%2Fnew%20ordered%20shortcode.png?alt=media\&token=ee60e2de-2e75-4d4f-81ee-6fd4f6802341)

* Provide comma-separated ad IDs in the order that they should be displayed on the front end.
* Alignment can be specified as "left", "right" and "center".
* Set number of columns for displaying ads on the front end.
* 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 Ordered Ads using Widget

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

![](https://456431625-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LhZhxDAXbXHWmZ3dUIK%2F-M_tyZnTZAYiUvHGPVng%2F-M_u12WKJEfYygv_UclR%2Fnew%20ordered%20widget.png?alt=media\&token=178b3a26-b5c2-4fcf-87c5-18bf4f300d6f)

* 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.
* Provide alignment for the ads.
* Set the number of columns for displaying ads.
* 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 Ordered Ads using Elementor

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

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

![](https://456431625-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LhZhxDAXbXHWmZ3dUIK-754427264%2Fuploads%2FTIZZdnwwVDrt8G7IZl3X%2Forderedads1.png?alt=media\&token=b6667fd8-6925-4456-b40a-999fbc555ed5)

* Click on the **ADD ITEM** button to add ads.
* Set the order by drag and drop of the items in the ads list.
* Set Alignment for the ads.
* Specify the number of columns for ads.
* 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.