Kim Hallberg

Posted on Sep 4, 2020 • Edited on Sep 13, 2020

What would you add to Markdown? 🤔

#discuss #markdown

Markdown 🔥

The language we use most likely at least of ones per day. If your job includes GitHub, then it's most likely more. Its what drives our README's, issues, pull requests, its the goto for creating posts here on Dev too.

While there has been some extended syntax to it since John Gruber created it. For instance CommonMark, GFM, and more, even Dev has an added extension with the Liquid tags.

If you had the change to add a new syntax that would be used on your favorite sites, what would you add? I would like to have an aligning extension that lets us align text, images, and more much more than adding.

<p align="center"></p>

Which isn't supported on all platforms. Since most remove HTML tags server-side when the content has uploaded. which to be fair is something they should never trust user-uploaded content. 👍

So, what would you add to Markdown?
Comment down below with your extension and start the discussion. 🙂

Top comments (37)

Sm0ke • Sep 4 '20 • Edited

target="_blank" option for urls & images

Kim Hallberg • Sep 4 '20

I can see that as being useful in situations, just hope it will have the noreferrer and noopener attributes added by default then. 😉

Simon • Sep 4 '20

Interesting. I actually decide this on my own and usually open links in tabs by pressing a key.

Tobias Nickel • Sep 4 '20

For my blog, made with hexo, there are many plugins that allow add extra content.

I also developed a plugin to add UML diagrams with nomnoml syntax to my posts.

Kim Hallberg • Sep 4 '20

Never heard of nomnoml before but it looks awesome, that plugin would be an awesome extension to have, especially in docs or tutorials and things of that nature. 🙂

Pacharapol Withayasakpunt • Sep 4 '20 • Edited

I have used Showdown.js for that it is easy to create extensions.

However, the most basic I would want, is markdown inside HTML. (data-markdown attribute is not supported in some parsers.)

Another feature is customized, is simplified table syntax.

I also added (scoped) CSS inside markdown, (with <style>).

Kim Hallberg • Sep 4 '20

Scoped CSS would be so nice to have, I think with scoped CSS being correctly interpreted by the parser and limited correctly it could bring a lot of variety to what you can do with Markdown. 🙂

J3ffJessie • Sep 4 '20

I would love to be able to embed live web pages using MD. For hosting live versions of a blog post or something similar using MD would be awesome. Unless I’m missing something this isn’t possible with GFM, or traditional markdown either. Would love someone to point me to the solution if it’s able to be done. As I am newer to markdown I don’t know everything but I have been unable to find a way to do this.

Kim Hallberg • Sep 4 '20

I don’t personally know if it’s possible but if the service supported <iframes> I guess maybe, with GitHub and GFM I suppose you could technically do it with an action, I use the action for my GitHub profile that updates a list of my post from Dev, you could probably do something similar but with larger content.

J3ffJessie • Sep 4 '20 • Edited

Tested with iframes>at least on GitHub it’s not supported. Not familiar with actions yet, have no idea how they work so I’ll have to look into them.

csgeek • Sep 4 '20

This is very specialized but I use docusaurus beta version and it allows jsx snippets and components to be added to a markdown file. It's a cool idea and really let's you extend what your simple .md files can do but not sure I'd want that for md in general.

It is cool too still be able to use simple markdown or create rich dynamic content and being able to mix and match.

J3ffJessie • Sep 4 '20

Interesting. Wonder if that would allow for more customization on the GH profile README pages. I’ll have to look into that. Thanks for the information

csgeek • Sep 4 '20

I meant to add this initially but if you are interested reference. v2.docusaurus.io/docs/static-asset... I'm also not affiliated with them in anyways, it's a FB project. But I have been using it heavily for both community documentation and work API docs.

J3ffJessie • Sep 5 '20

Thanks a ton. Definitely going to implement this in a project soon

csgeek • Sep 5 '20

If you want an example: repo uses Travis CI to deploy each commit using this config and ends up on this repo with the final result being geekbeacon.github.io/.

There's a decent discord and feel free to message me directly if you need help. I don't want to tangent too much since we were talking about markdown in the OP not docusaurus

Pacharapol Withayasakpunt • Sep 4 '20

iframe, script, and style tags are dangerous by default.

Only if you host your own markdown that will be able to customize and allow them.

Kim Hallberg • Sep 4 '20

Isn't that why the sandbox attribute was added to <iframe>, I haven't messed with them in years but I remember there being talk about sandboxing it solved that issue. 🤔

J3ffJessie • Sep 4 '20

I will look into it. I appreciate your knowledge.

Tomas Fernandez • Sep 4 '20 • Edited

I would add includes. With org-mode I can do this:

#+INCLUDE: "./myscript.sh" src bash

And the contents are automatically included when I render it in other formats. I'd like to have that in markdown.

Kim Hallberg • Sep 4 '20

So in this example would it include it rendered in a code-block, because that would be amazing to have on GitHub, that way instead of copying the file yourself you could do.

#+INCLUDE: "./myscript.sh" src bash 2 5

Where the first argument is the file, the second is the directory to look in, third would be the highlight, fourth and fifth would be the lines in the file to copy, zero-based index, because we developers love that. 👍

Tomas Fernandez • Sep 4 '20

Yes, it works like images. It gives us the option to put the code on a separate file and still be rendered as a single document. It would be neat feature to have, specially to write READMEs.

The org-mode help shows all the things we could do with includes.

Ryan Faulhaber • Sep 4 '20 • Edited

Less rigorous table syntax, at least in GFM. This is an idea stolen from the wonderful Org mode.

Tables in GFM have to be very strictly formatted. This is an issue I've run into on GitHub over and over again, so much so that I just use some external tool to deal with it.

In GFM, you have to write:

| heading 1 | heading 2 |
|-----------|-----------|
| foo       | baz       |
| bar       | quux      |
|           |           |

The equivalent could be written in Org as:

| heading 1 | heading 2|
|-
| foo | baz |
| bar | quux |
| | |

This is something Markdown should just steal, honestly!

Simon • Sep 4 '20

Are you sure about this? I thought it just works, at least you don't need to make sure the columns are equal width. The header body separator will not work like this though. But yea, table syntax is kind of weird, I agree.

Kim Hallberg • Sep 4 '20

Ooh yes, better tables absolutely, even though it's something that's "old" and we don't talk about often, we do still use it, it's still the best way to display data without using something like grid IMO.