WP Manifestindependent plugin directory
manifest / editor / excalidraw-block

Excalidraw Block

A Gutenberg block that embeds Excalidraw in the editor, and outputs an SVG on the frontend.

by You · github.com/jameswlepage/excalidraw-block

★ 5stars

Install

Download source zip No release zip yet

This is the repository archive. It installs, but the folder name will carry the branch suffix and updates will not flow.

Install straight from GitHub with WP-CLI:

wp plugin install https://github.com/jameswlepage/excalidraw-block/archive/refs/heads/main.zip
No built-in updater. New versions won't appear under Dashboard → Updates. Install new releases yourself, or let Git Updater track the repository.
Readme github.com/jameswlepage/excalidraw-block ↗

Overview

The Excalidraw Block is a custom WordPress block that allows users to embed an Excalidraw editor directly into the post editor. This block provides a seamless way to create and edit diagrams within WordPress.

Features

  • Embed Excalidraw editor in WordPress posts.
  • Save and export diagrams as SVG.
  • Customize aspect ratio and border settings.
  • Add captions and alt text for accessibility.

Installation

  1. Clone the repository.
  2. Navigate to the project directory.
  3. Run npm install to install dependencies.
  4. Build the project using npm run build.

Usage

  • Add the Excalidraw Block to your post from the block editor.
  • Use the editor to create and modify diagrams.
  • Save your changes to embed the diagram in your post.

Development

  • The block is developed using React and WordPress block editor components.
  • Styles are defined in style.scss and editor.scss.
  • The editing interface is implemented in edit.js.
  • The saving logic is handled in save.js.
  • The block is registered in index.js.

License

This project is licensed under the MIT License.

Contributing

Contributions are welcome! Please open an issue or submit a pull request.

Contact

For questions or support, please contact James LePage at gh@j.cv.