WP Rig – A WordPress Starter Theme and Build Process in One

Morten Rand-Hendricksen, Senior Staff Instructor at LinkedIn Learning, has released WP Rig. WP Rig is a WordPress starter theme and build process combined into one. The starter theme provides a minimal set of templates with the ability to drag-and-drop files from the WordPress template hierarchy.

It contains a heavily optimized code and file structure, support for lazy-loading images, and documented helper functions. The build process requires no configuration and provides a modern foundation to develop on top of.

Although WP Rig ships with a starter theme, the build process works with any theme you choose to use. WP Rig uses Gulp to manage and optimize files, BrowserSync to immediately preview from inside the browser, and ES2015 to parse JavaScript. Babel, PostCSS, and CSSNext is used to parse CSS. The WordPress Coding Standards and ESLint are used to check code quality.

VS Code is tightly integrated with WP Rig but developers can use any code editor they choose.

Rand-Hendriksen says the goal of the project is to provide a starting point where developers can write accessible and performant code from the start using best practices.

“WordPress and the web it lives on has evolved,” he said. “So have the tools we use to build experiences and interactions on and with the web. WordPress theme development is no longer ‘just’ about writing PHP and CSS and JavaScript.

“It’s also about accessibility and build processes and coding standards and performance best practices and and modern coding languages and browser support and a myriad of other topics.

“WP Rig bridges this gap by building accessibility, performance, coding standards, and modern coding best practices in by default.”

LinkedIn Learning donated Rand-Hendriksen’s time to WP Rig. In collaboration with XWP, Google, and other members of the WordPress community, it was released as an open source project that is maintained by him and Rachel Cherry.

“It is not owned or branded by any company, nor beholden to a company goal or ideology,” he said. “The purpose and goal of WP Rig is to provide the WordPress community with a theme development rig that puts accessibility, performance, and modern best practices in the front seat to the benefit of the end-user and the web as a whole.”

You can download WP Rig for free from the project’s site or on GitHub. To learn how to use it, LinkedIn Learning is offering a free course entitled “Build WordPress Themes with WP Rig.” The course covers a myriad of topics including, configuring the VS Code workpace settings, Templates, and AMP integration.

For more information about WP Rig check out the project’s official announcement.

14 Comments


  1. Hi thanks for sharing this useful information. I just have one quick question that can we use lazy loading plugins apart from the one provide by theme itself? Does this will affect the speed of the site?

    Report

    Reply

    1. The lazy load function built into WP Rig is a stand-alone component which can be ported to any theme and simply included. It has a default-on Customizer feature so the end-user can toggle it on and off as they like, and it is wrapped in conditional statements so it doesn’t conflict with Jetpack and AMP which are the two most common lazy load plugins. The short term plan is to update the conditional wrappers to cover other lazy-load plugins as well, and the long-term plan is to shift the responsibly of lazy loading first to themes and then to WordPress core.

      Report

      Reply

  2. This looks really nice!
    It’s going to be interesting to see what people build with it.

    I’m really impressed with the documentation.
    The structure and content of the docs shows a real commitment to developers learning how to build for the modern web.

    This project is brilliant.

    Report

    Reply

  3. Can we say that days of _s are numbered and we need new starter theme, that corresponds to new technological environments devs are using today?

    Report

    Reply

    1. WP Rig currently uses cssnext for some complex handling of variables etc. Once we figure out how to do the same with postcss-preset-env, it’ll be migrated.

      Report

      Reply

      1. Just an update. As of 5 minutes ago, cssnext has been replaced with postcss-preset-env. Functionality in WP Rig stays exactly the same as before.

        Report


  4. It seems as though a lot of work has gone into WP Rig. As a Mac user, though, I find it simpler and easier to use CodeKit as part of my WordPress development environment.

    Report

    Reply

  5. Hi is there a way to spell WordPress two different ways so that I can figure out whether I want to invest the time in reading the articles about WordPress releases.

    I like to follow up on the WordPress.org learning but it is pointless for me to learn about WordPress.com because I am not in that community.

    Maybe use WordPress.org VS WordPress.com

    Please use the entire domain for fast visuals for us ugly people
    :)

    Anyhow thanks for the article and I am so glad this is a WordPress.org topic

    That’s all

    Report

    Reply

  6. Great to see another amazing project for theme developers. Inspired by the _s I have created my version of the starter theme with a similar set of features and it will be a great learning experience to compare it with the Rig.

    Great job Morten and Rachel!

    Report

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *