I like to use markdown languages like GitHub markdown and ASCIIDoc to provide lightweight formatting to text documents. The tags in HTML are too heavy and render the original text almost unreadable.
The problem is when I send documents to other users. They can't be bothered with installing a markdown plugin. I would like to use a markdown flavor that will render predictably in web browsers. That way I can send a URL for my document and the recipient will see the formatted text.
Is there a standard markdown language built into Firefox?
Thanks,
(PS: this is a serious question. Pedants please restrain yourselves.)
Unfortunately, at the moment, there are no major web browsers that natively support parsing and rendering markdown.
However, there are a few solutions.
Render the markdown to html and send the html document. Most renderers automatically include Stylesheets that make the html look good, or you can edit the output or templates yourself.
Get the recepent to install a extension that will render the markdown. I quickly found something by googling firefox markdown extension.
I hope this solved your problem.
Related
I'm writing a post for my Github-hosted site. I'm writing to my-first-post.md.
I have Javascript in script tags, CSS in style tags, and HTML in divs and spans.
When I paste the code in the .md and run jekyll serve thru Ruby, all I get is a page with the raw HTML.
What am I doing wrong?
"HTML is a publishing format; Markdown is a writing format." --daringfireball
Markdown is supposed to be simple.
You shouldn't be putting javascript into markdown unless you have a good reason to be doing so and even then I don't think every markdown converter will process javascript.
Ideally, your markdown should be confined to this list and maybe some simple HTML.
Any CSS or javascript should be included as part of your theme.
Edit, explaining jekyll filestructure:
So your Jekyll site should have a file structure that looks something like this. In very broad terms, your CSS and javascript should be in the default.html file located in the _layouts folder. You'll probably notice that the file appears to be a regular HTML file, more or less. The blog post--which is the markdown after it has been converted to HTML--will insert itself into the layout at the {{ content }} tag.
Also, the CSS and javascript doesn't have to be in default.html. It can also be in external files that you link to from default.html
Use MDX. It can do a lot. But if you want to use something more appropriate for the task at hand, I'd suggest looking into Astro . You can find more on these websites. For astro you can install the CLI and write markdown in less than 2 minutes. And also, it's very fast and integrates with a lot of frameworks.
I'm working on a CMS platform and I am planning to use CKEditor as it seems to offer everything I need.
One thing that is a bit of a bother to me is that I want my content to be in markdown format instead of html and while I found a BBCode extension for this, I couldn't figure out how it can be remade to support markdown.
I tried to find an editor that does markdown out of the box, but the ones I found are way too simple for what I need and CKEditor has the benefit of having a plugin system to adjust perfectly for me.
CKEditor now has a Markdown addon that does this exact thing. The addon project is hosted on github.
Screenshots:
See also: Integrated Markdown WYSIWYG text editor (2012)
Using Markdown instead of HTML is a very bad idea for several reasons:
Markdown has no spec, so every library works differently in details. The output which you'll produce using CKEditor may give a different (even totally wrong) result when transformed to HTML by your back-end. For example - escaping image's title and link texts - you won't be able to ensure that the text user inserted does not break the output.
Not all HTML can be transformed to Markdown.
There are plenty of tricky cases which are totally correct in HTML, but cannot be done in Markdown.
Markdown has fewer features than HTML, so you'd lose some content which users produced.
You actually gain nothing by using Markdown instead of HTML.
I am a CKEditor core developer, so I know it very well. I tried to implement a Markdown writer for CKEditor and very quickly I found that it's completely pointless. I don't say that it's not possible, because it is, but only a limited stability can be achieved - too low for anything I would personally want to use in production.
Most Markdown parsers generate very similar HTML output, but it can slightly vary.
Some parsers are strict and allow only this is **bold** but not this is ** bold ** others accept both. There are many other nuances.
I want to use pagedown in the frontend. Which gem or library produces the same HTML output?
The result in the "preview" should be exactly the same as the generated HTML in the backend.
Pagedown description says that this is port of Sundown, so Redcarpet without any extensions should work as expected.
If you want exactly the same HTML you could simply save the pagedown output along with the markdown source in the database and only parse the markdown in Ruby if there was no HTML output posted (as a fallback , i.e. when javascript is disabled or broken).
Edit
As pointed out in the comments (thanks!) this is a potential security issue, because an attacker can submit arbitrary HTML.
Another solution would be to use Node.js on the client side and let pagedown do the parsing there, too.
In looking for a straightforward WYSIWYG editor for Markdown code, I am not finding a comparible UI to that of CkEditor, TinyMCE, ect.
Specifically, the Markdown "WYSIWYG" editors that are often recommended (such as posts like this ) are not pure WYSIWYG editors in the sense that users either still write raw Markdown ( MarkItUp ) or go to the other extreme of having in-line editing without standard controls ( Hallo ).
I need something in-between.
I'm looking for a Markdown editor that looks and functions like a stripped down CkEditor text box, and that accepts and outputs Markdown. There should be a toolbar with a minimum set of formatting options (B, I, U, lists, ect), and the text entry area should show the converted Markdown, not the raw code. There should be a Source button that will allow users to edit the raw Markdown, but even that is optional. Ex:
I get the reason for Markdown/wiki, ect - the security it offers. I don't mind entering raw code like here at SE, but my users are not geeks and do not find this enjoyable. They don't want to see * * * ___ and spaces mixed in with their text. They are used to "Word" style editing, and are most productive in that environment.
So - is there a truly integrated WYSIWYG editor for Markdown? I'm writing in a PHP, so something that I can invoke with a class would be perfect.
Sept 23, 2015 Update
CKEditor now has a Markdown addon that does this exact thing. The addon project is hosted on github.
Screenshots:
Apr 13, 2015 Update
Someone professing to develop CKEditor says that the appearance of CommonMark is a game changer, and we could possibly see a proper markup interface for CKEditor (read comments for the full story).
Feb 6, 2015 Update
CKEditor now comes with a plugin that outputs (and accepts as input) BBCode.
Demo: http://ckeditor.com/demo#bbcode
SimpleMDE, a newcomer, may be the answer. I've been searching for something just like this for a month now. I'm surprised that this does not show up higher in search results. I had to go through a notice on lepture/editor to find this.
I was researching in this subject the other day and I haven't found any decent WYSIWYG editor with Markdown output. In fact, first you have to have to create a WYSIWG Markdown editor is WYSIWG HTML editor and there are just few of them that are usable on the market.
There's a chance that you'll be able to create dataProcessor for CKEditor that will change HTML editor into Markdown editor. We've got a plugin for BBCode that works like this (check out http://nightly-v4.ckeditor.com/3737/samples/bbcode.html).
All you have to do is implement this interface http://nightly-v4.ckeditor.com/ckeditor_api/#!/api/CKEDITOR.dataProcessor. If you check BBCode plugin's code you'll see some hacks and tricks, because unfortunately current CKEditor's architecture isn't ready (yet) to create such a data processor. However, I believe that if you want to provide only few styling options you should be able to implement Markdown support pretty quickly.
EDIT Sept 23, 2015
CKEditor now has a Markdown addon that does this exact thing. The addon project is hosted on github.
Screenshots:
As posted in my Feb 6, 2015 update, CKEditor now includes plugins that allow BBCode input and output.
A demo is available here: http://ckeditor.com/demo#bbcode
EDIT Apr 13, 2015:
Someone professing to develop CKEditor says that the appearance of CommonMark is a game changer, and we could possibly see a proper markup interface for CKEditor (read comments for the full story).
Pen is a new (active as of 2014) WYSIWYG editor that outputs Markdown.
It's not perfect—I've had issues with pasting HTML there—but it works.
Edit: Sorry! It doesn't output Markdown. Walery Strauch pointed out in the comments that the Markdown formatting signs I saw were actually CSS pseudo element rules:
Still, I'll leave it here as an option since some people upvoted this answer and it may have been of use to somebody.
I implemented a very simple editor that allows the contents of a <textarea> that contains Markdown to be edited in a WYSIWYG fashion.
I used Hallo. I don't think its web site makes it obvious that it is not itself a Markdown WYSIWYG editor but the demo does forge the path to one.
Hallo allows WYSIWYG editing of the HTML inside a <div>. I used javascript to hide any <textarea> blocks that have a specific wysiwyg CSS class, replacing it with a <div> and copying the contents of the <textarea> into the <div>. The copying runs through Showdown which produces HTML from Markdown.
Another Javascript routine reacts every time the <div> contents change. It copies the contents back into the (now hidden) <textarea>. The content is run through to-markdown to convert from HTML to Markdown.
If the <textarea> is a field in a <form>, then the edited Markdown will be sent to the server when that form is submitted.
The inspiration for this comes from the Hallo Markdown Example, specifically the editor.js file. I used that as a basis for my own script along with hallo.js, showdown.js and to-markdown.js.
My script, wysiwyg.js is a derivative of editor.js from the Hallo Markdown Example. Some points to note:
I use this in a Rails application (not that that matters)
It runs on ready and also on page:load, the latter because Rails uses Turbolinks
It runs on ajaxComplete because I use Ajax for form error reports
There are other dependencies: JQueryUI and Rangy (Rails users can avail of the gems jquery-ui-rails and rangy-rails).
Also Font Awesome is used for the tool bar icons. The version of hallo.js used by the demo is out of date (it uses an old version of Font Awesome) - use hallo.js from GitHub instead.
You only need to add CSS class='wysiwyg' to any <textarea> to enable WYSIWYG on it. The <textarea> should conain Markdown formatted text.
I would expect that wysiwyg.js could be easily adapted to use another editor if you don't like Hallo as long as it works on the HTML in a <div>. There are quite a few to choose from but not all are as lightweight as Hallo.
A smilar piece of work that I found is markdown-html-form. It uses the same Showdown and to-markdown.
I am also looking for a markdown editor that is described at the top of this thread
Have you seen "markdown tools": http://md-wysiwyg.sourceforge.net/
Demo: http://md-wysiwyg.sourceforge.net/cgi-bin/cgi_wysiwyg_test.py/
That seems pretty close to what we are looking for, it does a reasonable job of taking your WYSIWYG rich text and outputting markdown. However it failed on an encoding exception when I pasted in some rich text from a google doc.
I found two which currently seem to be quite popular, active and free but haven't been mentioned yet.
The first one is Toast UI Editor. It supports both modes (WYSIWYG and raw). It has official react and vuejs wrappers.
The second one is ProseMirror which calls itself "a toolkit for building rich-text editors on the web" and it seems to be very flexible and extensive. It also supports both modes.
I'm pretty sure solid unofficial react / vue / angular wrappers for it can be found as well.
Has anyone been able to find a way to test pdf's with ruby within the browser? I have tried a few different ways and the only way I have been able to get any pdf testing to work is to save off the pdf and use the pdf_reader gem. This only seems to work on pdf's that, when the link is clicked, opens up a dialog box with the options to open or save the pdf. Unfortunately I have not been able to find a way to do anything like this with pdf's that are opened in browser, with no dialog box options to save it. Any ideas?
Maybe testing it in the browser isnt the best way. When you say test the pdf what are you trying to do? I wouldnt test the pdf in the browser if I was you.
Try docsplit, if you want to verify its contents.
Docsplit is a command-line utility and Ruby library for splitting apart documents into their component parts: searchable UTF-8 plain text via OCR if necessary, page images or thumbnails in any format, PDFs, single pages, and document metadata (title, author, number of pages...)
You are not inventing a browser, or a PDF generator.
Use unit tests to check your back-end modules can take data in, and write PDF out, then serve the PDF in a website and let the browser do its thing. Test (as what Rails calls a "functional test") that the MVC will produce a web page containing a link to the PDF, and you are done.
You can use gem 'mechanize' to download an online PDF (the PDF with in a browser) on your computer and then read it via gem PDF reader.