Q for iOS is a demo theme for mobile apps built with WP-AppKit, a WordPress plugin to create mobile apps connected to WordPress (more on that at http://getwpappkit.com).

Please note that beginning with WP-AppKit 0.6, Q for iOS is pre-installed on plugin activation as the default theme for iOS applications.

You might want to check Q for Android, another fine theme for WP-AppKit: Q for Android

Installation

Please note that beginning with WP-AppKit 0.6, Q for iOS is pre-installed on plugin activation as the default theme for iOS applications.

Download WP-AppKit: https://github.com/uncatcrea/wp-appkit/releases
Install WP-AppKit as you would do for any other WordPress plugins (ie. drop the plugin folder in /wp-content/plugins)
Activate WP-AppKit using the Plugins WordPress admin panel. (Browse the Installed Plugins list and click the Activate link of WP-AppKit.)
Now you should have a brand new /wp-content/themes-wp-appkit folder (yes, this is where app themes are stored)
Download the Q for iOS from [https://github.com/uncatcrea/q-ios/releases](this repository) and drop its folder in /wp-content/themes-wp-appkit
In WordPress, use the WP-AppKit admin panel to create a new app and choose one of the themes in the Appearance box
From there you're free to test in your browser (using the Chrome's Emulation Mode) or directly try to compile

If new to WP-AppKit, you might want to read this article: http://uncategorized-creations.com/1212/compiling-app-using-wp-appkit-phonegap-build/.

Theme's Overview

What's implemented

At the moment, Q for iOS theme implements:

A clean iOS UI (including transitions)
Off-canvas menu (you can update it in the app's edit panel)
Archive template (eg. post list) with infinite post list
Single template (eg. a post) with the most common HTML elements (eg. strong, em, blockquote...)
Responsive embeds
The refresh process
Offline cache (meaning that you can read loaded posts offline)
Post thumbnail captions and subhead support
The iOS back button
The iOS status bar
A responsive interface

iOS UI

Back button when displaying the single view (ie. a post)
In app browser to open external links
Status bar color matches the theme
iOS spinner

Cordova Plugins

Q for iOS relies on Cordova plugins to:

Customize the iOS status bar: https://github.com/apache/cordova-plugin-statusbar
Open external links in an in app browser: https://github.com/apache/cordova-plugin-inappbrowser

WP-AppKit export function adds these plugins automatically to your config.xml file. If you don't use the export, make sure to add them in order the theme to be able to work properly.

Responsive Images

Q for iOS hooks into the WP-AppKit web services to modify the source code of images in the post content. It eases the way to style the responsive images later. See prepare-content.php in the php folder of the themes.

Thumbnail Captions and Subheads

Q for iOS hooks into the WP-AppKit web services to modify add thumbnail captions and subheads (if available) in the post content. See add-custom-data.php in the php folder of the themes. Note that subheads are expected as a post custom field.