A custom WordPress theme built with Tailwind CSS, designed to be lightweight, responsive, and fully customizable. Ideal for blogs, business websites, or eCommerce with WooCommerce support.
- Built with Tailwind CSS (utility-first styling)
- Fully responsive design
- Supports WordPress menus, post thumbnails, and title tags
- Optional WooCommerce support
- Fast and lightweight, optimized for modern browsers
- Ready for customization and development
my-tailwind-theme/
│
├── style.css # Theme info
├── functions.php # Enqueue styles & setup theme
├── index.php # Main template
├── header.php # Header template
├── footer.php # Footer template
├── screenshot.png # Theme screenshot
├── assets/
│ └── css/
│ └── style.css # Compiled Tailwind CSS
└── src/
└── input.css # Tailwind input file
- Clone or download this repository into your WordPress
wp-content/themes/folder:
git clone https://github.com/yourusername/my-tailwind-theme.git- Install dependencies:
cd my-tailwind-theme
npm install- Build Tailwind CSS:
npm run build- Activate the theme in WordPress Admin:
- Go to Appearance → Themes
- Click Activate on My Tailwind Theme
- Tailwind CSS is configured to scan all PHP files:
module.exports = {
content: ["./*.php", "./**/*.php"],
theme: { extend: {} },
plugins: [],
}- To watch CSS changes during development:
npm run build- For production, use the minified build:
tailwindcss -i ./src/input.css -o ./assets/css/style.css --minify- Add new styles in
src/input.css - Extend Tailwind configuration in
tailwind.config.js - Add custom templates (
page.php,single.php) as needed - Use WordPress template tags and hooks for dynamic content
- Theme supports WooCommerce:
add_theme_support('woocommerce');- You can style WooCommerce templates using Tailwind utilities
- Compatible with product grids, single product pages, and cart pages
This project is licensed under the MIT License. See the LICENSE file for details.
Do you want me to create that enhanced version?