WYSIWYG editor - really not available?

I absolutely love grav and everything about it - but is there really not a WYSIWYG editor available?

My customers can’t use markdown. It’s just too technical. They’ve never used it before, and don’t want to use it, no matter whether I like it. For instance, if I answered the question of “How do I put a picture of my cat in my page”, I cannot answer with “Just type <img src=”{{ page.media[‘mycat.jpg’].url }}"">.

We put 4-5 websites live every week, and we’re so keen to find a flat-file CMS that can give them WYSIWYG! Please let me know if there’s any way of implementing one, and please don’t respond with “WYSIWYG is awful”. I know that.

Thank you.

The admin plugin has a psuedo-WYSIWYG setup, in that it is an interactive Markdown editor. I agree that WYSIWYG is not awful, as it in almost all cases is a requirement for end-users, but you could consider other routes of achieving the same result:

  • Markdown has many popular editors, wherein the difference between WYSIWYG and Markdown blend quite well. I would recommend StackEdit or DraftIn for their ease-of-use and extensive feature-set.
  • Let end-users write using a common interface, like Word, and then convert this as automatically as possible. I use this to allow writers who are likely not interested in learning Markdown to write what they want, then I convert it with Pandoc. One line of code will turn a .docx file into a .md file in its own folder with related images. I write the FrontMatter myself, as I would have to proofread that regardless.

Admin Pro will have a WYSIWYG editor.

A lot of its features are for agencies / individuals handing the site to clients to manage. Like white label / UI / logo customization, the ability to use a more user-friendly editor, and more.

Is the Admin Pro plugin still on target to release first half of this year? We love Grav but have the same issue with our clients. The more I hear about what you are putting in to the Admin Pro, the better it sounds!

We’ve been focusing on Grav 1.1 (beta available) for the past couple of months as there were things we needed in the core in order to complete the Admin Pro plugin. Now that is getting close to being released, we’re turning our attention back to Admin Pro.

I will point out though that Markdown is not technical nor complicated. It’s very simple, in fact most people (even non-technical people) get comfortable very quickly. On top of that, our editor has buttons, so you don’t actually have to know markdown to use it, just select the text, click bold or link, and fill it in. It handles injecting the syntax for you. It’s very simple because you can only do a few things with it, which is great for your end users because there is less chance for them to screw things up :slight_smile:

I achieved something similar for a client by showing them how to drag and drop images in admin and then having a separate PAGE SETTINGS tab (via blueprint) in the admin where they could specify just the image name (no extension, just had to know the name) as well as some details for the item they were creating. You can see the end result in the events section of this page: https://intothelightus.org/#events

Ultimately I had to code what I wanted done with those elements, but it was easier than trying to introduce someone to markdown that was only going to make periodic updates. If you were building a blog for someone, you could have a place to specify the hero image, a title input (that formats as H1), a tagline (that may be an H3 italicized) and then body text (specified in the admin markdown section). This to me may preserve the design from page to page, post to post and eliminates some of the learning curve for your clients.

You can repleace markdown editor with wysiwyg editor - it’s very simple. You can check my markdown.html.twig file (/user/plugins/admin/themes/grav/templates/forms/fields/markdown/) here. It’s dirty but works like a charm :wink: I have used Trumbowyg WYSIWYG editor there.
Sorry for my english :wink:

I recently discovered flat file CMS and actually find them interesting especially no database for the content. What most of them lack is an administration panel, even as a front-end developer I don’t want to be disturbed with Markdown and organizing files manually for writing my content and I don’t care about it. Just as with a database driven CMS I don’t want to care about how the database works and it stores it’s data, I don’t manually add content in the database, it just sits their and if their are no problems I never look at it.

I checked the plans for the Admin Pro, I think it really is going to have good features but most of them should be in a free version. I think their are essential features for a user friendly admin and a good CMS. Why would I choose a flat file CMS if I and my end user have to use Markdown? I know it is not difficult, but I and end users don’t like to be disturbed by confusing markup with hashes, stars, underscores etc, it looks confusing. Just show them as headers, bold, italic etc. without the actual Markdown.

It would make Grav unique and really strong competitor to both flat-file and database driven CMS if they implement most of the planned Admin Pro features in the standard admin panel. Only flat file system that i found with a WYSIWYG editor is Get Simple CMS, but I think Grav is more flexible. Blend Markdown together with a WYSIWYG, combine the strong features of both them: be able to preserve design on pages but with a user friendly editor. I actually don’t understand the target audience of most flat file systems, I think they’re rather useless in use cases where you work with non-tech clients or tech users like me that don’t want to care about Markdown or HTML code in my content.
Well, just my opinion.

I fully agree. Markdown for clients - no way. They just do not want to hear about “oh, it’s not like Word?” This is our new reality - Content block should be editable with WYSIWYG and INLINE. Basta.

I totally agree, even a technical person prefers to work with something that looks to a normal clean Word document with a simple set of buttons and WYSIWYG, a secretary or a SMB owner will not accept anything else.

The reasoning behind this is that the target user base of Grav is not the untechnical user, but a bit more advanced user that in Grav can find ease of use, flexibility while also getting lots of power in pre-built solutions for common needs. In fact, Admin is just a plugin and many do not even use it. I don’t for example, on most of my sites.

Most of you are in this group. We (very) rarely heard of users that cannot write a page because of Markdown.

If you are builting a site because it’s your job or you are going to maintain the site but someone else is going to write the article, you can either instruct them on the Markdown syntax (and show them how the buttons on top of the editor actually work), use a Word-to-markdown plugin, like http://www.writage.com/, or install Admin Pro on their site when it’s available.

In this way you get the more user-friendly WYSIWYG editor and you make your client happy, and in turn with a very small fee you help fuel the Grav de velopment.

Remembering that Grav is open source, and you can still build your own lightweight Admin panel for end users, or Medium-like frontend editing (which is something I’d like to have too).

The Medium-like frontend editing would be awesome for client sites. If I had the time and skill, I would do that.

Would be great, is there is an integrated WYSIWIG editor for tables. Or is there any external solution available for creating more complex markup content?

@all Since WYSIWYG looks like a required and most wanted feature we may can do it this way. First of all, I have to talk to @rhukster and @flaviocopes about the future plans of Grav and of course Admin Pro and how to build a an ecosystem, which ensures and supports the on-going development of Grav. After that we may consider integrating some “easy” WYISWG like https://github.com/yabwe/medium-editor directly into the free version of Grav admin or provide an extra plugin, hooking into admin panel.

However @rhukster is on vaca atm and I for some days off. Also everything is hypothetical. If we have anything new, we let you know.

Yes, I am on vacation for another few weeks, but checking in and keeping up to date with most stuff.

I do want to point out a few ‘gotchas’ regarding WYSIWYG editors though so you can understand that this is not a totally trivial problem:

  1. Option 1 - All standard WYSIWG editors that you know and love, load and save HTML. They have no understanding at all of markdown, so if you go this route, you are only able to create HTML style content. This means you wont be able to use any of the powerful markdown-based image and linking capabilities, nor the media manipulations that Grav offers. Also any markdown specific plugins would of course not work with these.

  2. Option 2 - There are a very few WYSIWYG editors that can save markdown and/or HTML, however, from our testing these are often very destructive in that they remove anything they don’t understand. This means you could easily lose parts of your content, and we would have very little control over that and no way to even warn the user what would be lost.

We plan on going with option 2, but we want to be smart ab out picking the exact solution we use within the Pro version of the admin. Because this is something that is typically used by ‘clients’ and those clients paid a ‘professional’ to create the site, having them factor in the small cost of a pro admin plugin should not be a big deal. And we do need to find a way to help fund the development of Grav, or there will be no Grav in the future.

However, there is a stop-gap option of creating a small ‘editor’ plugin that is able to provide a limited set of functionality even if it’s not fully capable, using option 1. The problem is, that if it’s included in the admin, people suddenly expect it to support everything that Grav offers. This is simply not possible for the reasons i stated above in option 1.

Whilst there is a clear argument for wanting a full-fledged WYSIWYG editor in Grav admin, this always involves some reinventing of the wheel. Arguably, and in my opinion, plugging into the Grav ecosystem through a third-party editor solves this more elegantly than developing a new editor. Several of the popular online-editors allow webhooks or REST api integrations.

On the other hand, people do seem to expect a product which includes a full-fledged editor. The desire seems to be a want of reducing the necessary steps between writers and editors. With the current admin plugin, and the coming update to it, it seems the biggest “problem” is that - like most Markdown editors - markup is visible. The switch between “Full WYSIWYG” and the more “Hybrid WYSIWYM” (What You See Is What You Mean) is only that formatting remains visible.

Most Markdown-approaches follow the latter, sometimes to teach end-users to not rely on Full WYSIWYG and also because of the clarity it offers end-users. However, a switch to hide formatting (for “Zen writing” or the like) and rely more on Word -style formatting through selecting and shortcuts does not seem all that difficult to integrate even to the most basic Hybrid WYSIWYM editors. In Grav Admin, editing in the preview-mode would seemingly solve this, as switching back to editor-mode to review formatting remains in place - “just” allow editing without visible formatting.

Actually this is something I’ve also considered as Pen Markdown Editor has a view that actually just uses CSS to hide the markdown bits and makes it look like a WYSIWYG even though it’s actually just regular markdown with certain bits not visible.

It seems like a “simple” solution to achieve the feel that especially end-users are expecting, and could be toggled on-off very simply. As long as you can still write formatting and use shortcuts, the end user experience would be the same - but with the scary Markdown hidden from immediate view. I quite like the full-page view of the current Admin editor, with this tweak it could easily replace my love for WriteMonkey and other “Zen” writers.

Actually “Pen” is not quite doing what I thought it was. It’s actually ‘adding’ the markdown via CSS to contenteditable HTML tags. Unfortunately this probably won’t be a workable solution either as it still relies on JS to convert HTML -> Markdown.

I was actually just about to post a question just like this. Just like you, I wanted to introduce this CMS to my clients but writing markdown just isn’t an option for them.

I have been searching around for some JS components that could be introduced via a plugin, and I only really found a single one.


This has a nice visual editor that composes to markdown, however I feel like this editor could be rewritten with ES6 as the new admin plugin uses that. I am starting to think I would have to write my own wysiwyg to markdown editor…