WP Manifestindependent plugin directory
manifest / editor / interactive-recipe-block

Interactive Recipe Block

A recipe block that uses the WP Interactivity API to scale ingredient measurements

by Mikey Arce · github.com/mikeyarce/interactive-recipe-block

★ 0stars
0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/mikeyarce/interactive-recipe-block/archive/refs/heads/main.zip
Readme github.com/mikeyarce/interactive-recipe-block ↗

A modern WordPress recipe block that includes ingredient scaling via the WP Interactivity API.

🚀 Features

  • Interactive ingredient scaling (½×, 1×, 2×, 4×) using the WP Interactivity API
  • Add recipe title, image, description, and notes
  • List ingredients as individual blocks for easy editing
  • 100% block editor (Gutenberg) compatible

🖼 Screenshots

Interactive Recipe Block in the editor

🛠 Installation

  1. Download or clone this repository to your /wp-content/plugins/interactive-recipe-block directory.
  2. Run npm install and npm run build (or npm start for development) in the plugin directory.
  3. Activate the plugin from the WordPress admin Plugins screen.
  4. Add the Interactive Recipe block to any post or page using the block editor.

✨ Usage

  • Add the Interactive Recipe block in the editor.
  • Fill in the recipe info, add ingredients (each as a block), and publish.
  • Readers can use the scaling controls to instantly adjust ingredient amounts for any number of servings.

⚡️ Powered by the WP Interactivity API

This plugin uses the new WordPress Interactivity API for real-time ingredient scaling. No page reloads, no custom JavaScript required—just instant updates for your readers.

💡 Customization

  • Units and ingredient names are freeform text fields for maximum flexibility.
  • The block uses standard markup and CSS for easy theme integration.

🧑‍💻 Contributing

Pull requests and issues are welcome! To contribute:

  1. Fork this repository
  2. Create a new branch for your feature or fix
  3. Make your changes and submit a pull request

📄 License

GPL-2.0-or-later.

Interactive Recipe Block — Modern, interactive recipes for WordPress, made easy.