Embed EX.CO experiences

TABLE OF CONTENTS

Configuration
Embed from EX.CO
Experience embed events
List of events
Limitations
Usage in WebView

An experience is a native interactive unit displayed in a contextual match to the content of the article, and to the target audience of the campaign.

Currently available types of experiences:

Poll
Journey
Decision Tree
Canvas
Form
Article

Configuration

You need to have a plan with appropriate permissions to be able to create an experience.

Open Visibility tab in menu and enable This is a sponsored item checkbox
Enable Sponsored toggle, which is to the right of item's section
Click Setup button, fill all required fields and save

Embed from EX.CO

Save your item to enable experience embed. Click on the embed button located below the sponsored setup button.

Experience embed events

Events bridge is the way to subscribe events coming from the EX.CO embedded experience. Events are being dispatched to the parent embedding page, which can subscribe to them.

Assuming you have EX.CO experience embedded in your page, you should use the code below in the <body> tag:

 document.body.addEventListener('pbItemEvent', function (e) {
    
    var eventName = e.detail.name;
    var eventData = e.detail.data;
    
    console.log(eventName); // i.e. 'pb.item.scroll-top-into-view'
    console.log(eventData); // i.e. { id: '7cb13e50-8295-4573-ad49-6b5ba7aab278' }
 });

List of events

Name	Data	Description
pb.item.load	`{id}`	fired when the item has finished loading
pb.item.scroll-top-into-view	`{id, title, description}`	fired when the item enters the user’s viewport
pb.section.flip	`{ sectionId, sectionIndex, sectionType, side}`	fired when the user flips a flip card
pb.section.poll-vote	`{sectionId, sectionIndex, questionId, questionText, answerId, text}`	fired when the user votes on a poll
pb.section.quiz-start	`{}`	fired when quiz started
pb.section.quiz-question-answered	`{answerId, answerText, questionId, questionIndex, sectionId, sectionIndex}`	fired when the user answers a quiz question
pb.section.quiz-result	`{resultId, resultText, sectionId, sectionIndex}`	fired after the user has completed a quiz and received their result
pb.cta.loaded	`{}`	fired when CTA rendered

Limitations

Size limit depends on experience type and advertisement slot where it would be rendered. Item is scratched into the size of the parent container. For example, if the size of the slot is equal to 300x250px, experience dimensions will be changed relatively.

Usage in WebView

To display videos correctly (without forcing into full screen mode) in native apps with a WebView (or hybrid apps with HTML, CSS, JS) setting of alowsInlineMediaPlayback is required.

UIWebView.allowsInlineMediaPlayback = true