The Progressive WordPress Theme Rig
Starter Theme + Build Process

WP Rig: A Progressive WordPress Theme Boilerplate

WP Rig is a modern WordPress starter theme and build process bundled into one convenient package. It helps you create beautiful, lightning-fast WordPress themes with exciting user experiences that meet the latest web standards.

You write modern PHP, CSS, and JavaScript, WP Rig lints, optimizes, and minifies your code to make the theme–and the site it runs on–as performant as possible.

Features

We created WP Rig to help you do what you do best: build feature-rich and visually stunning WordPress themes for every person who uses the web. Out of the box you get a fully styled starter theme built for performance and maintainability.

More Than a Starter Theme

WP Rig is a modern build process and starter theme bundled into one convenient package.

The starter theme gives you a starting point for your designs and layouts; minimal templates with optional drag-and-drop files from the WordPress Template Hierarchy; code and file structure optimized for modern performance standards (including lazy-loading images); and well documented helper functions to make theme development and customization easy.

The build process provides a no-configuration starting point for modern progressive WordPress theme development. The process works with the bundled starter theme or any other theme you want to use. Start the process by invoking the npm run build command and work in the /dev/ folder. The WP Rig Gulp process manages and optimizes every file, boots up BrowserSync for immediate in-browser previews, parses your modern JavaScript (ES2015) and CSS through Babel, PostCSS, and postcss-preset-env (formerly cssnext), and keeps tabs on your code quality via WordPress Coding Standards and ESLint.

All of this, coupled with tight VS Code integration, takes the guesswork out of developing modern, progressive WordPress themes.


Start Using WP Rig

WP Rig uses NPM, Composer, and Gulp 4. You need to have all three installed in your local development environment before getting started. WP Rig was built to integrate with VS Code but can be used with any code editor. To get started with WP Rig, follow the steps below:

  1. 1. Get WP Rig

    Clone or download a fresh copy of WP Rig from GitHub and place it in the /wp-content/themes/ folder of your local development environment.

  2. 2. WP Rig configuration

    Open /dev/config/themeConfig.js and set the theme name, author name, and BrowserSync definitions to match your theme and your local development environment.

    Open /dev/style.css and fill out the theme header to match your theme.

  3. 3. Configure VS Code

    In VS Code, open Preferences (Ctrl/Cmd+,), go to Workspace Settings, and set the following configurations:

    {
    	"phpcs.enable": true,
    	"phpcs.composerJsonPath": "wp-content/themes/[yourThemeFolder]/composer.json",
    	"phpcs.standard": "WordPress",
    	"editor.renderWhitespace": "all"
    }
  4. 4. Install npm and Composer dependencies

    In VS Code, open the Terminal (Ctrl+`), navigate to /wp-content/themes/[yourThemeFolder]/ and type `npm install`. This installs all npm and Composer dependencies.

  5. 5. Run the WP Rig build process

    From the same folder, type npm run build to start the WP Rig build process. The starter theme is generated and BrowserSync will boot up the site in your browser.

  6. 6. Start developing

    With the build process running, work in the /dev/ folder and your code will automatically update and be sent to the browser.


Learn to Use WP Rig for Free With LinkedIn Learning

To help you get the most out of WP Rig and to show its support for the WordPress community, LinkedIn Learning has released the free course WordPress: Building Progressive Themes with WP Rig. You can watch the entire course here on wprig.io and on LinkedIn Learning.

WordPress: Building Progressive Themes with WP Rig is currently available in English. Courses in German, French, and Spanish will be released shortly.