This site is built using Umbraco 4, a
.Net-based content management system. I recently upgraded to
version 4 from version 3 and have been working to reconfigure my
site to take advantage of the new features.
One excellent new package available for v4 is the iPhoneAltPage
package. Once implemented, it allows users with iPhone devices
to view an Umbraco site with iPhone-style navigation.
To install this package:
- Log in to your Umbraco site and click on the
Developer section.
- Expand Packages in the navigation tree and
select the Umbraco package repository on the
left.
- Select WebSite Utilities;
iPhoneAltPage should be the first entry.
- Select Download and Install Package.
- Once installation is complete, just add the Javascript block to
the head section of your master template.
I modified the Javascript to include Android devices as
well:
<script
language="javascript">
if ( (navigator.userAgent.match(/iPhone/i))||
(navigator.userAgent.match(/iPod/i))||
(navigator.userAgent.match(/Android/i)))
{
document.location.href='<umbraco:Item field="pageID"
runat="server"
xslt="umbraco.library:Replace(umbraco.library:NiceUrl(umbraco.library:GetXmlNodeById({0})/ancestor-or-self::node
[@level=1]/@id),'.aspx','/iphone.aspx')"></umbraco:Item>';
}
</script>
You can see the results by visiting this site on your Android
device or iPhone.
