Skip to content

Integrate Tailwind with the @wordpress/create-block script.

Notifications You must be signed in to change notification settings

dgwyer/tailwind-blocks

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

19 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Tailwind Blocks

Example plugin demonstrating how to integrate Tailwind with the @wordpress/create-block script. The plugin was scaffolded using @wordpress/create-block and then Tailwind was manually integrated.

Coming soon! Work has started on a custom template for @wordpress/create-block that will create a full block plugin with multiple blocks, each one seamlessly integrated with Tailwind right out of the box.

Usage

Clone the repository and install npm packages.

git clone https://github.com/dgwyer/tailwind-blocks.git
cd tailwind-blocks
npm i

Start the build process in development or do a production build.

npm start or npm run build

Add the plugin to the /wp-content/plugins/ folder of your local WordPress site and activate as normal.

Create a new page and add any of the three example blocks included with the plugin to the editor.

image

Change the source code in any block. e.g. ./src/block1/edit.js and add Tailwind classes. If you're in development mode then the plugin will automatically recompile JS and CSS including Tailwind styles. Simply refresh the browser to view updates.

About

Integrate Tailwind with the @wordpress/create-block script.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published