Overwolf owadview

The <owadview/> tag, which is based on the Electron <webview/> tag, automatically hosts and manages ads in your app.

To use it, place the <owadview/> tag inside a <div> tag, with the size of the standard IAB Ad unit you wish to display.

For example:

<div  style="width: 400px; height: 300px; background: transparent;">
  <owadview cid="myContainerId"/>
</div>

For more information, see Working with Ads.

Ad Enablement

In order for your app to display ads, we first have to set up our backend to support your app's uid. You can test how ads will look and behave in your app, by passing in the --test-ad command-line argument.

Contact us for details.

To enable ads for users in areas with more strict data collection regulations, you will be required to fully follow the Consent Management Platform (CMP) Implementation Guidelines.

Transparent Background

We use background: transparent, in order to allow your app to show a background image as a fallback when there is no ads inventory to display.

Other things to keep in mind:

• The <owadview/> tag starts muted by default. This can be changed using <owadview>.setAudioMuted(muted).
• The <owadview/> tag is automatically managed and already handles any issues involving ad visibility or crashes.

Container ID

cid is an attribute used to identify a specific ad container on the page. Assigning a cid lets you break down reporting and analytics by that specific ad container in your Developers Console, in addition to your app's overall metrics.

• Limited to 20 characters.
• Any string longer than 20 characters is trimmed: only the first 20 characters are used.

Multiple ad units on a single window (Mandatory)

You need to assign a unique ID to each container if you are implementing two identical ad units within the same window. This is required to comply with ad policy, allowing only one video ad per window at a time.

Use the following format to name each container:

appname_widthXheight_window_position

Example: for an app named myApp with two 400x300 ad units on the desktop window, the container IDs should be myApp_400x300_desktop_top and myApp_400x300_desktop_bottom.

This ensures proper identification and tracking of each ad unit.

Example:

<owadview cid="myApp_400x300_desktop_top"/>
<owadview cid="myApp_400x300_desktop_bottom"/>

Adding custom tracking context

The <owadview/> tag accepts a customTracking attribute. Pass a JSON string to forward structured context, for example placement or analytics metadata, into the ad guest renderer.

<div style="width:400px; height:300px;">
  <owadview customTracking='{"placement":"main-menu","screen":"home"}'>
  </owadview>
</div>

Attribute	Type	Description
customTracking	string (JSON)	Structured context passed into the ad guest renderer. For example, placement or analytics metadata.

Valid key names

key:value pairs:

• Are not case-sensitive.
• Can't start with a number.
• Can't contain spaces.
• Can use an underscore (_).

Valid value names

Valid names:

• Are not case-sensitive.
• Can start with a number, contain only numbers, or be a combination of numbers and letters.
• Can contain spaces.

note

• Value names that contain spaces must be in double quotes (e.g., page1: "first page").
• Values are treated as strings, even when containing numbers.

Invalid characters

The following table shows invalid characters that cannot be used in a key or value.

Character	Description	Character	Description
"	Double quotes	;	Semicolon
'	Single quotes or apostrophe	^	Caret
=	Equal sign	()	Parentheses
!	Exclamation point	< >	Angle brackets
+	Plus sign	[ ]	Square brackets
#	Pound or hash symbol	,	Comma
*	Asterisk	&	Ampersand
~	Tilde	:	Colon

important

customTracking on <owadview/> is passed as a single JSON string, so the surrounding JSON syntax (the outer { }, the " around keys and string values, and the : separating a key from its value) is structural and not itself a key or value. The invalid-character list above applies to the actual key and value text inside that JSON, not to the JSON syntax wrapping it.

House ads event

You are able to trigger actions when users click on a displayed house ad. If you have enabled events on House ads in your Developers console, use the house-ad-action event to trigger an action.