Can contentitem edit add H5 editor such as GrapesJS Preset Webpage?

[mmdqq]

https://grapesjs.com/demo.html

[sebastienros]

It's really not clear what you are asking. Can you try to rephrase, or show what your issue is?

[jptissot]

I think he wants to have a GrapesJSBodyPart that would allow someone to use GrapesJS to edit content for a page. https://grapesjs.com/demo.html

I assume that this would be an alternative to the HtmlBodyPart and we could potentially store the Grape template in the Part settings so someone that creates a new ContentItem would get the template from settings but would be free to edit in any way they want.

[aghili371]

it looks really nice, it will perfect to have a visual content design. or have a new module for an email newsletter.

[Skrypt]

For email templates I think we can use Liquid. Though we should have admin shapes that can be overridable for most common email that are sent by the CMS. Example : the reset password email. But I'm getting off topic here so... GrapeJS should be a contrib module and I think we should work on the Flow module to make it better since that's what we ship with OC. Wordpress relies a lot of third party components / contrib modules to achieve this. Maybe that's why people are suggesting those kind of editors. Is the Flow module that bad?

[jptissot]

Flow module is not that bad, just needs improvement like you mention. Is this similar to what the layout module was doing in O1?

[ksjdesign]

@Skrypt & @jptissot, sorry but yes, I’ve talked to more than one content editor/author, about making a system using Orchard CMS, they all say please don’t, for exactly that reason - the content editor experience is not good enough. The way it flows is just not good enough. So YES, there is definitely need for something like GrapesJS - if you want it as a 3. party module, cool - but why spend so much time on an already deprecated "flow module”, that most people probably would not like anyways. Do a pole or something to see what people would like the most. I’ll bet you they like a great user experience with an editor like Mailchimp has – even the new build in Wordpress editor would be better. And using the Liquid for email templates – sure, if you want fewer people to use the template function, or have a way steeper learning curve for new editors. Look at Mailchimp (editing part) – everybody knowns how to use it after 5 minutes with it. It’s intuitive – so either build your own builder for liquid as easy to use or think about using something like GrapesJS for the editing. Seen and heard @sebastienros talk about Wordpress – they have also switched to a more builder style editor. So, to sum up – spend time on a better solution then “flow module” – it’s just not cutting it – sorry to be so honest – I’m just a bit sad that all this great work your have done, doesn’t come with that “nice new car smell”. You could have implemented a mostly working website builder like and spend your time making contributing to make one of them better, then reinventing the wheel in a square design – hope I’m not to harsh here… There are plenty to choose from just to name a few: • GrapesJS - https://grapesjs.com/ • PaperBits - https://paperbits.io/ • Sir Trevor - http://madebymany.github.io/sir-trevor-js/

My 2 minut rambling – done for now.

[hishamco]

@mmdqq thanks so much for sharing this, as @Skrypt suggested earlier this could be a community driven project, also we may need to improve the FlowPart and many design aspects such as accessibility & usability as much as we can

Thanks

[Skrypt]

@ksjdesign Orchard Core is open source MIT, so you can do wathever you want with it. Why are you rambling with the FlowPart if it doesn't suit your needs then implement a GrapeJS editor on top of OC ... if that's what matters to you. The FlowPart will always stay the default editor in OC and will also be enhanced over time. But I think, using a server side type editor was a good choice because inline editors implementations can become quite messed up over time. If you want to let your content editors to be able to edit their content inline then why not leaving them the choice to edit their HTML directly in a visual HTML editor which could also understand Liquid ...

I mean, here these are just opinions and everyone has one. We can't make everyone happy, that's your own responsibility to make yourself "happy" in this OC context by maybe contributing and showing solutions instead of "rambling". We can't have time to do all the modules for your guys, we do this for free 😉

[mohsinxmushtaq]

I have tried to integrate GrapeJs as a html content type editor it is not a lot of work, but something seems not right, cause when the editor is rendered in browser some of the span tags and div tags are commented, I tried to render it in a custom module admin page but the result was same.

Any help will be amazing

[MichaelPetrinolis]

The issue is with fontawesome 5. GrapeJS does not support svg icons

[mohsinxmushtaq]

The issue is with fontawesome 5. GrapeJS does not support svg icons

Thank you so much for this, I was able to run GrapeJs. Disabled auto svg translation

<script type="text/javascript" at="Head"> // Notice how this gets configured before we load Font Awesome window.FontAwesomeConfig = { autoReplaceSvg: false } </script>

OR updated it will just add the SVG inside the the i tag and i have added a style for chevron because it adds an extra padding to the top

`

`

[hishamco]

@mohsinxmushtaq if you are interested in what you did, I encourage you to add this feature into OCC community project. This is be a nice feature