November 2009
In this tutorial we demonstrate how to create an iPhone application for DotNetNuke using OWS. We show you how to detect the iPhone and send the user to a custom page which displays data from various modules across the DotNetNuke portal.
We configure this by detecting the iPhone browser and then redirecting the iPhone user to a custom iPhone page which uses a special skin. This is all done using OWS.
On the custom iPhone page all of the content is created using OWS, we display a menu for the iPhone, as well as content from the Links and Announcements modules that are on the Home page of our DotNetNuke portal.
We also demonstrate how to allow users to login to the DotNetNuke portal from the iPhone, as well as how to format your content to take advantage of iPhone features such as Google Maps, call a telephone number displayed on the website and send an email.
Before you view this tutorial we recommend that you visit
www.openwebstudio.com and download the latest version of OWS as there have been a few recent enhancements.
If you are new to OWS we recommend you first of all view the six part series on
How to Build a Knowledge Base Article module.
The videos contain:
Video 1 - Introduction, How to Detect the iPhone and Redirect it to an iPhone Compatible Page
- Introduction
- How to add an OWS module to all pages on the site to detect and redirect the iPhone browser
- How to create the custom iPhone page
- How to create the redirect module
- Adding the code for the redirect in the Region - OnLoad section
- How to use the UserAgent to detect the iPhone browser
- How to use Javascript to redirect
- How to display the redirect module on all pages
- How to remove the redirect module from the iPhone page to prevent a redirect loop
- How to install the iphone skin using the iphone.zip file
- PageHeaderTag metatag to set the viewport for vertical and horizontal view on the iPhone
Time Length: 9min 53secs
Video 2 - How to Add Links to Use iPhone Apps, Create Main Menu, Configure Fetching Data Message
- Viewing the Links and Announcements module
- How to add hyperlinks into the Announcements module for the iPhone apps
- How to add a Google maps links
- How to add a telephone number link
- How to add an email link
- How to add and configure an Account Login module on the iPhone page
- How to add the iPhone content module to the page
- How to create a main menu in the iPhone content module
- How to place the "Fetching Data" message at the top of the page
- Ajax Interaction - Custom Status
Time Length: 9min 11secs
Video 3 - How to Display Content from the Links module to the iPhone
- How to build the module to understand the menu options
- How to query the Links module
- How to target the correct Links module ID
- How to display the data from the Links module
- Download Safari browser
Time Length: 7min 51secs
Video 4 - Testing and How to Display Content from the Announcements module
- iphonetester.com with the Safari browser
- How to set the iPhone Content module so only registered users can view the content
- How to query the Announcements module
- How to display the correct data from the Announcements module
- Testing the Announcements module on the iPhone Tester
Time Length: 8min 35secs
Total Time Length: 35min 30secs
Comments