JS-Distribute: Native Ads across multiple DIV containers

Native Ads retrieved from a single client-side call can be allocated to several DIV containers on your website. Each container can display one or more ads. If a container's designated ad(s) are unavailable, the container will automatically be hidden using display: none.

Additionally, each container can be individually styled to match your website's design.

Please note: This script is exclusively for Native Ads, not for banners.

Demo

Important instructions

  1. The initial ad code must be placed above the fold to ensure compatibility with our visibility check.
  2. Ads should be arranged on your page in the order of their priority, with the first ad receiving the most prominent placement, followed by subsequent ads.
    The placement hierarchy follows these guidelines:
    • From top to bottom
    • From left to right
  3. Please note that the ID of the enclosing container, <div id="solads-adverts">, must remain unchanged.
  4. Distributed ads will appear immediately (instead of only when they become visible, which is the default behavior), and one actual impression will be recorded for each displayed ad.

Sample code

<!-- SOLADS-ADVERT -->
<div id="solads-adverts">
<script type="text/javascript"  data-params="jsads">
  m3ads_system = "Solads";
  m3ads_partnernumber = 1234;
  m3ads_sectors = "1234";
  m3ads_numberadverts = 4;
  m3ads_logoimagewidth = 240;
  m3ads_logoimageheight = 120;
  solads_Acontainer = [
  [0,'solads-advert-n1','className',1],
  [1,'solads-advert-n2','className',2],
  [2,'solads-advert-n3','className',1]
  ];
  solads_Acssurl = ['cdn.solads.media/css/as/728x90.min.css',
  'cdn.solads.media/css/as/160x600.min.css'
  ];
  solads_mode = "auto";
</script>
<script type="text/javascript" src="//cdn.feed.solads.media/resources/scripts/jsAds-1.4.min.js" async></script>
<script type="text/javascript" src="//cdn.solads.media/js/jsads-distribute-1.3.min.js" defer></script>
</div>
<!-- SOLADS-ADVERT-END -->
<html>
<body>
  <div id="solads-advert-n1"></div>
  <div id="solads-advert-n2"></div>
  <div id="solads-advert-n3"></div>
</body>
</html>

Sample Code: Manual Mode

<!-- SOLADS-ADVERT -->
<div id="solads-adverts">
<script type="text/javascript"  data-params="jsads">
  m3ads_system = "Solads";
  m3ads_partnernumber = 1234;
  m3ads_sectors = "1234";
  m3ads_numberadverts = 4;
  m3ads_logoimagewidth = 240;
  m3ads_logoimageheight = 120;
  solads_Acssurl = ['cdn.solads.media/css/as/728x90.min.css',
  'cdn.solads.media/css/as/160x600.min.css'
  ];
  solads_mode = "manual";
</script>
<script type="text/javascript" src="//cdn.feed.solads.media/resources/scripts/jsAds-1.4.min.js" async></script>
<script type="text/javascript" src="//cdn.solads.media/js/jsads-distribute-1.3.min.js" defer></script>
</div>
<!-- SOLADS-ADVERT-END -->
<html>
<body>
  <div id="solads-advert-n1"></div>
  <div id="solads-advert-n2"></div>
  <div id="solads-advert-n3"></div>

  <button onclick="sldsFillAdverts(0,'solads-advert-n1','className',1);">Anzeigen..</button><br />
  <button onclick="sldsFillAdverts(1,'solads-advert-n2','className',2);">Anzeigen..</button><br />
  <button onclick="sldsFillAdverts(3,'solads-advert-n3','className',1);">Anzeigen..</button>
</body>
</html>

Functions

FunctionDetailsCall
sldsFillAdverts Triggers container to be filled with advert sldsFillAdverts (First Advert-ID for this container (starting with Zero), DIV ID, DIV CLASS, Number pf Adverts)

Callback

CustomEventExample
soladsLoaded 
document.addEventListener('soladsLoaded', function (e) {
// do something
}, false);

Relevant Parameter

ParameterTypFormatDetails
m3ads_numberadverts Mandatory Integer Specify how many adverts are to be requested. This number should be the sum of the ads in the containers.
solads_Acontainer Mandatory Array [Number (continuous, starting with zero), DIV ID, DIV CLASS, Number of Adverts] Specify the details of the DIV containers that shall receive the adverts. Each container has a number (beginning with zero) in the array and a unique ID. Then define the CSS class(es) of each container and how many adverts should be assigned to it.
solads_Acssurl Optional Array (URL, URL, URL, etc.) Specify the stylesheets to be loaded for display.
solads_mode Optional String auto = Automatic advert distribution into containers that have been generated on pageload
manual = Event-triggered loading of adverts into dynamically created containers
solads_debug Optional Boolean Set value to true for the debugging mode and load the script 'jsads-distribute-1.3.debug.js'. You will then receive error messages in the console.

(#90)

ContactSign upTerms