GoogleAds1

How to Add Google Ads to a Mobile Web Site

Engineering

8/10/2011 7:26 AM

Mobile Google Development

In the last few months I've had several questions from 51Degrees.mobi Framework users asking how to implement google adverts on their web sites. Google have a very simple piece of javascript that can be used with high end phones. However this won't work on all phones, and as those familiar with 51Degrees.mobi will know we don't like to exclude people because they don't have the high end phones. The ASP provided for all phones won't work in ASP.NET and requires some tweaking to get working. This blog explains how to use Google AdSense and an ASP.NET user control to get Google Ads on a web page in minutes.

Before adding any code to the web site we need to get the advert configuration settings from Google. If you haven't done so already you'll need to create a Google account and then choose Adsense. Use this link to get going.

From with in the Adsense menu choose AdSense Setup and a screen similar to the following will appear.

Google AdSense Setup

Choose AdSense for Mobile Content. On the following screen ensure the "All Phones" Device Type option is selected, shown highlighted in red in the screen below.

GoogleAds1

Configure the adverts the way you'd like them in the following screen. And then move to the final phase to get the code. A screen similar to the following should be displayed once ASP is selected.

GoogleAds1

The ASP code provided won't work on a regular ASP.NET page. However the parameters shown will determine how the advert will appear and you'll need to reference these.

Create a user control containing the following code in your project and/or web site.

<%@ Control Language="VB" AutoEventWireup="true" Inherits="System.Web.UI.UserControl" %> <%@ Import Namespace="System" %> <%@ Import Namespace="System.Math" %> <%@ Import Namespace="System.Net" %> <script runat="server"> Function googleColor(value, random) Dim colorArray colorArray = value.Split(",") googleColor = colorArray(random Mod (UBound(colorArray) + 1)) End Function Function googleScreenRes() Dim screenRes, delimiter, resArray If Request.Browser.ScreenPixelsHeight > 0 And Request.Browser.ScreenPixelsWidth > 0 Then googleScreenRes = "&u_w=" & Request.Browser.ScreenPixelsWidth.ToString() & _ "&u_h=" & Request.Browser.ScreenPixelsHeight.ToString() Exit Function End If screenRes = Request.ServerVariables("HTTP_UA_PIXELS") delimiter = "x" If String.IsNullOrEmpty(screenRes) Then screenRes = Request.ServerVariables("HTTP_X_UP_DEVCAP_SCREENPIXELS") delimiter = "," End If If String.IsNullOrEmpty(screenRes) Then screenRes = Request.ServerVariables("HTTP_X_JPHONE_DISPLAY") delimiter = "*" End If resArray = Split(screenRes, delimiter, 2) If (UBound(resArray) + 1) = 2 Then googleScreenRes = "&u_w=" & resArray(0) & "&u_h=" & resArray(1) End If End Function Function googleMuid() Dim muid muid = Request.ServerVariables("HTTP_X_DCMGUID") If Not String.IsNullOrEmpty(muid) Then googleMuid = "&muid=" & muid End If muid = Request.ServerVariables("HTTP_X_UP_SUBNO") If Not String.IsNullOrEmpty(muid) Then googleMuid = "&muid=" & muid End If muid = Request.ServerVariables("HTTP_X_JPHONE_UID") If Not String.IsNullOrEmpty(muid) Then googleMuid = "&muid=" & muid End If muid = Request.ServerVariables("HTTP_X_EM_UID") If Not String.IsNullOrEmpty(muid) Then googleMuid = "&muid=" & muid End If End Function Function googleViaAndAccept(googleUserAgent) If Len(googleUserAgent) = 0 Then Dim via via = Server.URLEncode(Request.ServerVariables("HTTP_VIA")) If Not String.IsNullOrEmpty(via) Then googleViaAndAccept = "&via=" & via End If Dim accept accept = Server.URLEncode(Request.ServerVariables("HTTP_ACCEPT")) If Not String.IsNullOrEmpty(accept) Then googleViaAndAccept = googleViaAndAccept & "&accept=" & accept End If End If End Function Function GoogleAd_Load (sender, args) Dim googleTime, googleDt, googleScheme, googleUserAgent googleTime = DateDiff("s", "01/01/1970 00:00:00", Now()) googleDt = (1000 * googleTime) + Round(1000 * (Now().Ticks - Int(Now.Ticks()))) googleScheme = "http://" googleUserAgent = Server.URLEncode(Request.ServerVariables("HTTP_USER_AGENT")) If StrComp(Request.ServerVariables("HTTPS"), "on") = 0 Then googleScheme = "https://" Dim googleAdUrl googleAdUrl = "http://pagead2.googlesyndication.com/pagead/ads?" & _ "ad_type=text_image" & _ "&channel=[YOUR_CHANNEL]" & _ "&client=[YOUR_CLIENT]" & _ "&color_border=" & googleColor("FFFFFF", googleTime) & _ "&color_bg=" & googleColor("DAE9FD", googleTime) & _ "&color_link=" & googleColor("2E69FF", googleTime) & _ "&color_text=" & googleColor("333333", googleTime) & _ "&color_url=" & googleColor("111180", googleTime) & _ "&dt=" & googleDt & _ "&format=mobile_single" & _ "&ip=" & Server.URLEncode(Request.ServerVariables("REMOTE_ADDR")) & _ "&markup=xhtml" & _ "&oe=utf8" & _ "&output=xhtml" & _ "&ref=" & Server.URLEncode(Request.ServerVariables("HTTP_REFERER")) & _ "&url=" & Server.URLEncode(googleScheme & Request.ServerVariables("HTTP_HOST") & Request.ServerVariables("URL")) & _ "&useragent=" & googleUserAgent & _ googleScreenRes() & _ googleMuid() & _ googleViaAndAccept(googleUserAgent) Dim googleAdOutput As New WebClient() CType(sender, Literal).Text = googleAdOutput.DownloadString(googleAdUrl) End Function <script> <asp:Literal runat="server" ID="GoogleAd" OnLoad="GoogleAd_Load" />

Replace the parameters in the code above with the ones shown in the AdCode Google screen.

The user control can now be added to any web page and adverts will appear wherever the control is placed. Be aware it can take Google 48 hours to activate adverts so don't worry if nothing appears to start with. The resulting HTML will probably contain a placeholder comment during this initial period.

In this blog I've explained how to add Google mobile adverts to any ASP.NET web page which will work on any mobile device. It's a little fiddly because it's server side code and not simple javascript, but ultimately supporting all mobile devices will generate more advertising revenue which can't be bad.