Tailwind Blocks

Example plugin demonstrating how to integrate Tailwind with the @wordpress/create-block script.

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 recompile JS and CSS including Tailwind styles. Simply refresh the browser to view updates.

GitHub

View Github