HTML/RTF pasting

Is there an option, plugin, planned featured, or any hope for being able to paste HTML/RTF into Discourse?

I’m asking – because my community has asked me repeatedly – for the ability to paste content from Google Docs, emails, Word documents, and the like into Discourse’s editor while preserving basic formatting, especially links.

I’m not asking for a WYSIWYG editor. Most of my folks would be perfectly happy with an on-the-fly conversion into Markdown. Or whatever magic accomplishes this most basic of tasks.

Can i haz please?


A specific scenario (with some friendly ranting :innocent: )

The other admin at my community (the director of the organisation) wanted to comment on our forum about an email he received from a mailing list.

  1. He tried copying and pasting the email into Discourse’s editor, but that didn’t preserve the links.
  2. He forwarded the email into Discourse, but that staged a user based on the sender of the original email (who is unrelated to our community). This isn’t what he was trying to do. He deleted this user, which then also deleted the post.

At this point, I noticed what was happening and asked him what he was trying to do. He wrote:

i wanted to share and comment on that but decided it wasn’t worth further time spent on it

I asked him to forward the email to me. I copied and pasted it in Sublime Text. I spaced out the paragraphs and added URLs for the links. I escaped a # which made a hashtag into a heading. I added a space in front of one URL, because that’s the only way to prevent a onebox from unfurling there, which was very confusing in that context. For good measure I made the whole thing a blockquote, by adding > in the beginning of every line, making short work of all this with Sublime Text’s multiple cursors. I then sent him the prepared Markdown, ready for posting.

However, it should take fewer than two people to copy and paste an email into Discourse.

9 Likes

Yeah. That’s a bummer.

The composer does a pretty great job letting you do things like paste or drag and drop images and have the Right Thing happen, but formatted text, not so much.

3 Likes

You can create a plugin using this as an inspiration:

http://euangoddard.github.io/clipboard2markdown/

9 Likes

I don’t mind supporting this provided we can automatically detect this properly.

@alehandrof if you or anyone can create a proof of concept web page that handles pasting with some remapping I would be open to look at this.

2 Likes

Did you check out @falco’s link? It looks like a pretty good start.

2 Likes

Not sure that does any auto detection, the detection part is probably complicated

1 Like

It seems to do a pretty good job of detecting links and even tables.

Copying

Pastes here as

Regions Homepage  |  About Regions  |  Investor Relations  |  Privacy & Security

But pasting it into Paste to Markdown makes it into this:

[Regions Homepage](https://www.regions.com/ "Regions Homepage")  |  [About Regions](https://www.regions.com/about_regions.rf "About Regions")  |  [Investor Relations](http://ir.regions.com/ "Investor Relations")  |  [Privacy & Security](http://www.regions.com/about_regions/privacy_security.rf "Privacy & Security")

Regions Homepage | About Regions | Investor Relations | Privacy & Security

6 Likes

I thought @sam meant detecting whether the clipboard holds RTF content. Alternatively, if it’s not too onerous, run everything through the conversion function when pasting.

Edit: I tried the converter with the actual email I mentioned in the OP. It’s pretty good. It doesn’t distinguish between paragraphs and line breaks, so it spaces some things too widely, but that might be fixable and is not the end of the world. Pasting the result into Discourse resulted in a onebox was still confusing in context. But overall :ok_hand:

If something along these lines was implemented it would be useful if there was (hidden behind the cog) a “paste as a quote” option. Making content into a blockquote in Markdown is onerous for those without text editor habits.

2 Likes

Attaching myself to this topic, hopefully I can be helpful with testing at least! This is very important to the intranet community we’re supporting

I’d like to add another use case to my original one.

I’ve been slowly working to centralize my organization’s communication to our Discourse forum. One of the results is that I’ve been seeing a lot of attached docx and pdf files recently.

It turns out that when our forum members want to post any extensive piece (i.e., more than a couple paragraphs) of text, they draft it first in an external program – generally Word or Google Docs. That seems reasonable. I do the same, except I use a text editor, because I’m a dork.

When the time comes to post their text on the forum, my members discover that there’s no obvious way to copy-paste the text to the site, while preserving formatting. So what they do is post a brief message, such as “Here is my informal report from my attendance to XYZ event” and attach a relevant Word Document or PDF.

As you can imagine, this makes it unlikely that anyone will read what they post.

I can’t be the only person that has to deal with this problem. How do other people deal with it?

3 Likes

Does something like this help?

http://markitdown.medusis.com/

Packaging something like https://github.com/euangoddard/clipboard2markdown into a plugin would be fairly simple if someone wanted to.

4 Likes

Just chiming in to say that we also see a lot of content authored (and discussion take place) in Google Docs that I’d prefer to happen on Discourse.

It’s an interesting, multi-faceted challenge.

5 Likes

Selecting your text and clicking the " button in the editor toolbar in Discourse works pretty nice for prefixing every line with a >

2 Likes

Yes! It’s better than clipboard2markdown which doesn’t handle lists at all well.

I haven’t done enough research to know whether the issue is with clipboard2markdown’s implementation (which is over a year old) or with [domchristie/to-markdown), the JS Markdown converter which does the converting.

I don’t mind collaborative authorship on Google Docs. I actually encourage it over sending messages back-and-forth (in whatever medium). If you’re trying to work on a document with another human, there are only two games in town: Google Docs and Quip. I like Quip, but we can’t afford it. We’re a non-profit organization which works with dozens of volunteers and their $$$/user/month model prices us out. (I’ve told them that, and their response was ¯\_(ツ)_/¯)

So we use Google Docs a lot, but its discussion features are very limited. I encourage discussions about documents in Discourse or email. This works reasonably well.

My original point was how to help people who draft documents in Google Docs (or MS Word or Evernote or whatever) out of a well-founded fear of typing for a long time in a text box. There’s no easy step between that kind of HTML/RTF document and Discourse. This is for single-author texts, not for collaborative editing. But a solution would help out both cases.

D’oh! So it is! That was not the most important part of the rant in my OP, but the advice is well taken. I’ve been telling people to use [quote]…[/quote] for quoting chunks, but it’s better to suggest the built-in solution (which also happens to be correct Markdown).

4 Likes

PR created for https://github.com/discourse/discourse/pull/5395

13 Likes

It is merged. Now when you paste a HTML content it will be converted to Markdown automatically :confetti_ball:. Also it can be a copied text from a Word document.

If you find any issues then reply here with details and support testing.

Let’s start testing.

Find solutions together

Crowdsource a self-service knowledge hub of common questions, interesting ideas, and great conversations.

  • Vote up your favorite ideas
  • Mark solutions as the official answer
  • Assign topics to yourself or others
  • Incoming emails create private ticket topics
  • Collaboratively edit with full revision history

:+1:

15 Likes

Copy and paste of our entire readme on Github:

Discourse Readme

Logo

Discourse is the 100% open source discussion platform built for the next decade of the Internet. Use it as a:

  • mailing list
  • discussion forum
  • long-form chat room
    To learn more about the philosophy and goals of the project, visit discourse.org.

Screenshots

Boing Boing

Mobile

Browse lots more notable Discourse instances.

Development

  1. If you’re brand new to Ruby and Rails, please see Discourse as Your First Rails App or our Discourse Vagrant Developer Guide, which includes a development environment in a virtual machine.

  2. If you’re familiar with how Rails works and are comfortable setting up your own environment, use our Discourse Advanced Developer Guide.

Before you get started, ensure you have the following minimum versions: Ruby 2.3+, PostgreSQL 9.3+, Redis 2.6+. If you’re having trouble, please see our TROUBLESHOOTING GUIDE first!

Setting up Discourse

If you want to set up a Discourse forum for production use, see our Discourse Install Guide.

If you’re looking for business class hosting, see discourse.org/buy.

Requirements

Discourse is built for the next 10 years of the Internet, so our requirements are high:

Browsers
Tablets
Phones
Safari 6.1+
iPad 3+
iOS 8+
Google Chrome 32+
Android 4.3+
Android 4.3+
Internet Explorer 11+
Firefox 27+

Built With

  • Ruby on Rails — Our back end API is a Rails app. It responds to requests RESTfully in JSON.
  • Ember.js — Our front end is an Ember.js app that communicates with the Rails API.
  • PostgreSQL — Our main data store is in Postgres.
  • Redis — We use Redis as a cache and for transient data.
    Plus lots of Ruby Gems, a complete list of which is at /master/Gemfile.

Contributing

Build Status

Discourse is 100% free and open source. We encourage and support an active, healthy community that accepts contributions from the public – including you!

Before contributing to Discourse:

  1. Please read the complete mission statements on discourse.org. Yes we actually believe this stuff; you should too.
  2. Read and sign the Electronic Discourse Forums Contribution License Agreement.
  3. Dig into CONTRIBUTING.MD, which covers submitting bugs, requesting new features, preparing your code for a pull request, etc.
  4. Always strive to collaborate with mutual respect.
  5. Not sure what to work on? We’ve got some ideas.
    We look forward to seeing your pull requests!

Security

We take security very seriously at Discourse; all our code is 100% open source and peer reviewed. Please read our security guide for an overview of security measures in Discourse, or if you wish to report a security issue.

The Discourse Team

The original Discourse code contributors can be found in AUTHORS.MD. For a complete list of the many individuals that contributed to the design and implementation of Discourse, please refer to the official Discourse blog and GitHub’s list of contributors.

Copyright / License

Copyright 2014 - 2017 Civilized Discourse Construction Kit, Inc.

Licensed under the GNU General Public License Version 2.0 (or later); you may not use this work except in compliance with the License. You may obtain a copy of the License in the LICENSE file, or at:

http://www.gnu.org/licenses/old-licenses/gpl-2.0.txt

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an “AS IS” BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

Discourse logo and “Discourse Forum” ®, Civilized Discourse Construction Kit, Inc.

Dedication

Discourse is built with love, Internet style.

Copy and paste of http://bettermotherfuckingwebsite.com

bettermotherfuckingwebsite

This is still a motherfucking website.

And it’s more fucking perfect than the last guy’s.

Seriously, it takes minimal fucking effort to improve this shit.

7 fucking declarations.

That’s how much CSS it took to turn that grotesque pile of shit into this easy-to-read masterpiece. It’s so fucking simple and it still has all the glory of the original perfect-ass website:

  • Shit’s still lightweight and loads fast
  • Still fits on all your shitty screens
  • Still looks the same in all your shitty browsers
  • The motherfucker’s still accessible to every asshole that visits your site
  • Shit’s still legible and gets your fucking point across

And guess what, motherfucker:

You never knew it, but it’s easy to improve readability on your site. Here’s how.

Let it breathe

Look at lines 1 and 2 of some shitty website you’re building. Assuming they’re not married they probably shouldn’t be humping. The defaults are trash – pick a minimum line-height: 1.4 for body copy. Headings should be tighter. If you can’t see that…piss off.

If your text hits the side of the browser, fuck off forever. You ever see a book like that? Yes? What a shitty book.

A little less contrast

Black on white? How often do you see that kind of contrast in real life? Tone it down a bit, asshole. I would’ve even made this site’s background a nice #EEEEEE if I wasn’t so focused on keeping declarations to a lean 7 fucking lines.

Size Matters

I know your partner says otherwise, but it’s true. Bump that body copy to render close to 16px or more. Smaller type works well for print, not the screen.

Line-width, motherfucker

Looking at an LCD screen is strainful enough. Don’t make me read a line of text that’s 200 fucking characters long. Keep it to a nice 60-80 and users might actually read more than one sentence of your worthless dribble.

Yes, this is also fucking satire, you fuck

I love what the creator of this site’s inspiration did. What I’m saying is that it’s so, so simple to make sites easier to read. Websites are broken by default, they are functional, high-performing, and accessible, but they’re also fucking ugly. You and all the other web designers out there need to make them not total shit.

“You’re a fucking moron if you use default browser styles.”

  • Eleanor Roosevelt

Epilogue

Inspired by the geniuses behind motherfuckingwebsite.com and txti.

This page—that isn’t a total fucking eyesore—was created by me with help from him.

OMG this is so cool!

13 Likes

Why isn’t this a table?

1 Like

I believe our html_to_markdown library predates markdown table support (markdown-it), so it doesn’t handle it yet.

5 Likes
From Codepen render window
Name Age Weight (kg) Profession
Carolina Biggleswade 23 65 Jockey
Harry Sparrowhead 34 89 Trainer
Marjorie Doors 32 76 Yard Manager
Earnest Piggington-Smithe 18 98 Groom

:clap::clap::clap: