Inline Editing: Do any tools exist for this?

Ecosystem
1

Hi there!

Sorry if this was already answered, but I was wondering if someone has made a tool / JS plugin that allows for editing content inline on the site itself instead of inside the Contentful Web App?

Something where you can turn inline editing on, click on elements that are tagged in a way so Contentful knows what to update, and after making your changes, publishes the updated entry.

Hope someone knows more. Thanks in advance. :slight_smile:

2

Hi @lichine,

Yes, that is indeed possible, while not particularly easy. In theory it would work something like this:

  • HTML elements that are editable by the user, should have the parameter contenteditable="true".
  • Each editable HTML element should have a corresponding field in a Contentful content model.
  • Whenever an editable element’s content is modified, a binded JavaScript event should fire and update the content of a corresponding field via the Management API.

I made a working prototype of something similar with Aloha editor few years ago. My prototype was not connected to Contentful, but the general principle is very similar.

3

Hi @lichine,

There’s a 2 year old hackathon project that we made called the Contentful Gazette which shows a way to do what you mention.

There’s also a blog post called Dynamic static sites - Implementing an oxymoron that shows how to do this with a Gatsby powered blog site.

Hope this helps!