Why WP Rig is the Ultimate WordPress Starter Theme for Modern Developers: Top 10 Reasons to Switch

In the rapidly evolving world of WordPress theme development, finding a workflow that balances high-performance output, clean architecture, and modern developer convenience is a constant struggle. For years, developers were forced to choose between bloated, monolithic starter themes or spend dozens of hours bootstrapping their own modern build configurations with Gulp, Webpack, or Sass.

Enter WP Rig.

WP Rig is not just another starter theme—it is a modern, highly opinionated, and performance-optimized theme engineering platform. If you want to build custom, directory-ready WordPress themes that load instantly, ace Google’s Core Web Vitals, and leverage modern tooling like Bun, esbuild, and Lightning CSS, WP Rig is the definitive choice.

In this deep-dive guide, we break down the top 10 reasons to use WP Rig for your next custom WordPress theme development project, drawing directly from its advanced architecture, workflow specifications, and automated tooling.


1. The “A La Carte” Component Architecture (Goodbye, Bloated functions.php)

Historically, WordPress starter themes have relied on a massive, chaotic functions.php file or unorganized helper files to bootstrap theme functionality. This classic procedural design makes themes highly fragile, difficult to maintain, and packed with bloated code that developers must manually strip out.

WP Rig v3.4 completely reimagines theme PHP architecture using a strict, modular Object-Oriented Programming (OOP) model. Under the hood, WP Rig organizes features into self-contained Components located under the inc/ directory. Each feature (such as custom backgrounds, nav menus, or post thumbnails) is encapsulated in a dedicated class that implements a standardized Component_Interface.

wprig/inc/
├── Theme.php                 # Main theme bootstrap class
├── Component_Interface.php    # Standard contract for components
├── {Feature_Directory}/
   └── Component.php         # Implements Component_Interface

To take this modularity to the next level, WP Rig features the Open Component Registry (OCR). Instead of manually writing boilerplate, you can discover, add, and manage performance-optimized components dynamically from the command line:

  • npm run rig:list – Inspect all active and installed theme components.
  • npm run rig:search [keyword] – Discover bolt-on, community-built components.
  • npm run rig:add [slug] – Download and inject a component directly into your theme.
  • npm run rig:remove [slug] – Completely prune a component and its assets with zero residue.

Private Component Registries for Agencies

For agency environments, this modularity is incredibly powerful. Beyond the public registry, development teams can set up and configure private component registries. This allows agencies to package, version, and distribute their own vetted, proprietary internal components (such as specialized API integrations, custom block layouts, or customizer setups) securely across all of their client sites. You achieve maximum code reuse without exposing sensitive intellectual property to the public.


2. A Blazing-Fast, Vite-Like Modern Compilation Pipeline

Legacy WordPress theme compilation can feel incredibly sluggish. WP Rig has completely redesigned the asset build pipeline to deliver a blazing-fast local developer experience that rivals modern front-end build systems like Vite.

WP Rig utilizes cutting-edge, high-performance engines to process source assets in milliseconds:

  • Bun or Node.js drive the high-speed task runners.
  • esbuild compiles and minifies TypeScript and ESNext JavaScript (assets/js/src/) in milliseconds.
  • Lightning CSS parses, imports, and minifies stylesheets with remarkable efficiency.

For active development, WP Rig introduces an opt-in Modern Dev Server (npm run dev:modern) that replaces legacy, heavy compilers. Operating much like a Vite dev server, this lightweight proxy listens on custom ports, injects styles on-the-fly directly into the browser without full page reloads, and refreshes templates instantaneously. This gives you desktop-app-like compilation speeds specifically tuned for local WordPress environments, keeping you in a flow state rather than waiting on your terminal.


3. AI-Optimized Coding Companions

Artificial intelligence is changing how we write code. However, typical legacy WordPress code—with its procedural style, global variables, and lack of typing—is notorious for causing AI model “hallucinations” in tools like ChatGPT, Claude, and GitHub Copilot.

WP Rig is engineered from the ground up to be AI-friendly. It provides highly structured, predictable architecture that LLMs can read and understand perfectly. Key design choices that optimize WP Rig for AI-driven workflows include:

  • Strict Namespacing: All theme PHP classes operate under the WP_Rig\WP_Rig root namespace, avoiding global scope pollution.
  • Autoloading (PSR-4): Sibling classes map strictly to the directory layout, making it easy for AI agents to locate dependencies.
  • Type Hinting: Extensive use of parameter and return type hints makes code self-documenting and structurally predictable.
  • Integrated LLM Mapping: WP Rig includes a structured .ai/ directory and llms.txt configurations, mapping architectural guidelines so custom AI assistants can immediately grasp local theme conventions and write registry-ready components with near-zero errors.

When your AI assistant understands the codebase, your development velocity skyrockets.


4. Built-in Performance Architecture for Core Web Vitals

Slow page speeds destroy conversions and harm search engine rankings. In WP Rig, maximum performance is built right into the framework’s core files. The platform utilizes three advanced strategies to ensure your custom themes score a perfect 100 on Google Lighthouse:

A. Progressive Loading of CSS

Standard themes bundle all styles into a single, massive stylesheet. WP Rig utilizes progressive CSS loading using in-body tags.

While global.css contains baseline layouts and is loaded in the <head>, other component-specific stylesheets (like comments.csssidebar.css, and widgets.css) are registered in inc/Styles/Component.php and loaded conditionally only when that specific module is present in the current viewport:

wp-rig-comments' => [
    'file'             => 'comments.min.css',
    'preload_callback' => function() {
        return ! post_password_required() && is_singular() && ( comments_open() || get_comments_number() );
    },
]

Developers can print these styles dynamically in template partials using:

wp_rig()->print_styles( 'wp-rig-comments' );

This significantly reduces the initial page payload, leverages HTTP/2 multiplexing, and optimizes browser parsing times.

B. Cookie-Based Critical CSS Inlining

To deliver an instantaneous First Contentful Paint (FCP), WP Rig features an intelligent cookie-based critical CSS strategy:

  1. First-time visitors receive critical above-the-fold CSS inlined directly into the HTML <head>.
  2. Once loaded, WP Rig sets a wprig_critical_cached cookie in the user’s browser.
  3. On subsequent visits, the theme detects this cookie and enqueues the styles as standard, cached external files, preventing redundant HTML bloat.

C. Localized Font Optimization

To eliminate layout shifts (CLS) and Flash of Unstyled Text (FOUT), WP Rig downloads and localizes Google Fonts to the assets/fonts/ directory. The theme automatically preloads these local font assets via <link rel="preload"> and defaults them to font-display: block or swap, ensuring fonts are rendered seamlessly before rendering text.


5. Native Block and Full Site Editing (FSE) Integration (With Directory-Ready Safeguards)

Transitioning to modern WordPress Gutenberg and block-based architecture can be highly complex. WP Rig acts as the perfect bridge, supporting both classic theme files and cutting-edge Full Site Editing (FSE) standards.

Key Gutenberg-ready features in WP Rig include:

  • theme.json Configuration: Seamlessly propagates design tokens, custom colors, spacing systems, and typography directly to the WordPress block editor and Global Styles.
  • Theme-Scoped Gutenberg Blocks: Scaffold custom block directories directly inside the theme directory (assets/blocks/<slug>/) instead of spinning up heavy standalone plugins.
    npm run block:new my-custom-block — –title=”My Custom Block”
  • PHP-Only Blocks (WordPress 7.0 Ready): WP Rig supports zero-build block development. By utilizing the --architecture php flag:
    npm run block:new my-php-block -- --architecture php WP Rig scaffolds a schema-compliant, auto-registering block.json and a simple PHP render.php template. This bypasses React build overhead entirely, making simple blocks incredibly fast to construct.
  • Automatic Block Registration: The block component at inc/Blocks/Component.php dynamically scans the assets/blocks/ directory on init and registers every discovered block automatically. No manual PHP bootstrapping required!

Omission & Promotion Rules for the WordPress.org Directory

If you are authoring a theme for the official WordPress.org Theme Directory, you are likely aware of their strict theme review guidelines regarding custom blocks: block registration is generally considered “plugin territory” and is prohibited inside themes. WP Rig handles this limitation beautifully. You can easily build, test, and preview custom theme-scoped blocks during local development, and when preparing for directory submission, you can cleanly promote them to standalone plugins with a single command:

npm run block:promote-plugin my-custom-block

This isolates the block files and bundles them into a separate, installable plugin, keeping your theme completely compliant with official review guidelines while preserving block development convenience.


6. Automated Quality Assurance & Directory Readiness

Submitting a custom theme to the official WordPress.org Theme Directory or delivering highly robust code to an enterprise client can be a grueling process of debugging and revision. WP Rig removes this friction by building advanced Quality Assurance (QA) tools directly into the theme itself.

With a single terminal command:

npm run ai:check

WP Rig executes an automated battery of tests and static analysis:

  • PHPStan Static Analysis: Validates your PHP code, checks type safety, enforces strict parameter returns, and captures potential bugs before runtime.
  • PHP Code Sniffer (PHPCS): Audits your source files against the strict rulesets of the official WordPress Coding Standards (WPCS) and WordPress.org Theme Review guidelines.
  • Playwright End-to-End (E2E) Testing: Launches automated browsers to execute smoke tests, verify navigation, and run visual regression audits using screenshots (npm run test:e2e:screenshot).
  • Automated Accessibility Auditing: Playwright leverages axe-core to perform automated WCAG accessibility audits on critical templates (like 404 and archive pages) to ensure compliant HTML output.

This robust QA pipeline ensures that your custom theme is completely secure, bug-free, and directory-ready from day one.


7. Secure Bundling and Enterprise-Grade CI/CD Pipelines

Modern development and deployment demand a higher standard of security and automation. WP Rig addresses these needs by integrating precise packaging filters and robust compatibility with Continuous Integration / Continuous Deployment (CI/CD) pipelines.

Granular Export and Bundle Control

When preparing a theme for production, you want to guarantee that local developer configurations, raw assets, and internal documentation do not make their way to the production server. Under the "export" block in ./config/config.json, WP Rig provides complete control over the bundling process.

By default, the theme bundler automatically excludes sensitive developer assets—such as .env files, API keys, the .git directory, node_modules, standard Markdown files, and raw source assets—copying only your compiled public files and production-ready templates. This ensures your final .zip file is perfectly unbloated and entirely secure.

Automated Deployment Pipelines

WP Rig is engineered to act as a key player inside enterprise deployment pipelines (such as GitHub Actions, GitLab CI, or Bitbucket Pipelines). In a standard CI/CD workflow, you can automate:

  1. Dependency Installation & Building: Let the pipeline spin up the clean build task (npm run build) to generate compiled production scripts and stylesheets.
  2. Automated QA Verification: Run automated linting (npm run lint), PHPStan analysis, and Playwright headless browser tests to ensure zero code regressions.
  3. Clean Artifact Generation: Package the production-ready theme with npm run bundle and securely deploy the lightweight archive directly to your staging or production servers.

8. Future-Proof CSS Workflows via Lightning CSS (Forget Sass)

For years, CSS pre-processors like Sass or LESS were mandatory to write maintainable styles. However, compiling heavy pre-processors adds significant build bloat and compiles duplicated selectors that increase final bundle sizes.

Modern CSS has evolved, and WP Rig embraces it directly. Moving away from pre-processors and intermediate parsers like PostCSS, WP Rig processes styles entirely using Lightning CSS to compile clean, native, future-proof markup today:

  • Native Nesting: Write nested rules directly using modern CSS Nesting Level 1 specifications:
    .card { background: var(--bg-color); & .card-title { color: var(--primary-color); } }
  • Custom Properties (Variables): Declare variables globally in assets/css/src/_custom-properties.css under the :root selector and reference them dynamically throughout your stylesheets.
  • Bleeding-Edge Custom Media Support: Store breakpoint media queries as variables using the upcoming @custom-media specifications declared in _custom-media.css. Lightning CSS parses these declarations and compiles them into fully backwards-compatible media queries automatically.
  • Automated CSS Image Path Resolution: Referencing local theme images in static CSS files is a classic absolute pathing headache for developers. WP Rig’s Lightning CSS pipeline includes a specialized automation script that dynamically resolves relative image paths (e.g., pointing to assets inside assets/images/) and compiles them into production-ready URLs. This removes manual path correction entirely.

9. Accessibility (a11y) and Mobile-First Progressive Enhancement

Creating a truly accessible website that accommodates all users can take countless hours of auditing. WP Rig simplifies accessibility by baking strict WCAG compliance and mobile-first principles directly into its foundational HTML markup:

  • Mobile-First Baseline: The markup uses a clean, lightweight HTML structure. Mobile-first styling serves as the baseline, while complex multi-dimensional grids are served using CSS Grid and Flexbox as progressive enhancements. Older browsers that do not support grid layouts seamlessly fall back to the optimized, single-column mobile view.
  • Keyboard & Screen Reader Friendly: Navigation templates and responsive mobile menus are pre-configured with keyboard-accessible tab focuses and dynamic ARIA attributes.
  • Automated Audits: With Playwright and axe-core integrated into the testing pipeline, you can run accessibility audits locally on your custom pages to identify violations before going live.

10. Ultimate Child Theme Authoring for ANY Parent Theme

For many web agencies, the ideal workflow involves maintaining a highly optimized “parent” theme and spinning up lightweight “child” themes for individual client projects. However, child themes often lose access to the parent’s compilation pipeline, forcing developers to manage clumsy independent bundlers.

WP Rig features a dedicated childify script that elegantly solves this problem—and it is compatible with any WordPress parent theme on the market.

Whether your target site operates on a WP Rig parent or popular frameworks like Astra, GeneratePress, Divi, Kadence, or Twenty Twenty-Four, running:

node node/childify.js

instantly bootstraps an optimized child theme in your directory.

This generated child theme:

  • Inherits templates and configurations cleanly from your chosen parent theme.
  • Maintains its own independent, fully operational copy of the WP Rig modern build system, including esbuild, Lightning CSS, and the Modern Dev Server.
  • Allows you to write modern CSS nesting, dynamic image pathing, and TypeScript inside the child theme’s src/ directory, while letting the third-party parent theme handle core template rendering.

This delivers the ultimate child development architecture, allowing you to use WP Rig’s high-performance build tools on any WordPress site, regardless of the active parent theme.


Conclusion: Elevate Your WordPress Theme Development with WP Rig

WP Rig is more than a starter theme; it is an engineered, developer-first platform designed to elevate the standards of WordPress theme development. By combining strict modular PHP architectures, blisteringly fast compilation tools like Bun and esbuild, native Full Site Editing compatibility, and automated QA systems, WP Rig empowers you to build themes that are incredibly clean, lightning-fast, and future-proof.

Stop wrestling with bloated code and slow compilers. Clone WP Rig, start your local server, and experience modern WordPress theme engineering today!

Going further with WordPress

Watching this course, you’ve gotten an in-depth intro on how to build themes using WP Rig. Now that you’ve gotten your bearings, it’s time to push yourself and WP Rig to its limits and make new progressive themes for WordPress.

Your journey to learning has only just begun. We have a long list of courses on LinkedIn Learning that dive deeper into WordPress theme development, front-end performance optimization, content management, and a myriad of other topics that relate to the art of building progressive websites.

LinkedIn Learning does require a paid subscription, but you may be able to login for free with your local library card. More information here: https://www.linkedin.com/help/learning/answer/107121/linkedin-learning-for-library-patron-faq?lang=en

Material types: Languages: Courses:

Contribute to WP Rig

Once you start using WP Rig to develop your own themes, you may have questions, comments, suggestions and feature requests. You may even want to add or change something in WP Rig itself. In that case, there’s good news: WP Rig is open for contributions! 

The purpose of WP Rig is to give the WordPress community a robust theme development rig to build modern, progressive, performant themes. That is only possible with the contribution of people like you. 

Consider this your invitation to contribute back to the project in whatever way you want by: 

  • Filing or answering issues on the Github repo.
  • Writing documentation, tutorials or blog posts for the official site, or any other site.
  • Making video tutorials.
  • Doing conference talks, or in-person workshops.
  • Using WP Rig, and showing it off in the footer of your theme.

Whatever you like, WP Rig is your tool! It’s built by and for the people who use it, like you, and you can play a part in its future. 

Contributors welcome!

Material types: Languages: Courses:

Advanced build features

For advanced users and advanced uses, there are some additional build processes. You can find them under package.json all the way at the bottom under scripts. 

Here we have all the different processes you can run using the “npm run” command. If you’ve followed the course, you should be familiar with two of these commands already: “npm run dev” and “npm run build”

“npm run dev” – This is the process that builds the entire theme, then spins up a browser sync and watches all of your files. 

“npm run bundle” – This bundles out the theme, and creates a separate folder and separate zip archive for when you’re done building. 

“npm run build” – This runs the entire build process without running browser sync and watch. So if you just want to spin up the theme once to see what it produces, you just say “npm-run build”, and you have “npm run gulp” if you want to target specific Gulp processes. 

You have the option to run any of the Gulp processes that sit inside the Gulp folder. Most of these processes are being run automatically in the other scripts, but if you want to target a Gulp process specifically, you can do this by running “npm run gulp [script]”. For example, to run the images Gulp processes, you will run “npm run gulp images”. Or to run the PHP process to check your code against current PHP coding standards, you’d run “npm run gulp php”.

These are advanced features which are for advanced purposes, but they are available to you. They’re also a good path into understanding how WP Rig works better. 

So if you’re ever curious about what’s going on, go check out “package.json” or the folder “/gulp” and see how the Gulp processes are built together to make everything work properly.

Material types: Languages: Courses:

Exporting your theme

After all this work, you’re ready to bundle up your theme and either ship it to another user, or place it on a site. In this video, we will show you the build process specifically for this purpose. It will create a new folder for you in the “themes” folder of your current live site.

You will end up with a live version of your new theme sitting inside your theme folder that you can test right away, and you will also have a zipped archive that you can ship off to either the WordPress theme directory, or hand over to someone else who wants to use it.

Material types: Languages: Courses:

Various demos

The final piece of our Related Posts component puzzle is the style sheet.

At this point in the process, we are generating the actual content when people scroll down, and the functionality is there — but the user experience needs work.

In this video, we’ll be adding some CSS to make the component look good, and also be functional. In the exercise files for this movie, you’ll find a new style sheet called “related.css” under assets/css/source.

By the end of this video, you’ll see we’ve made a completely new component, built from scratch, using the standard methodology of WP Rig.

Material types: Languages: Courses:

Add a custom image size

Now that our component works, and we have our Java script enqueued, we can start customizing the functionality of this particular component to make it work exactly the way we want to.

Out of the box, WordPress has a series of image sizes — but what happens when none of those image sizes really fit with what you want?

Creating new image sizes is a standard thing we do in WordPress themes all the time, so in this video, we’re going to generate our own custom image size, and do it inside the component.

Material types: Languages: Courses:

Enqueue JavaScript files

The related post component we’re building will use JavaScript to query the WordPress Rest API, then output the results when the users scroll down to that section. 

(In the exercise files for this movie, look for the “related.js” file under assets/js/src. This will eventually become the full JavaScript we’re going to use.)

In this video, our goal is to get this file enqueued *only* on single posts, so that we can actually see these results. Once the file is enqueued, we’ll be sending requests, and getting responses through the WordPress REST API.

Material types: Languages: Courses:

Build a basic component

(Note: click here to download the exercise files referenced in this video.)

In this video, we will walk you through building a basic component that exposes a template function we can use to pull in some content. We’ll create a component folder and file; then, you’ll see where and how to pull and build from existing components in WP Rig, so you are not rebuilding the wheel from scratch.

What we need to start is a *different* component that does something *similar* to what we want to do. And there are several options available here. We’ll be using the Comments component, because it does the two things that will be useful for you to see and learn:

-First, it exposes a function, so it creates a new template tag that is used somewhere else in the theme.

-Second, it enqueues a script: in action_enqueue_comment_reply_script(), it enqueues a script. (Because the functionality is going to be Javascript-based, we need to be able to enqueue a script.)

Watch and follow along as we get started building a basic related posts component.

Material types: Languages: Courses:

The role of PHP modules

 It’s one thing to get a full breakdown of how a starter theme works. It’s quite another to actually use the starter theme to build something, especially when that starter theme does things in new and different ways.

So, in this chapter, we’ll build a new component together from scratch using PHP, JavaScript, and CSS.

That way, you get hands-on experience on how all the things we’ve talked about up to this point actually fit together and work in production.

For this chapter, there are exercise files you can download here. For each movie, there’s a beginning branch marked “b” and an end branch marked “e”. You can open them up and follow along.

In this chapter, we’ll build a “Related posts” component that sits below the main post content:

This component is powered by JavaScript, uses the Rest API, and has some really snazzy features.

First of all, it finds the categories of the current post, and displays the three latest posts in any of the same categories. That’s why it’s called a related post component: it displays content that’s related to the current one you’re looking at.

Second, the related posts are only loaded if and when a user scrolls down to the related post section. If they don’t scroll that far, the query never happens, and the user saves that data.

Finally, the related post component uses the Rest API and JavaScript to make this query so it’s fully dynamic, which is pretty cool. We’ll get started in the next video by building a basic component.

Material types: Languages: Courses: