WordPress (.com and .org) API Console written in React/Redux
Clone or download
akirk Merge pull request #83 from Automattic/fix-parameter-parsing
Allow non-character ranges as URL parameter definitions
Latest commit 79be711 Jan 19, 2018


WordPress.com API Console v3

This is a WIP rewrite in React of the WordPress.com API Console.

Getting Started Locally

To setup the environment on your local system with WordPress.com APIs:

  1. Clone the repository git clone https://github.com/Automattic/wp-api-console.git.

  2. Install dependencies npm install.

  3. Open WordPress.com Developer Resources

  4. Create New Application: fill the form. Under "Redirect URI" and "Javascript Origins" specify http://localhost:3000 (or where your local app will run). After creation keep the OAuth Information details at hand.

  5. Copy src/config.sample.json to src/config.json and fill "client_id" and "redirect_uri" with the values from the app created above.

  6. Run the dev server npm start. The app will start at http://localhost:3000.

  7. Click on the key to authenticate.

For more details, see below or check out the technical documentation.


Using with WordPress.com APIs

To use with WordPress.com, visit WordPress.com Developer Resources and create an application.

Copy src/config.sample.json to src/config.json and use your WordPress.com Client ID and Redirect URI for the values.

Make sure you add your host to the Javascript Origins / CORS whitelist in the Application's settings.

  "wordpress.com": {
    "clientID": "33333",
    "redirectUrl": "http://localhost:3000"

Using with your self-hosted WordPress site

You can also use this console with your WordPress.org installation but make sure to install the WP REST API - OAuth 1.0a Server first, create an app (in the Users → Applications screen), and then edit the src/config.json like this:

  "wordpress.org": [
      "name": "Dev",                         // Name to display on the API selector
      "url": "http://wordpress.dev",         // Base URL of your WordPress website
      "clientKey": "PwQXbJdBYrXq",           // Client (public) key of your application
      "secretKey": "XB9oidFfxr3g...",        // Secret key of your application
      "callbackUrl": "http://localhost:3000" // Callback URL where you are running this console

Note that your callbackUrl must match the configured value for the application. If you are having an error like "Callback URL is invalid", try putting a trailing slash at the end of your callback URL (details).

You can also install the Application Passwords plugin and use basic authentication to communicate with your site. Make sure that your site is running over HTTPS, otherwise this is insecure. Here are the config settings for basic auth:

  "wordpress.org": [
      "name": "Dev (basic)",                 // Name to display on the API selector
      "url": "https://wordpress.dev",        // Base URL of your WordPress website
      "authType": "basic",
      "authHeader": "Basic bWU6bXlwYSBzc3dvIHJk"

You can generate the base64-encoded portion of the authHeader as follows, using your WP username and your application password (this is the password generated by the plugin, NOT your WP password for your site):

$ echo -n 'mywpusername:mypa sswo rd' | base64

Building a Static Package

To create a static package you can use anywhere (e.g. Github pages): npm run build

The static site is located in build


If you want to quickly deploy the console to Surge, just run npm run deploy.

Deploying to WordPress.com

  • Run the ./bin/build-for-wpcom.sh script. This should generate a build-theme directory.
  • See PCYsg-baa-p2 for further instructions.


All source code is licensed under GNU General Public License v2 (or later).