Create web pages for mobile devices

We can create interactive web pages that are optimized for mobile devices.

Ensure that you complete the following tasks before you create a web page for a mobile device in Rich Page Editor:

1. Create a project.

2. Set the target device for the project.

3. Set Rich Page Editor as the default web page editor.

1. Click File > New > Web Page to open the New Web Page wizard.

2. Specify a file name and choose one of the following mobile templates for the new web page:

   Dojo Mobile HTML template

   Sets up the web page for Dojo. Generates content into the web page to prepare the web page for use with Dojo libraries. This content can include:

   • JavaScript and CSS includes.

   • Basic widgets that are typically required for Dojo Mobile web pages, such as a mobile View widget.

   jQuery Mobile HTML template

   Sets up the web page for jQuery. Generates content into the web page to prepare the web page for use with its libraries. This content can include:

   • JavaScript and CSS includes.

   • Basic widgets that are typically required for jQuery Mobile web pages, such as a Page widget.

3. Optional: To open the New Web Page Options page and add more options to the mobile web page, click Options.

   Option	Description
   Set the document type declaration to HTML 5 and cache the page	From the list of options, click Document Markup. From the Document Type list, select HTML 5 to show more options. Specify the icon used by mobile devices when users add bookmarks. To select an icon from the workspace, click Browse next to the File href field. Enable browser application caching. In the Manifest Section field, select CACHE and then specify a manifest file. For example, WebContent/META-INF/cache.mf. HTML 5 application caching ensures performance and availability when the mobile device is offline. For more information about cache manifest files, see the latest HTML5 specification at: http://dev.w3.org/html5/spec, and search for "cache manifest".
   Set the device detection and stylesheet options	From the list of options, click Mobile Web Page. Select one of the following options: Detect device The web page detects the device that shows the content and loads the appropriate CSS by including the script dojox/mobile/deviceTheme.js. Select dojox.mobile stylesheet The selected style sheet is loaded using the <link> tag. We can select one of the following style sheets: blackberry.css android.css ipad.css iphone.css No CSS Use a style sheet other than the ones available when you select the dojox.mobile style sheet option. When we specify the No CSS option, we can select Stylesheets from the list of options and add the style sheets to use.

4. Click Finish. Your web page opens in Rich Page Editor.

Parent topic: Rich Page Editor