WordPress: Building Progressive Themes with WP Rig

Learn how to build progressive WordPress themes with WP Rig, a theme development toolkit.

WP Rig, a new toolkit, makes building progressive themes in WordPress easy. It ships with a fully styled starter theme that can be easily customized, and it lints, optimizes, and minifies your changes as you code, making your themes as fast and performant as possible. In this course, instructor Morten Rand-Henriksen shows how to install and configure WP Rig and build a new progressive theme right out of the box. Learn how to edit the underlying CSS, PHP, and JavaScript code and add advanced features such as widgets, custom menus, backgrounds, and logos. Watch a practical example of how to extend WP Rig. Plus, see demonstrations of how to add a footer widget, build a basic component, and export a theme.

Introduction

• Buidling progressive WordPress themes
• WP Rig: A primer

1. Configure a Development Environment for WP Rig

• Set up your development environment
• Install Node.js and Composer

2. Install and Configure WP Rig

• Get WP Rig
• How WP Rig works
• First-time configuration
• Configure Browersync
• Run the WP Rig installer
• Configure Visual Studio Code workspace settings
• Build, activate, and test your new theme
• Sidebar: Configure Browsersync SSL

3. CSS

• CSS in WP Rig
• CSS file structure and partials
• Edit CSS
• CSS custom properties (variables)
• Google Fonts
• Load modular style sheets
• Create and preload style sheets
• Advanced CSS debugging and configuration

4. PHP and WordPress Templates

• PHP in WP Rig
• Templates and file structure
• Optional template files
• Theme features and customizations
• Functions in WP Rig
• Example: Add footer widgets

5. JavaScript

• JavaScript in WP Rig
• Advanced JavaScript loading
• Debug JavaScript

6. Extending WP Rig: A Practical Example

• The role of PHP modules
• Build a basic component
• Enqueue JavaScript files
• Add a custom image size
• Various demos

7. Going Further with WP Rig

• Exporting your theme
• Advanced build features
• Contribute to WP Rig
• Going further with WordPress