Ad tag types

Adfox server response format

The Adfox server returns a response to a banner request in JSON format.

The JSON response contains multiple objects:

{
  "jsonapi":{...}, //the version and protocol used.
  "meta": {...}, //the page session and request number.
  "data": [...], //information about the banner (banner template, all banner parameters with values) or the default banner selected for impressions.
  "errors": [...] //if the data object is empty, the errors object's status parameter will contain the HTTP request status code.
}

Some variables in the response can be base64 encoded. To decode the received value manually, use the encoder page.

Asynchronous ad tag

Manage banner responses:

Ya.adfoxCode.create(bannerOptions);

Example of an asynchronous ad tag

<div id="adfox"></div>
<script>
  window.yaContextCb.push(()=>{
    Ya.adfoxCode.create({
      ownerId: 208087,
      containerId: 'adfox',
      params: {
        pt: 'b',
        p1: 'bsoji'
      }
    })
  })
</script>

Adaptive ad tag

Adaptive sites have a stable HTML layout with CSS styles to help display it on different screen resolutions. An adaptive layout makes the site easy to view on various devices: mobile phones, tablets, and desktops.

To load different sets of banners for different versions, we developed an adaptive ad tag.

In the adaptive ad tag, you need to list the site versions where it should make a banner request, which enables you to configure different sets of ad placements for different site versions without unnecessary code requests.

Adaptive ad tag features:

• It determines what is considered a layout for a desktop, a tablet, or a smartphone based on the size of the screen.
• A set of placements may differ for different layout versions.
• When scaling a site page, new sets of banners can be loaded.

Manage ad responses:

Ya.adfoxCode.createAdaptive(bannerOptions, bannerStates, [adaptiveOptions]);

Adaptive ad tag example

<div id="adfox"></div>
<script>
  window.yaContextCb.push(()=>{
    // banner only for desktop and tablet 
    Ya.adfoxCode.createAdaptive({
      ownerId: 168627,
      containerId: 'adfox',
      params: {
        pp: 'g',
        ps: 'bnfx',
        p2: 'evbi'
      }
    },
    ['desktop', 'tablet'], // states
    {
      tabletWidth: 1000,
      phoneWidth: 300,
      isAutoReloads: false
    })
  })
</script>

Example of a banner placement on adaptive sites

Managing banner requests

By default, advertising requests are made when ad tags are executed. You can control when the request is sent:

• For the request to occur when the banner falls into the user's view area, add the lazyLoad: true parameter to the bannerOptions.
• For the request to occur before the banner hits the user's view area, set these lazyLoad parameter values:

  • fetchMargin: The distance to the banner from which the request will start as a percentage of the screen height (for example, 200 is two screens).
  • mobileScaling: Multiplier of the fetchMargin variable value for mobile versions of devices. It can be a fraction.

Asynchronous ad tag example (mobileScaling is an integer)

<div id="adfox"></div>
<script>
  window.yaContextCb.push(()=>{
    Ya.adfoxCode.create({
      ownerId: 208087,
      containerId: 'adfox',
      params: {
        pt: 'b',
        p1: 'bsoji'
      },
      lazyLoad: {
        fetchMargin: 200,
        mobileScaling: 2
      }
    })
  })
</script>

Asynchronous ad tag example (mobileScaling is a fractional number)

<div id="adfox"></div>
<script>
  window.yaContextCb.push(()=>{
    Ya.adfoxCode.create({
      ownerId: 208087,
      containerId: 'adfox',
      params: {
        pt: 'b',
        p1: 'bsoji'
      },
      lazyLoad: {
        fetchMargin: 200,
        mobileScaling: 2.5
      }
    })
  })
</script>

Example of adaptive ad tag (mobileScaling is an integer)

<div id="adfox"></div>
<script>
  window.yaContextCb.push(()=>{
    // banner only for desktop and tablet 
    Ya.adfoxCode.createAdaptive({
      ownerId: 168627,
      containerId: 'adfox',
      params: {
        pp: 'g',
        ps: 'bnfx',
        p2: 'evbi'
      },
      lazyLoad: {
        fetchMargin: 200,
        mobileScaling: 2
      }
    },
    ['desktop', 'tablet'], // states
    {
      tabletWidth: 1000,
      phoneWidth: 300,
      isAutoReloads: false
    })
  })
</script>

Example of adaptive ad tag (mobileScaling is a fractional number)

<div id="adfox"></div>
<script>
  window.yaContextCb.push(()=>{
    // banner only for desktop and tablet 
    Ya.adfoxCode.createAdaptive({
      ownerId: 168627,
      containerId: 'adfox',
      params: {
        pp: 'g',
        ps: 'bnfx',
        p2: 'evbi'
      },
      lazyLoad: {
        fetchMargin: 200,
        mobileScaling: 2.5
      }
    },
    ['desktop', 'tablet'], // states
    {
      tabletWidth: 1000,
      phoneWidth: 300,
      isAutoReloads: false
    })
  })
</script>

Contact support