Windows Phone: including ads in your app, and using In-App Purchasing to turn them off

Free apps are wildly more popular than paid apps, but some people (myself included) get annoyed at ads in apps. To get the best of both worlds, you can include ads in your free app but let people in-app purchase a way to turn them off. I’ve done this in two apps now (HospitalPrices, and SatRadioGuide), and here’s how to do it!

Note that this is for Windows Phone 8.0 – here’s a similar guide for Win/WP 8.1 Universal apps.

Part 1: Adding advertising

I’m going to use the Nokia Ad Exchange, although there are other choices such as Microsoft pubCenter, Ad Exchange, etc. You can also use the Ad Rotator to switch these on the fly and rotate between them.

This will be a fairly brief guide – see this guide on the Nokia Developer Wiki for a more thorough one. Honestly, if I had found that one first I would have just linked to that and skipped to Part 2, but it seems a shame to waste all these words!

1. Sign up for an account at nax.nokia.com. Under the SDKs tab, download the SDK for the versions of Windows Phone you’d like to target. Unzip the SDK – you’ll find some documentation as well as Inneractive.Ad.dll. Under the Add App tab, create a new AppID (it’s OK to leave the description and download link blank for now).

2. In your Windows Phone project, right-click on References, and click Add Reference. Go to the Browse section, and browse to the Inneractive.Ad.dll you unzipped from the SDK. Make sure the following permissions are set in your WMAppManifest.xml:
ID_CAP_NETWORKING
ID_CAP_WEBBROWSERCOMPONENT
ID_CAP_PHONEDIALER
ID_CAP_IDENTITY_DEVICE

If you want location-based ads, see the documentation.

3. Wherever you’d like to put an ad in the app, use the following XAML:


<ad:InneractiveAd
xmlns:ad="clr-namespace:Inneractive.Nokia.Ad;assembly=Inneractive.Ad"
AppID="<your ad ID>" AdType="IaAdType_Banner"
ReloadTime="60" Name="Ad" />

See the documentation if you’d like to customize this further.

Now the ads in your app should be working! Launch it and make sure that they appear and don’t obscure any content.

Part 2: Using In-App Purchasing to Disable Ads

Note that in-app purchasing is only possible in Windows Phone 8 apps. For Windows Phone 7 apps, you can use a similar technique and only show ads in the trial version of an app.

1. Log in to the Windows Phone Dev Center, click “Dashboard” (at the top), then “Submit App” on the left. Under the “App info” section, give your app a name and category, then Save. (you can change these when you’re ready to submit for real) Go back to the dashboard, select your new app, and go to the “Products” section. Click “Add in-app product”. For the product info, specify whatever you want for the product alias (I usually use “<your app name>-NoAds”) and “NoAds” for the product identifier. Set the type to “Durable”, select the price, and click Save. Then specify a title and description – for the icon, feel free to use this:

(click for full-sized image)

Finally, submit the product. Since your app isn’t published yet, it won’t be visible to anyone else

2. Either create a Utils class or add this code to an existing one:


public static bool ShowAds { get; set; }
public static void UpdateInAppPurchases()
{
ShowAds = true;
var allLicenses = Windows.ApplicationModel.Store.
CurrentApp.LicenseInformation.ProductLicenses;
if (allLicenses.ContainsKey("NoAds"))
{
var license = allLicenses["NoAds"];
if (license.IsActive)
{
ShowAds = false;
}
}
}

In App.xaml.cs, add a call to Utils.UpdateInAppPurchases() to the Application_Launching() and Application_Activated() methods.

3. Find all of the ads you added in XAML, and add Visibility=”Collapsed” to them. Then, to each page that has an ad, add this method:


public void UpdateAd()
{
Ad.Visibility = Utils.ShowAds ? Visibility.Visible : Visibility.Collapsed;
}

and add a call to UpdateAd() to the OnNavigatedTo() method.

4. All that’s left now is to add the option to remove ads from inside the app. If you’d like to add a menu item in the app bar, you can add the following XAML:


<shell:ApplicationBar.MenuItems>
<shell:ApplicationBarMenuItem Text="remove ads" Click="RemoveAds_Click"/>
</shell:ApplicationBar.MenuItems>

Or, you can add a button in your about page, or both.

Then, add the event handler:


private async void RemoveAds_Click(object sender, EventArgs e)
{
try
{
await Windows.ApplicationModel.Store.CurrentApp
.RequestProductPurchaseAsync("NoAds", false);
UpdateAd();
}
catch (Exception)
{
// oh well
}
}

Finally, to remove the menu item from the page if the user has already removed the ads, add this code to your UpdateAd() method:


// if we add more of these, we'll need to be more clever here
if (!Utils.ShowAds && ApplicationBar.MenuItems.Count > 0)
{
ApplicationBar.MenuItems.RemoveAt(0);
}

To test the in-app purchasing code, you’ll need to publish your app as a beta. (all in-app purchases are free in a beta) But, other than that, you’re done!

References: Windows Phone blog post on In-App Purchasing

In-App Purchase: Success stories and Tips to test common in-app failure scenarios

See all my Windows Phone development posts.

I’m planning on writing more posts about Windows Phone development – what would you like to hear about? Reply here, on twitter at @gregstoll, or by email at greg@gregstoll.com.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s