Make Contributing Easier for your Markdown Based Website with a WYSIWYG editor

This guide shows how you can use Holocron to let contributors suggest edits to your Markdown based website (like Docusaurus or Nextra) using an easy to use WYSIWYG editor.
profile photo
Tommy
This guide shows how you can use Holocron to let contributors suggest edits to your Markdown based website using an easy to use WYSIWYG editor.

Example workflow from a contributor point of view

In the video below you can see how a website visitor can start contributing to your Markdown docs just by clicking a button.

What is Holocron?

Holocron is a visual Markdown editor that syncs with Github in real time and has real time collaboration built in. It also supports MDX so you can use it for docs website generators like Docusaurus and Nextra.

Adding an “edit this page” link to your website

Holocron works with any public Github Repository on an url like this:
For example here is a link to edit my Genql repository docs: https://holocron.so/github/pr/remorses/genql/master/editor/website/src/pages/docs/index.mdx
After making the edits the user can click the "Create PR on Github" button to automatically fork, create a branch and create commit and PR, all in one click.

Example: adding an “edit this page” to Docusaurus

To redirect to Holocron when an user clicks the “edit this page” link in a Docusaurus based docs website you can simply override the editUrl option.
Here’s an example PR that adds Holocron support in a Docusaurus website
Image without caption

Holocron creates a PR on your Github Repository

After the user clicks the “Create PR on Github” he will be prompted to connect his GitHub account. Then Holocron will create a PR. The PR will look like this:
Image without caption

Making edits to a PR with Holocron

Holocron will add a link in the PR description to let maintainers make edits to the current PR in the WYSIWYG editor. This makes it much easier to review and apply any fixes needed to merge the PR without having to open the repo in a code editor application.

Holocron is much more

The steps in this article lets any user contribute to an open source repository but Holocron is much more.
You can connect a private repo and update the files in real time with GitHub thanks to CRDTs, you just need to install the Holocron GitHub application. This removes the need to create PRs and lets you keep all your documentation in sync between all contributors, forgetting about conflicts and git.
Holocron is mainly designed to make it easier for non-technical team members to contribute and write content in Markdown (and MDX).
To get started with this approach just go to holocron.so and conect your repo.
Related posts
post image
How to make Next.js plugins work with Turbopack, the new Next.js --turbo option. No need to rewrite them in Rust!
post image
In this post i will show some tricks to decrease your Next.js functions cold starts
post image
A list of my favourite Framer templates for landing page websites, free and paid. For digital businesses and startups.
Powered by Notaku