IBM Worklight v5.0.5 > Develop IBM Worklight applications > Rich Page Editor


Use Rich Page Editor to create web pages for mobile devices


  1. Create a web project.

  2. Set the target device for web project.

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

  4. Open the New Web Page wizard.

      File | New | Web Page

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

    Dojo Mobile HTML template Generate Dojo content into the web page...

    • JavaScript and CSS includes
    • Basic widgets such as a mobile View widget
    jQuery Mobile HTML template Generate jQuery content into the web page...

    • JavaScript and CSS includes
    • Basic widgets such as a Page widget

  6. To open the New Web Page Options page and add more options to your mobile web page, click Options.

    Option Description
    Set the document type declaration to HTML 5 and cache the page

    1. From the list of options, click Document Markup.

    2. From the Document Type list, select HTML 5 to show more options.

    3. Specify the icon used by mobile devices when users add bookmarks.

      To select an icon from your workspace, click Browse next to the File href field.

    4. 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.

    Set the device detection and stylesheet options

    1. From the list of options, click Mobile Web Page.

    2. Select one of the following options:

      Detect device The web page detects the device that shows the content and loads the appropriate CSS using...

        dojo.require("dojox.mobile.deviceTheme")
      Select dojox.mobile stylesheet The selected style sheet is loaded using the <link> tag. You 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 that are available when you select the dojox.mobile style sheet option. When you specify the No CSS option, you can select Stylesheets from the list of options and add the style sheets that you want to use.

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


Related concepts
Rich Page Editor
Browser requirements for Rich Page Editor
Setting Rich Page Editor preferences
Open web pages in Rich Page Editor
Create web pages in Rich Page Editor
Add elements to web pages from the palette




+

Search Tips   |   Advanced Search