Documentation Setting up your Development Environment

Setting up your Development Environment

Overview #

We’ve tried to make it easy to set up a development environment that closely mirrors what you can expect on your production WP.com VIP sites. Using VIP Quickstart you can get up-and-running pretty quickly.

↑ Top ↑

Setting up your environment #

Follow the “Getting Started” instructions to set up Quickstart.

The Quickstart setup process will do all of the following for you:

  • Installs WordPress, via a trunk checkout, with multisite enabled.
  • Installs wp-cli
  • Installs and activates the Developer Plugin.
  • Installs and sets up Jetpack, which gives your site some of the built-in features that come with WordPress.com
  • Does a checkout of the VIP Shared plugins.
  • Does a checkout of the WP.com Mobile Theme.
  • Enables debugging to catch errors early and often.

↑ Top ↑

VIP Plugins and Helper Functions #

Quickstart will automatically check out the the main framework required for VIP themes and shared VIP plugins directory containing a growing list of plugins that you can use.

Note that these plugins live at wp-content/themes/vip/plugins/ and not wp-content/plugins/ like you would see in a typical .org environment.

If you’re a VIP developer and don’t already have access to the plugins repo (https://vip-svn.wordpress.com/plugins/), please get in touch.

↑ Top ↑

vip-init.php #

All VIP themes must have the following at the very top of their functions.php file:

// Init WP.com VIP environment
require_once( WP_CONTENT_DIR . '/themes/vip/plugins/vip-init.php' );

This initializes most of the code necessary to develop well in a VIP environment. Here are a few things the init process loads:

  • vip-helper-wpcom.php: defines some helper functions that are specific to WordPress.com.
  • vip-local-development-helper.php: defines some helper functions that assist in loading plugins and helper files.
  • vip-powered-wpcom.php: defines some helper functions that assist you in displaying the “Powered by WordPress.com VIP” text or image.
  • vip-helper.php: file which defines some helper functions that will work on both WordPress.com and your hosting environment.
  • vip-roles.php
  • vip-permastructs.php
  • wpcom-caching.php

To load plugins from the shared themes/vip/plugins/ folder, you can use the following function call:

wpcom_vip_load_plugin( 'zoninator' );

↑ Top ↑

Developer Plugin #

The plugin helps you optimize your development environment by making sure that you have all the essential tools and plugins installed and available. It comes auto-installed in Quickstart.

Make sure to select “WordPress.com VIP” as your project type when you create a new site.

↑ Top ↑

Jetpack #

Jetpack is a plugin that brings the many great features of WordPress.com to your self‑hosted WordPress install. It’s especially useful for testing various WordPress.com features like Contact Forms.

Jetpack currently requires that WordPress sites be reachable by WordPress.com to enable many of its cloud-specific features. For development in local or offline environments, Quickstart enables Jetpack’s development mode by adding the following to your wp-config.php file:

define( 'JETPACK_DEV_DEBUG', true );

Note: development mode automatically gets enabled if you don’t have a period in your site’s hostname, i.e. localhost.

↑ Top ↑

Debugging #

Quickstart comes with debugging enabled, by default. This means that you can expect errors to be output to screen to help catch and fix them as you develop. You can also find errors output to standard error logging locations as well.

↑ Top ↑

Themes on VIP #

Themes in the VIP environment live in WP_CONTENT_DIR . '/themes/vip/'. For example, your theme path might be /wp-content/themes/vip/my-theme/

If your theme is already in the VIP SVN, do an svn checkout in the vip themes folder: svn co https://vip-svn.wordpress.com/my-theme/ wp-content/themes/vip/my-theme/.

↑ Top ↑

Using Git with Subversion #

Read about how to use Git with Subversion for your local development environment.

↑ Top ↑

Caveats #

Not an exact mirror #

While we’ve tried our best to give you an environment that has a lot of what you can expect in production, we’re still quite a way off from 100% parity. If there’s something specific you find missing or different between environments, please let us know.

↑ Top ↑

Developing against trunk #

We often deploy beta versions of WordPress to WordPress.com early, so Quickstart relies on an SVN checkout of WordPress trunk rather than the latest stable release version. This way you won’t get caught off guard when new versions of WordPress are rolled out to WordPress.com.

↑ Top ↑

Mirroring Data for Local Testing #

No direct access to WordPress.com databases is possible from your local development environment. An updated copy of your site’s data can be easily exported and imported locally (wp-cli import).

You can also populate your site with some test data (you can use our demo files, though, you’re better off using test data from your own sites).

↑ Top ↑

Determining Your Environment #

While your code should generally be environment-agnostic, you may occasionally find the need to run particular code on WordPress.com VIP’s production environment only–for instance, a filter adding tracking code to your template. The WPCOM_IS_VIP_ENV constant is defined and set to true on the VIP environment and can be used to reliably determine your current running environment.

if ( true === WPCOM_IS_VIP_ENV ) {
    // running on WordPress.com
} else {
    // not on WordPress.com
}