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 archive
- Move the entire unzipped folder to
wp-content/themesin your local WordPress installation - Run
npm install && npm run devin the moved folder - Activate the theme in your local WordPress installation
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 - Keeping your theme up-to-date (or not)
How to update, and whether or not you should
Extras
- On Tailwind and WordPress
Understand how WordPress and Tailwind work together - Styling HTML from outside the theme
Work with WordPress core, plugins and JavaScript libraries - 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