WYSIWYG WordPress comments?

The comments field on this here blog feels Very Nineties, what with making you type in HTML by hand, like an animal. Is there some plugin that isn't a massive security hole that gives you a bold/italic/link toolbar and such?

This is hard to search for, as the WordPress plugin space is polluted with rentiers and data brokers who want to help you move your comments off of your computer and onto theirs.

If you're going to suggest TinyMCE, you probably shouldn't. All I know about it is that URLs with that name in them are frequent targets of botnet probes here, and that strongly suggests that it does not have a security track record that one would consider stellar.

I see that at some point in the past decade or two, HTML got a contenteditable attribute that you can tack onto any old element, which I find honestly shocking! And that page contains "Example: A simple but complete rich text editor" in 152 lines of code. Should I just use that? It seems to work kind of poorly on iOS, but it does work... And here's another one.

I'd rather just install something that build my own out of constituent parts, though. Unless that would be insecure, or have a list of frameworks and package managers as long as my arm (as is the fashion these days).

Note that I am talking about editing comments, not posts (the thing that you are typing into right now, not the thing that I am typing into right now.)

Update: I got it working with Trix. It was a lot more work than I would have hoped! It seems like a very good editor (and they did the cross-platform work, which is no small feat) but the documentation is nearly nonexistent. Take a look at trixcomments.js to see the brain surgery I had to do on it just to get it to allow you to embed an IMG or YouTube video.

Also, here's a fun one: it uses embedded SVG icons for the buttons, which is cool, but they are black-on-transparent. Guess how you turn such an SVG into green-on-transparent in CSS. Because I asked the question, you already have the sinking feeling that it's not the "color" property. Nope, it is:

    "filter: invert(68%) sepia(36%) saturate(6175%) hue-rotate(79deg) brightness(115%) contrast(128%)"

Anyway, let me know if you notice any problems.

Update 2: I packaged this up into a WordPress plugin, "WYSIWYG Comments Trix", so now you can use it too.

Previously, previously, previously.

Tags: , , ,


Sarah Sitkin:

Previously, previously, previously, previously, previously, previously, previously, previously, previously, previously.

Tags: , , , , ,

  • Previously