editor.js icon indicating copy to clipboard operation
editor.js copied to clipboard

Support horizontal mode and right side toolbar

Open sielay opened this issue 7 months ago • 2 comments

We have two cases that may be replicable:

  • We need to show the toolbar over the block on the right, to manage the space in the editor better
  • We need to show editor as a list of horizontal blocks

sielay avatar Jul 01 '25 17:07 sielay

Thanks for the PR. I'll check it.

We need to show editor as a list of horizontal blocks

This can be implemented outside the editor. I don't think that it is a production ready solution at the moment

image

neSpecc avatar Jul 07 '25 21:07 neSpecc

Thanks

Let me provide some context before addressing your points. We are rebuilding our quite bespoke CMS, and we found EditorJS most suitable to our needs: a clear and simple API, easy to extend, and lightweight.

What we do is we have a remote repository of blocks and leverage the pattern when a block can embed another EditorJS instance. Our repository provides us with blocks that can be used inside a given block type. This way, I can give various editing experiences for quite complex content types and have a reusable core.

One of the experiences requires building a horizontal list of sections. This can be achieved by a block that's nesting a horizontal EditorJS instance:

Screenshot 2025-07-08 at 09 05 33
  1. This can be implemented outside the editor
  • I tried to achieve that with CSS wrappers. That was quite messy, as I have to change styles for Redactor often, but in a way that affects only a specific level of editors.
  • Adding specific flags makes that cleaner.
  1. Not production-ready
  • I agree the demo isn't, but the feature so far works pretty well for me.
  • I will let you know when I have finalised the code using that and if I require any more tweaks. Please let me know how you envision the code aligning with your standards.

sielay avatar Jul 08 '25 08:07 sielay