Jump to content

Visual page builder without repeaters


Marc
 Share

Recommended Posts

I like repeaters for structuring data. For building a layout, not so much. I've seen the demo's on this forum of people using repeaters in creative ways to build a layout, but it never looks very intuitive to me. I've grown to dislike this approach so I've been looking at other content management systems for inspiration. Bolt CMS uses Article Editor, which is a nice (paid) javascript solution that's basically an advanced wysiwyg editor with support for grids and other nice features. I decided to integrate this into Processwire as an inputfield. Here's a demo:

I created a few plugins for Article Editor that take care of uploaded images, inserting links and Hanna code support for adding dynamic bits to the editor. And the field also works in repeaters. You can pass your CSS to the editor so that the editor preview should look identical to the real page. I am using Bootstrap.

A bonus of building a page this way is that the whole layout is stored in a single field so there should be fewer requests to the database compared to repeaters.

Please note that since Article Editor is not free, you need a license to use it.

I've been working on this module on and off for a while. There are refinements to be made, like perhaps loading the Hanna code previews dynamically (they are currently inserted into the editor after saving the page). Not sure if it would be good enough to release publicly but I thought I'd share it anyway because I'd like to hear if you think this is a nice approach :)

  • Like 17
Link to comment
Share on other sites

On 7/19/2022 at 3:47 PM, bernhard said:

How would that concept work with multiple languages?

I haven't given that any thought but I guess it would not be pretty. You'd have to maintain the layout for all languages. You can go to the source tab of the editor and copy/paste it to the other languages so you could take it from there.

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...