The new Editor

post by habryka (habryka4) · 2020-09-23T02:25:53.914Z · LW · GW · 24 comments

Celebrations! The new editor is finally here! 

Starting from today, all desktop users will by-default use the new visual editor that we've been testing for a while. While the primary goal of this is to have a better foundation on which to build future editor features, here are a number of things you can do starting from today: 

Let us know what you think about the new editor. We've been testing it for a while and have been pretty happy with it (and users who had opted into beta features also had predominantly positive feedback). You can also use the old editor if you run into any problems by checking the "Restore the previous WYSIWYG editor" checkbox in your user settings.


Comments sorted by top scores.

comment by adamzerner · 2020-09-23T19:50:12.790Z · LW(p) · GW(p)

There's a small bug I've noticed. Steps to reproduce:

  1. Type.
  2. Delete everything you've typed. The placeholder text will appear.
  3. Type again. The new text will overlap with the placeholder text for a few seconds.

Here's what it looks like when the text overlaps the placeholder text:

In the past I think I recall it taking longer than a few seconds for the overlap to go away.

Replies from: habryka4
comment by habryka (habryka4) · 2020-09-23T23:36:15.804Z · LW(p) · GW(p)

Yeah, I also noticed this. Should be easy to fix. The previous placeholder text implementation was a hack to deal with the old editor, but the new editor actually allows us to do this much more elegantly, so I will see when I get around to fixing this.

Replies from: adamzerner
comment by adamzerner · 2020-09-24T01:10:40.407Z · LW(p) · GW(p)


comment by ozziegooen · 2020-09-23T18:18:37.210Z · LW(p) · GW(p)

I'm excited to see this, and have been enjoying using it.

I'm curious though; is it interoperable with other methods, or are there any projects on the horizon to convert this to Markdown if needed? I would like to have backups or possibly later post some of my LW content to other platforms.

I realize that probably couldn't keep all the functionality (no fully isomorphic translation), but even some of it could be handy.

Replies from: habryka4, Radamantis
comment by habryka (habryka4) · 2020-09-23T22:51:52.816Z · LW(p) · GW(p)

Yep, we have markdown translation for all documents, and it should be basically fully interoperable (LaTeX is a bit janky, but I think everything else should work). 

You can get it either via the API, or you can activate the markdown editor in your user profile, and then edit any post that you edited in a non-markdown format. It will offer you to display the content in Markdown instead. 

Replies from: ozziegooen
comment by ozziegooen · 2020-09-24T09:09:50.499Z · LW(p) · GW(p)

Good to know, thanks!

comment by NunoSempere (Radamantis) · 2020-09-24T17:57:13.469Z · LW(p) · GW(p)

For a hackier approach, you can also feed html (which you can get from the graphQL API) to a utility like pandoc in order to obtain the markdown.

Replies from: habryka4
comment by habryka (habryka4) · 2020-09-24T19:57:51.229Z · LW(p) · GW(p)

We do directly expose a markdown export via the graphQL API, so that sure would be a sad roundtrip :P

Replies from: joseph-rocca
comment by Joe Rocca (joseph-rocca) · 2022-01-13T18:32:03.047Z · LW(p) · GW(p)

A markdown version of the body doesn't to be in any of the possible fields of the `Post` type. Am I looking in the wrong place? I'm using this:

Replies from: habryka4
comment by habryka (habryka4) · 2022-01-14T19:09:46.718Z · LW(p) · GW(p)

Should be part of the contents field: 

  post(input: {selector: {slug: "the-new-editor"}}) {
		result {
      contents {
Replies from: joseph-rocca
comment by Joe Rocca (joseph-rocca) · 2022-01-15T08:39:30.663Z · LW(p) · GW(p)

Ah, thanks!

comment by Maxwell Peterson (maxwell-peterson) · 2020-11-16T06:59:54.376Z · LW(p) · GW(p)

Love it. Never tried the old editor, but had tried writing posts a couple times in the past, on other sites. I'd always get stuck screwing with the editor settings and trying to figure it out, or losing my work, or whatever. This current LW editor makes it so easy that I finally finished a post (and then two more)! The editor isn't the whole reason for that, but it's definitely a factor.  

comment by lsusr · 2020-09-23T09:26:46.733Z · LW(p) · GW(p)

Is it possible to insert tables via the Markdown editor?

Replies from: sil-ver
comment by Rafael Harth (sil-ver) · 2020-09-23T12:44:52.903Z · LW(p) · GW(p)
! Yes !
it certainly is

Syntax guide here. Alternatively, click on 'FAQ' in the left panel and CTRL+F for 'Markdown'; that's how I found it.

comment by Dagon · 2020-09-24T18:24:36.953Z · LW(p) · GW(p)

Awesome!  Would it be possible to put an easy link to or some other reminder of syntax somewhere easy-to-find while actually entering/editing comments?  

Replies from: habryka4
comment by habryka (habryka4) · 2020-09-24T19:58:53.919Z · LW(p) · GW(p)

Yeah, I agree we should add that somewhere. But don't want to clutter up the new-comment form. But I think we can make something work (currently the bottom left corner is basically completely empty, so seems like a cheap option). 

comment by adamzerner · 2020-09-23T19:52:21.990Z · LW(p) · GW(p)

Embedding screenshots would be really cool as a future feature IMO.

Replies from: Raemon
comment by Raemon · 2020-09-23T20:31:20.767Z · LW(p) · GW(p)

Could you go into more of what you mean by this? (You can copy-paste images directly into the editor, and I'm not sure what else you would mean by screenshots)

Replies from: adamzerner, riceissa, gilch
comment by adamzerner · 2020-09-23T21:14:31.198Z · LW(p) · GW(p)

I didn't realize that you can copy-paste images. Whoops! In this comment [LW(p) · GW(p)] I initially got a link for the image because I didn't know you could copy-paste.

comment by riceissa · 2021-01-19T02:13:14.799Z · LW(p) · GW(p)

I just tried doing this in a post [LW · GW], and while the images look fine in the editor, they come out huge once the post is published. Any ideas on what I can do to fix this? (I don't see any option in the editor to resize the images, and I'm scared of converting the post to markdown.)

Replies from: Raemon
comment by Raemon · 2021-01-19T03:15:43.492Z · LW(p) · GW(p)

I just fixed some of them (left a couple more for you to fiddle around with). This is pretty silly and we should fix it at some point, but the issue is that until you've manually fiddled with the size of the images slightly, they default to max-size.

You can resize them by click the corner of the image and dragging.

Replies from: riceissa
comment by riceissa · 2021-01-19T03:37:35.909Z · LW(p) · GW(p)

Thanks, that worked and I was able to fix the rest of the images.

comment by gilch · 2020-09-23T23:13:20.818Z · LW(p) · GW(p)

LessWrong will host our images now? How do we add images using markdown? It didn't work when I tried drag and drop or pasting.

Replies from: habryka4
comment by habryka (habryka4) · 2020-09-23T23:34:15.982Z · LW(p) · GW(p)

Yeah, sorry, the image uploader is currently connected to the WYSIWYG editor, so for markdown you still have to host them somewhere else. The markdown editor is currently really a very minimal HTML textfield with nothing fancy happening, so it's not super obvious how to make image-upload work without a bunch of additional work.