Cedato Ad Units Portfolio – In Content – Implementation Guide

Cedato’s Out-Stream Ad Units Portfolio provides an easy way to use and customize Cedato smart video player. The portfolio offers a framework for rapidly deploying a customized native video advertising experiences and innovative ways to engage with viewers, maximizing inventory supply, engagement and results.

In-content video ads are placed within standard web page content and articles or within a list of content items (“In Feed”). An auto-play video ad is smoothly displayed as the user scrolls through the page on desktop or mobile, responsively adapting its size to the actual viewing screen and proportions. Engagement can be further enhanced by initiating sound or additional actions upon mouse-hover.

In-content ads (also referred as “In-Text”, “In-Read”, “In-Feed”, etc) are highly effective for increasing inventory by dynamically creating video ad placements over existing non-video content, yielding highly viewable and valuable video supply.

The In-Content Unit is not visible until 50% (by default but can be adjusted) of its expected height is in the viewable screen and can be configured to get hidden once it finishes playing.

Implementing an In-Content ad unit:

  1. Setup an HTML Player Supply item on the Cedato Dashboard. Customize the parameters of the player:
    1. Assigned demand items
    2. Content
    3. Settings:
      1. Allow Sound – Play sound on the unit by default
      2. Rotation – if you wish the unit to play few pieces in a row
      3. Auto Play – Recommended to be checked (on)
      4. Control bar- if you wish to enable the default control bar on the unit
    4. Tag - Optionally set default side (later on can be overridden by code)
    5. Restrictions and Callbacks – as appropriate – optional

For further details on a Cedato HTML Player Dashboard configuration, please refer to our Helpdesk.

In-Content Unit starts in accordance with the parameters defined in the dashboard but can be overridden via Player API upon calling the Unit.

  • Copy the Supply ID of the HTML Player. E.g. 1053904959
  • Copy and paste the following code to the appropriate place on the page:

     

     

 

That’s it. You are good to go!

 

Q&A

Q: How can I change the ad-unit size?

A: Replace the line

             position: 'ads',

with the following code and define the player size measurements as required:

             position: {

              container: 'ads',

              width: 300, // Defines the width of the player

              height: 250, // Defines the height of the player

              ratio: 0.6, // Defines the ratio between the player’s width and height

              },

Note that you can remove any of the lines above as appropriate. 

“container” - contains id, selector or element that links the player with some definite location on the web page. This parameter is mandatory and should contain either of:

  • ‘ads’ - element id, that represents a location on a web page,
  • ‘p #ads’ - CSS selector, that represents a location on a web page,
  • document.getElementById(‘ads’) - element, that represents a location on a web page.

If no size parameters are defined, they are calculated automatically - based on the container element width and the default ratio. In order to define the player size explicitly, the following options should be used:

  • set ‘width’ and ‘height’ - the player has the defined values,

 position: {

              width: 300, // Defines the width of the player

              height: 250, // Defines the height of the player

              },

  • set ‘width’ and ‘ratio’ - the player has the defined width, the height is calculated according to the defined ratio,

position: {

              width: 300, // Defines the width of the player

              ratio: 0.6, // Defines the ratio between the player’s width and height

              },

  • set ‘width’ only - player has the defined width, the height is calculated according to the default ratio.

 position: {

              container: 'ads',

              width: 300, // Defines the width of the player

              },

Q: Why doesn't the unit open?

A: The unit resizes and starts playing upon a scroll user event. Hence the page should enable a scrolling operation by the user. Also, pay attention that the unit will require enough space on the screen to grow into. E.g. if placing the unit as the last item on the page, leave enough space for the unit below to grow into.

Q: Why doesn't the unit close after Ad ends?

A: Make sure to disable the Rotation option under Supply > Settings > Rotation, to be able to apply the function 'closeOnAdEnd: true'.

Q: Why doesn't the unit close after Content ends?

A: Make sure to disable the box 'Loop content' under Supply > Content, to be able to apply the function 'closeOnContentEnd: true'.

Q: How can I customize the close button?

A: Customizing the close button is easily done by changing the #ads .__cedato_close_button class, setting it to the shape, size and location that meets your design. For example, this is an example of an alternate close button code to be added. Please make sure to add the button url or Base64 below.




 

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us how can we improve this article!

Select atleast one of the reasons

Feedback sent

We apprciate your effort and will try to fix the article