Documentation
Custom WordPress themes, now with Tailwind
Get started quickly, and deploy to production sooner than you expect
Quickstart
Installation
- Generate your theme
- Unzip the theme archive
- Move the resulting folder to
wp-content/themes
in your local development environment - Run
npm install && npm run dev
in the moved folder - Activate the theme in WordPress
Development
- Run
npm run watch
- Add Tailwind utility classes with abandon
Deployment
- Run
npm run bundle
- Upload the resulting zip file to your site using the “Upload Theme” button on the “Add Themes” administration page
Have more complex deployment requirements? I’ve received reports of successful deployments via GitHub Actions, Envoyer, Deployer and Capistrano. For more details, please see the deployment documentation.
Full Documentation
Fundamentals
- Installation
Generate your custom theme, install it in WordPress and run your first Tailwind builds - Development
Watch for changes, build for production and learn more about how _tw, WordPress and Tailwind work together - Deployment
Share your new WordPress theme with the world - Troubleshooting
Find solutions to potential issues and answers to frequently asked questions
In Depth
- Using Tailwind Typography
Customize front-end and back-end typographic styles - JavaScript Bundling with esbuild
Install and bundle JavaScript libraries (very quickly) - Linting and Code Formatting
Catch bugs and stop thinking about formatting
Extras
- On Tailwind and WordPress
Understand how WordPress and Tailwind work together - Managing Styles for Custom Blocks
Learn strategies for using Tailwind in theme-specific custom blocks - Setting Up Browsersync
Add live reloads and synchronized cross-device testing to your workflow