Information

Branding

Branding - advertising placed behind the content of the site. U-shaped on desktop devices and rectangular on mobile devices.

Branding, WxH, px
  • Width: 100%; The banner's iframe stretches to 100% of the browser window width.
  • Branding should adapt to all possible widths. When placing branding on mobile devices, the height of the branding is 30% of its width.
  • For mobile devices, a separate html file can be used. It must be specified on upload or in meta ad.vars (see file requirements).
  • HTML branding with all necessary files should be in .zip archive.
File weight
  • The weight of the .zip archive with all files must not exceed 1000kb.
  • All uploaded files must be inside the archive or using the https protocol.
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="branding">
<meta name="ad.vars" content="mobile=mobile.html,auto_button=1">

  • mobile - (optional) file name for mobile devices
  • auto_button - (optional) whether to set the jump button over the catfish. A value of 0 will indicate that it is necessary to use the jump button inside the catfish.
Using images to create html branding
Download an example archive. Replace the image files, set the filenames to index.html and specify the background fill.

File name The file name must match the pattern:
branding@myname.zip

Recommendations for adaptive materials
  • Add viewport in 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 type of branding
  • 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-branding template
  • 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 branding. 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');