A block for displaying recipes on your WordPress site 🥐 🍲 🥘 🍪
- For a ready-to-use version, download the zip on the release tab.
- Upload that to your WP site by going to Plugins > Add New, then click Upload Plugin in the header to reveal the file upload.
- Activate the plugin 🎉
- You can skip to the Usage section.
Alternately, if you want to hack on the plugin (feel free!), you'll want to clone this repo, install dependencies, and build the files. You will need node & npm installed.
$ git clone git@github.com:ryelle/rmb-recipe-block.git
$ cd rmb-recipe-block
$ npm install
$ npm run build
Now you can activate the plugin 🎉
You now have "Recipe" block in the block inserter.
Adding this will insert a template with an image, heading, recipe information (serving size, time, duration), and a section for ingredients and directions. You can add and remove blocks from this container.
When in the recipe block, you'll be able to add extra Recipe Ingredients, Recipe Directions, and Recipe Meta blocks.
Note: This block doesn't add schema or structured content to your site (the magic used by google to format recipes in search results and for voice assistants). That's probably not in scope for me as this is a side-project and fulfills my use case, but PRs are welcome 😁
There are other npm scripts that will come in handy:
npm run start– Run the build process, and keep watching for any file changes.npm run lint– Run the JS linter to make sure all code is following code standards. This will also be run on each PR automatically, so it might save a step to run it yourself before making a PR.