JS-Widget use for Mobile Apps is deprecated – Mobile Apps should use Outbrain Native SDKs.

If your Mobile App is using a different Outbrain technology, please consult with your account manager regarding the best upgrade path.

Please Note

Please read the following guide to choose the best tech option for your app: In-App JS-Widget guide

Integration Flow

Note: The best way to understand the new logic is by looking at our sample project: AndroidJSWidget

Screenshot_2016-08-18-13-49-06

1) On the HTML page you should make sure the Outbrain Widget includes the following apps specific parameters:

data-ob-installation-type, data-ob-user-id, data-ob-app-ver, data-ob-installation-key

Example:

<div class="OUTBRAIN" data-src="http://DROP_PERMALINK_HERE"
data-widget-id="DROP_WIDGET_ID_HERE" 
data-ob-template="DROP_TEMPLATE_NAME_HERE" 
data-ob-installation-type="app_js_widget"
data-ob-user-id="GOOGLE_APPLE_ADVERTISING_ID"
data-ob-app-ver="DROP_APPLICATION_VERSION_HERE"
data-ob-installation-key="DROP_PARTNER_KEY_HERE"></div>

For the full explanation click here.



2) Integrate Outbrain SDK 2.0 into your app, as described here



3) Initialize Outbrain SDK on app launch via:
OBBridge.registerWithPartnerKey(this, YOUR_PARTNER_KEY);



Handle a Click on a Recommendation

Note: The best way to understand the new logic is by looking at our sample project: AndroidJSWidget, specifically look at file MainActivity.java – you will find a good example for the implementation in onCreate() method:

1) On a recommendation click, first grab the URL the user clicked on via WebViewClient callback method public boolean shouldOverrideUrlLoading(WebView view, String url)



2) Next, check if it’s a paid recommendation by calling:
if (OBBridge.isOutbrainPaidUrl(url))



3) For paid recommendations, you should check if the paid recommendation should be opened with OBWebview or with CustomTabs via
if (OBBridge.shouldOpenInCustomTabs(url))


Complete Code Sample:


public boolean shouldOverrideUrlLoading(WebView view, String url) {
    if (OBBridge.isOutbrainPaidUrl(url)) {
        // We just detect a click on Outbrain paid recommendation, 
        // let's see where we should open the ad
        if (OBBridge.shouldOpenInCustomTabs(url)) {
            openRecommendationInCustomTabs(url);
        }
        else {
            // Open the recommendation in app webview
            openRecommendationInApp(url);
        }

        return true;
    }
    return false;
}

Open Recommendation in CustomTabs

Please follow the instructions here


Using OBWebView

Please follow the instructions here


Handling Organic Recommendation

Navigate to the organic recommendation with a method of your choice