A React-powered WordPress theme prototype.
PHP JavaScript CSS
Latest commit 226a43d Sep 8, 2015 @kwight Add ESLint.
Permalink
Failed to load latest commit information.
inc Merge branch 'pr/667' Jan 7, 2015
js Correct outputting author and term info. Embeds now work on collectio… Sep 7, 2015
languages Merge branch 'pr/667' Jan 7, 2015
layouts _s: Use `<main>` element for main content. Jul 30, 2013
sass Routing junk. Apr 20, 2015
.eslintrc Add ESLint. Sep 7, 2015
.gitignore Correct name of compiled JS file to be ignored. Apr 12, 2015
404.php Correcting some irregular capitalisation and coding standards issues Jun 24, 2014
README.md Make configuration section a proper unordered list. May 2, 2015
archive.php Merge branch 'pr/667' Jan 7, 2015
comments.php Consistent navigation Feb 14, 2015
content-none.php Rename no-results.php to content-none.php Oct 13, 2013
content-page.php _s: Update to entry meta output. See #537 Sep 4, 2014
content-search.php _s: Move edit link in template tag for consistency Sep 11, 2014
content-single.php _s: Move edit link in template tag for consistency Sep 11, 2014
content.php Go back to using full content instead of the excerpt. Apr 24, 2015
footer.php Sanitizing URL Feb 25, 2014
functions.php Remove erroneous commits. Apr 23, 2015
header.php Header: Made aria-controls refer to an ID instead of a class Feb 27, 2015
index.php
package.json Add ESLint. Sep 7, 2015
page.php remove unnecessary comparison Oct 15, 2014
rtl.css _s: initial fork of Toolbox Jan 7, 2012
screenshot.png New 1200x900px screenshot, compressed Apr 3, 2015
search.php
sidebar.php _s: Use braces in all conditionals. Jun 26, 2014
single.php Merge branch 'pr/667' Jan 7, 2015

README.md

Tango

Tango is an experimental WordPress theme that uses the React UI library in conjunction with standard Underscores template files. The goal is to develop a method for adding the magic of JavaScript-based UIs to existing WordPress themes, built in PHP.

Requires the WP API Theming plugin.

Installation

  1. Install and activate the WP REST API plugin . Leave it on the develop branch.
  2. Install and activate the WP API Theming plugin.
  3. Clone the Tango repo into your wp-content/themes/ folder: git clone git@github.com:kwight/tango.git
  4. cd into your new Tango theme, and run npm install.
  5. Run npm run build to create style.css and js/public.js. See Issues below if you get EMFILE errors.
  6. Activate Tango from Appearance > Themes.

Configuration

Tango requires some basic information to be able to properly connect to the API, and generate accurate links. These are set in js/config.js.

  • api: the API's index, eg. http://localhost/wp-json (required)
  • serverRoot: the root folder of your web server, eg. http://localhost (required)
  • subdir: if your WordPress install is in a subfolder of your web server, enter the relative path here, eg. /trunk/src
  • localStorage: whether or not to use localStorage for API results (note: there is currently no handling for stale results)

Development

Run npm run watch instead of npm run build while developing, to have files recompile automatically upon save.

Issues

Make sure you have compiled style.css and js/public.js (with npm run build or npm run watch) before activating Tango; otherwise, you'll get an error because of the missing required stylesheet.

On OS X, there is a known issue with low limits of open files, which can cause Error: EMFILE errors with Browserify (used by npm run build).

Some users report changing system settings with sudo ulimit -n 2560 can solve it. If it does not, or you prefer not to change a system setting in that way, you can run npm run watch instead to generate js/public.js (but it will not be minified).