Implementing Ads on any page in your Windows 8 XAML app–part 1

Let’s look at how you can implements ads on any page in your win 8 app. Before you get to your application, you need to create Ad Units in the MS Pubcenter site. Once you have set up your account with payout and tax details, go to the Setup tab and you’ll see something like below.

There are a few options for the sizes of the ad units as shown on the Pubcenter site.

Remember that these screenshots are just to give you some reference. The actual positioning of the ads in your apps is decided by you.

Plan ahead and decide what size you want to ‘donate’ for ads in your app. Use the test values in this article before you create the ad units for your app. There is a lag of few minutes before you can start using them in your apps after creating the ad units.

When it comes to a blank/basic page template, which are usually used for game applications, you are at freedom to place the ads anywhere in your app. For example, ads appear at bottom left in the Knight’s Tour app. Make sure you get the Windows 8 Ads SDK and add a reference to your project.

   1:  <UI:AdControl x:Name="AdHolder"

   2:                ApplicationId="d25517cb-12d4-4699-8bdc-52040c712cab"

   3:                AdUnitId="10043107"

   4:                Width="250"

   5:                Height="250"

   6:                HorizontalAlignment="Left"

   7:                VerticalAlignment="Bottom"

   8:                Margin="0, 0, 0, 30"

   9:                Grid.Row="1"/>

I’ll jump to the ItemDetailsPage template where you show complete details of a particular item. In this page you can create an InlineUIContainer and place the ad unit in there. This way your ad looks to be a part of the content itself.

   1:  <Paragraph LineStackingStrategy="MaxHeight">

   2:      <InlineUIContainer>

   3:          <Grid Width="560" Height="125" MaxHeight="125">

   4:              <UI:AdControl 

   5:                 ApplicationId="d25517cb-12d4-4699-8bdc-52040c712cab"

   6:                 AdUnitId="10043124"

   7:                 Width="250" Height="125"

   8:                 HorizontalAlignment="Center"/>

   9:          </Grid>

  10:      </InlineUIContainer>

  11:  </Paragraph>

In the Howzzat Book app, you can see this working.

In the next article, we’ll see how to include ads in pages like Split page, Items page, Grouped items page and Group details page.