Mobile channels gained considerable importance in the last few years, mainly driven by the success of the iPhone. With CQ you can manage websites for mobiles devices, view a mobile page in a way that emulates a mobile device or switch between several views.

CQ enables you to author webpages with an iPad. You can open a page on your iPad with the embedded Safari browser, move paragraphs around, add pictures, change paragraph titles and once done with editing you can publish the page.

Managing Websites for Mobile Devices

It is increasingly important that websites offer specific “views” for mobile devices, where these “views” typically are separate sites that share some content with the “normal” website. CQ assists you in creating mobile websites: when authoring a mobile page, the page is displayed in a way that emulates the mobile device, called an emulator. When authoring the page, you can switch between several emulators to get a real view of what the end-user will see when accessing the page.

In the out-of-the-box version, devices have been grouped into three categories - feature, smart and touch - according to the capabilities of the devices to render a page . CQ allows to create new device groups. When the end-user accesses a mobile page, CQ detects the device and sends the representation that corresponds to its device group.

CQ enables you to create a mobile site based on an existing standard site. It can be simply achieved by creating a livecopy of the standard site.

Authoring a Mobile Page

When authoring a mobile page, the page is displayed in a way that emulates the mobile device, called an emulator. When authoring the page, you can switch between several emulators to get a real view of what the end-user will see when accessing the page.

To author a mobile page:

  1. In your browser, go to the Siteadmin console.
  2. Open the Products page below Websites >> Geometrixx Mobile Demo Site >> English.
  3. Switch to a different emulator. To do so, you can either:
    • Click the device icon at the top of the page.
    • Click the Edit button in the Sidekick and select the device in the drop-down menu.
  4. Drag and drop the Text & Image component from the Mobile tab of the Sidekick to the page.
  5. Edit the component and add some text. Click OK to save the changes.

The page looks the same as the following:

file

Note

The emulators are disabled when a page on the author instance is requested from a mobile device. Authoring can then be done by using the touch library.

Authoring with the iPad

With CQ it is possible to author webpages with an iPad. You can open a page on your iPad with the embedded Safari browser, view the page in preview mode, annotate-copy-cut-paste-annotate paragraphs, add pictures, activate the page, edit the page properties, start and complete a workflow.

Opening a Page with the iPad

To open a page:

  1. On your iPad, open Safari, the embedded browser.
  2. Enter the url of the page, eg:
    http://<hostname>:4502/content/geometrixx/en/company.html
    and tap Go on the keyboard.
  3. The login page opens: enter your login credentials and tap OK.
  4. The page is displayed.

To view the page in preview mode, tap Preview in the top toolbar: the page is displayed as it will appear on the publish instance and cannot be edited. Tap Preview to go back in edit mode.

The page is displayed as follows:

file

Moving a Paragraph with the iPad

 To move a paragraph:

  1. Open the page.

  2. Tap the paragraph that needs to be moved. The paragraph is highlighted and a context menu is displayed:

    file
  3. Tap Cut in the context menu.

  4. In the page, tap the paragraph above which the moved paragraph will be inserted. The paragraph is highlighted and a context menu is displayed.

  5. Tap Paste in the context menu: the paragraph is moved.

Adding a Picture with the iPad

To add a picture:

  1. Open the page.

  2. Tap Assets in the toolbar at the top of the page. A dialog showing a collection of images opens.

  3. Select a picture from the dialog. All the pictures on the page are highlighted.

    file
  4. In the page, tap the image that you wish to replace. The new image is displayed on the page.

Activating a Page with the iPad

To activate a page:

  1. Open the page.

  2. Tap Page actions in the toolbar at the top of the page. A dialog showing the page actions opens.

    file
  3. Tap Activate in the Page actions dialog. An alert is displayed informing you about the status of the activation.

Editing the Page Properties with the iPad

To edit the page properties:

  1. Open the page.
  2. Tap Page actions in the toolbar at the top of the page. A dialog showing the page actions opens.
  3. Tap Properties in the Page actions dialog.
  4. Edit the page properties.
  5. Either:
    • Tap Back to go back to the page without saving the changes.
    • Tap Save in the dialog or tap Go on the keyboard to save the changes and to go back to the page.

The page properties dialog looks as follows:

file

Starting a Workflow with the iPad

To start a workflow on a page:

  1. Open the page.
  2. Tap Page actions in the toolbar at the top of the page. A dialog showing the page actions opens.
  3. Tap Workflow in the Page actions dialog.
  4. In the workflow dialog:
    1. Select the workflow in the drop-down menu.
    2. Set the title (optional).
    3. Set a comment (optional).
    4. Tap Start Workflow to start the workflow and to go back to the page.

The workflow dialog looks as follows:

file

Completing a Workflow Step with the iPad

To complete a workflow step on a page:

  1. Open the page that is in a running workflow.
  2. Tap Page actions in the toolbar at the top of the page. A dialog showing the page actions opens.
  3. Tap Workflow in the Page actions dialog.
  4. In the workflow dialog:
    1. Select the current step in the drop-down menu.
    2. Either:
      • Tap Complete to complete the step and to go back to the page.
      • Tap Step Back to set the workflow back to the previous step.

The workflow dialog looks as follows:

file

Your comments are welcome!
Did you notice a way we could improve the documentation on this page? Is something unclear or insufficiently explained? Please leave your comments below and we will make the appropriate changes. Comments that have been addressed, by improving the documentation accordingly, will then be removed.

COMMENTS

  • By Alex - 12:41 PM on May 25, 2012   Reply
    i just ran into some touble with the iPad interface on CQ5.5:
    Sitebrowser:
    * the back-button doesn't work
    * in the Geometrixx Mobile Demo Site you see two subpages (Geometrixx Demo Site and Geometrixx Mobile Demo Site), which aren't available in the desktop sitebrowser and aren't clickable

    In a page:
    * if you click the Assets button, the orange frames might be placed on weird locations somewhere on the page
    • By alvawb - 10:34 AM on May 29, 2012   Reply
      Thanks very much for your feedback. The back button issue is known and is being worked on. On Geometrixx, are you saying that they can't be clicked on the iPad or on your desktop computer? On the desktop, those demos are working. I'm not sure about the behavior you're seeing on the Assets button, but will let the developers know.
    • By ANGEL - 3:48 AM on Nov 25, 2012   Reply
      I like

      ADD A COMMENT

       

      In order to post a comment, you need to sign-in.

      Note: Customers with DayCare user accounts need to create a new account for use on day.com.

      ***