How to extend Mobile device redirection web part possibilities

As you probably know, the Mobile device redirection web part is available since version 5.5. This web part redirects visitors using mobile devices to a specified URL so that you can make your web site „mobile devices friendly“ and allow users to browse your site via their smart phones, too. However, the number of supported user agents (devices) is limited, and even in 5.5R2 you can check only these devices: iPhone, Android, MIDP, CLDC and BlackBerry (please note that there was an issue with BlackBerry support so hotfix application is recommended).

Of course, you can customize code behind of the web part in order to support additional devices. However, this article describes how to do it in a user-friendly way so any content editor can manage supported devices from CMSDesk only, with no need to access code files directly.

Required customization can be done like this.

1. First, you should clone the existing web part so that all customization is done on an independent copy and you can always get back to the original web part. To clone the default Mobile device redirection web part, go to Site Manager -> Development -> Web parts -> General -> Mobile device redirection. Click „Clone web part“ and enter the following values:

• Display name: Mobile device redirection PLUS
• Code name: MobileDeviceRedirectionPlus
• Category: General
• File name: General/MobileDeviceRedirectionPlus.ascx
• Clone web part files: yes (checked)

Click Clone. The system creates a copy of the existing web part using the new name and it also copies the code (ASCX and CS file).

2. Now, you can add a new property called „User agents“ where the editor can add additional user agents. To do this, go to Site Manager -> Development -> Web parts -> General -> Mobile device redirection PLUS and switch to the „Properties“ tab. Here, click the „New attribute“ icon and add a new field with the following parameters:


• Attribute name: UserAgents
• Attribute type: Text
• Attribute size: 400
• Display attribute in the editing form: (checked)
• Field type: Text box
• Field description: Additional user agent names separated by semicolon

The result should looks like this:





3. Now, some customization needs to be done. Open the ~/CMSWebParts/General/MobileDeviceRedirectionPlus.ascx.cs file in your Visual Studio and add the following code within:

/// <summary>
/// Custom property for user agents
/// </summary>

public string UserAgents
{

get
{
return ValidationHelper.GetString(this.GetValue("UserAgents"), "");
}

set
{
this.SetValue("UserAgents", value);
}

}

/// <summary>
/// Return true if Request.UserAgent contains defined user agent
/// </summary>
/// <returns></returns>
public bool AgentIsFound(string sRequestUserAgent)
{
string[] mUserAgents = this.UserAgents.ToLower().Split(';');
// null request
if (mUserAgents.Length > 0)
{
sRequestUserAgent = sRequestUserAgent.ToLower();

foreach (string iAgent in mUserAgents)
{
if (sRequestUserAgent.Contains(iAgent))
{
return true;
}
}
}

return false;

}

Finally, in the SetupControl() method, default if-condition must be extended like this:

// Check if visitor use mobile device
if (BrowserHelper.IsMobileDevice() || this.AgentIsFound(Request.UserAgent))
{
// default code
}


Please note that this customization will not be valid as from upcoming version 6.0, where Mobile device redirection will handle this functionality by default (however, using a different implementation).


See also:

Applies to: Kentico CMS 5.5 and higher