/wpak-theme-bootstrap

WP-AppKit demo themes using Bootstrap Front End Framework

Primary LanguageHTML

Wpak Bootstrap Demo Theme

Bootstrap Demo Theme is a WP-AppKit theme based on the Bootstrap Front End Framework.

Its main purpose is to illustrate the different WP-AppKit features and how to implement them in a theme using the WP-AppKit Theme JS API.

Specific WP-AppKit features implementation examples such as the "User Login" feature can be found in the feature-* branches of this repository. For example see the feature-user-login branch.

Installation

WP-AppKit plugin install

  • Download WP-AppKit: https://github.com/uncatcrea/wp-appkit
  • 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)

Bootstrap theme install

  • Create a new folder "boostrap" in the /wp-content/themes-wp-appkit directory
  • Download the Bootstrap theme from this repository and drop the source files to your "bootstrap" folder
  • OR clone this repository in your "bootstrap" folder : "git clone https://github.com/uncatcrea/wpak-theme-bootstrap ." (don't forget the final dot so that it's not cloned in a subfolder!)
  • In WordPress, use the WP-AppKit admin panel to create a new app and choose the Bootstrap theme 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 about compiling WP-AppKit apps with PhoneGap Build.

Theme's Overview

##What's implemented

At the moment, Bootstrap theme implements:

  • Archive template (eg. post list)
  • Infinite post list (A "Get more post" button at the bottom of post lists)
  • Single template (eg. a post)
  • Comments template (comment list for a post)
  • Bootstrap's dropdown menu
  • Content refresh process
  • Offline cache (meaning that you can read loaded posts offline)
  • Back button
  • Responsive interface handled by Bootstrap

For iOS and Android

The Bootstrap theme is the same for iOS and Android.

Cordova Plugins

WP-AppKit themes rely on Cordova plugins to:

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 themes to be able to work properly.