The new Editor

habryka

58 The new Editor

by habryka

23rd Sep 2020

1 min read

58

Look

this

glorious

table

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:

Insert tables! A heavily requested feature.
Copy-paste LaTeX without everything breaking!
Nest bullet lists and other block elements in blockquotes! (still no nested blockquotes though, though if enough people want that, it would be easy to change)
Image Uploads! (Just drag-and-drop images into the editor, and things should work out naturally. You can also copy-paste, though beware that copy-pasting from other websites means we link to the copies of those images from other websites, and won't reupload them.)
Much less jankyness and brokenness!

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.

Site Meta

Frontpage

58

New Comment

24 comments, sorted by

top scoring

Click to highlight new comments since: Today at 11:07 PM

[-]Adam Zerner4y60

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

Type.
Delete everything you've typed. The placeholder text will appear.
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.

[-]habryka4y20

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.

[-]Adam Zerner4y20

Awesome!

[-]ozziegooen4y40

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.

[-]habryka4y40

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.

[-]ozziegooen4y20

Good to know, thanks!

[-]NunoSempere4y10

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.

[-]habryka4y20

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

[-]Joe Rocca3y10

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:

https://www.lesswrong.com/graphiql

[-]habryka3y20

Should be part of the contents field:

{
  post(input: {selector: {slug: "the-new-editor"}}) {
		result {
      contents {
        markdown
      }
    }
  }
}

[-]Joe Rocca3y10

Ah, thanks!

[-]Maxwell Peterson4y30

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.

[-]lsusr4y30

Is it possible to insert tables via the Markdown editor?

[-]Rafael Harth4y60

!	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.

[-]Dagon4y20

Awesome! Would it be possible to put an easy link to https://www.markdownguide.org/cheat-sheet/ or some other reminder of syntax somewhere easy-to-find while actually entering/editing comments?

[-]habryka4y20

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).

[-]Adam Zerner4y20

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

[-]Raemon4y40

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)

[-]Adam Zerner4y40

I didn't realize that you can copy-paste images. Whoops! In this comment I initially got a link for the image because I didn't know you could copy-paste.

[-]riceissa4y20

I just tried doing this in a post, 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.)

[-]Raemon4y20

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.

[-]riceissa4y20

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

[-]gilch4y20

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.

[-]habryka4y20

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.

Moderation Log