A widget is a popular ad format that combines few ads in one block. Though Adserver.Online doesn't support widgets as a separate ad format (meaning you won't find a special invocation code for widgets on the panel), we have a special tool that allows you to create ad widgets manually.

As a result, you will be able to create widgets like this: https://adserver.online/demo/widgets/

Please note, each ad in a widget is being served independently. A widget is only a form of visual composition of several independent ads in a block.

How to create a widget

All the following information should be considered as a recommendation. Widgets don't have built-in checks on image size, etc. Feel free to experiment with different dimensions/formats/styles, but first, follow our recommendations to get a general understanding of how ad widgets work.

1. Create a zone

Format: Banner
Dimensions: 200×200

2. Create ads

Format: Native banner
Image proportion: 16:9
On the banner creation form, you should select options as follows:

You have to create at least one ad per widget slot. For example, if you are going to make a widget with 4 slots, you have to create at least 4 ads. That's because a widget doesn't show duplicated ads.

3. Compose invocation code

<ins id="asoWidget1"></ins>
<script data-cfasync="false">
    (function (w, a) {
        w[a] = w[a] || {};
        w[a].queue = w[a].queue || [];
        w[a].queue.push(function () {
            _ASO.loadScript("https://media.aso1.net/js/wgts/w2.js", function () {
                createWidget("asoWidget1", {
                    zone: XXXXX
                });
            });
        });
    })(window, "_aso");
</script>

Where XXXXX is zone ID you get in step 1) above.

Additinal parameters:

  • cols – number of columns. Default 4, max 6
  • rows – number of rows. Default 1, max 3
  • theme – changes the widget's colour (the text colour only). Values: dark or white. Default: white.
  • css – a string that defines a custom CSS style to be used on a widget's iframe and applied to all widget's content.

If you'd like to publish several widgets on the same page you would have to use a unique widget's ID for each widget.

<ins id="asoWidgetXXX"></ins>
<script data-cfasync="false">
  ...
  ...
          createWidget("asoWidgetXXX", {
              ...
          });
  ...
  ...
</script>

Please note, since the widget has several ads in it, each ad creates a separate ad request. Therefore, one widget creates as many ad requests as it contains ads.