Information

Banner HTML5

Banner - advertising material placed in the specified place on the site.

Banner, WxH, pix
  • An html banner is placed inside an iframe and takes the width and height values specified in the format.
File types
  • HTML banner with all necessary files must be in .zip archive.
  • The following types of files are allowed: css, js, gif, png, jpg, jpeg, svg, html, json.
File weight
  • The weight of the .zip archive with all files must not exceed 500kb.
  • All uploaded files must be inside the archive.
File Requirements
  • Only digits and Latin characters can be used in file and directory names.
  • It is forbidden to use the space character in the names of files and directories.
  • Allowed to upload files css, js, gif, png, jpg, jpeg, svg, html, json, xml.
  • All uploaded files must match their MIME type.
  • It is forbidden to use the appearance of such texts and classes in files
    .asciiz
    .byte
    .even
    .globl
    .text
    .file
    .type
In the head of the index.html file, you must specify
<meta name="ad.type" content="banner">
<meta name="ad.size" content="width=300,height=250">
<meta name="ad.vars" content="auto_button=1">

  • ad.size - banner size in px
  • auto_button - (optional) whether to set the transition button above the banner. A value of 0 will indicate that it is necessary to use the jump button inside the catfish.
Download an example html5 banner archive

File name
The filename must match the pattern:
banner_300x250@myname.zip

Buttons
  • The transition button when clicking on the banner is added automatically
Recommendations for adaptive materials
  • Add viewport to head
    <meta name="viewport" content="width=device-width, initial-scale=1">
    The width property determines the size of the viewport. It can be set to a specific number of pixels, say width=600, or to the special device-width value, which is the width of the screen in CSS pixels at 100%. (There are also corresponding height and device-height values that can be useful for pages with elements that resize or reposition based on the height of the viewport). The initial-scale property controls the zoom level when the page is first loaded. The maximum-scale , minimum-scale , and user-scalable properties determine how users are allowed to zoom in or out on the page.
  • When using the createjs library, to display correctly on iOS devices, remove all width and height values inside body
    <div id="animation_container">
    <canvas id="canvas" style="position: absolute; display: block;">
    <div id="dom_overlay_container" style="pointer-events:none; overflow:hidden;position: absolute; left: 0px; top: 0px; display: block;">
    </div>
    </div>
Installation
  • Fill in the advertiser field
  • Select banner type
  • Choose the required format
  • Specify the name of the media
  • Specify click-through URL, if needed
  • Specify the path to the zeropixel for impression tracking. It will be called automatically when loading the banner code on the site.
  • Select template Template-banner
  • Select zip archive with banner
  • Specify in the auto_button field whether to automatically create a button for clicking or use the button inside the banner.
    To collect click statistics, the clickTag, clickTAG, ar_redirect, admixAPI.click variables will be passed inside the banner.
    You have the opportunity to set a transition link inside the banner and receive click statistics. To do this, leave the URL field empty, and set the referral link to one of the options:
    clickTag+'&url='+escape('Your referral link');
    clickTag+'&url='+encodeURI('Your referral link');
    /* if you need to add a part to a variable from the URL field */
    clickTag+'&a='+encodeURIComponent('The extra part of the jump link');