DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Kim Hallberg
Kim Hallberg

Posted on • Updated on

What would you add to 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>
Enter fullscreen mode Exit fullscreen mode

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 (39)

Collapse
 
tomfern profile image
Tomas Fernandez • Edited on

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.

Collapse
 
thinkverse profile image
Kim Hallberg

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. πŸ‘

Collapse
 
tomfern profile image
Tomas Fernandez

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.

Collapse
 
sm0ke profile image
Sm0ke • Edited on

target="_blank" option for urls & images

Collapse
 
thinkverse profile image
Kim Hallberg

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

Collapse
 
else profile image
Simon

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

Collapse
 
rfaulhaber profile image
Ryan Faulhaber • Edited on

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!

Collapse
 
thinkverse profile image
Kim Hallberg

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.

Collapse
 
else profile image
Simon

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.

Collapse
 
patarapolw profile image
Pacharapol Withayasakpunt • Edited on

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

Collapse
 
thinkverse profile image
Kim Hallberg

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. πŸ™‚

Collapse
 
bias profile image
Tobias Nickel

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.

Collapse
 
thinkverse profile image
Kim Hallberg

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. πŸ™‚

Collapse
 
j3ffjessie profile image
J3ffJessie

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.

Collapse
 
thinkverse profile image
Kim Hallberg

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.

Collapse
 
j3ffjessie profile image
J3ffJessie • Edited on

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.

Collapse
 
csgeek profile image
csgeek

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.

Collapse
 
j3ffjessie profile image
J3ffJessie

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

Thread Thread
 
csgeek profile image
csgeek

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.

Thread Thread
 
j3ffjessie profile image
J3ffJessie

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

Thread Thread
 
csgeek profile image
csgeek

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

Collapse
 
patarapolw profile image
Pacharapol Withayasakpunt

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.

Collapse
 
thinkverse profile image
Kim Hallberg

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. πŸ€”

Thread Thread
 
j3ffjessie profile image
J3ffJessie

I will look into it. I appreciate your knowledge.

Collapse
 
vtrpldn profile image
Vitor Paladini

.mp4 support hands down

I had to add some gifs to an article today and each weighted about 1MB even after compression :(

Collapse
 
bias profile image
Tobias Nickel • Edited on

GIFs are awesome

Collapse
 
thinkverse profile image
Kim Hallberg

Nice, native support for the <video> tag, that would be a nice thing to have absolutely. πŸ‘

Collapse
 
csgeek profile image
csgeek

There are likely plugins that do this but latex math expressions world be nice.

Lots of platforms support syntax highlighting but not sure if there is a standard.

It'd be nice if code highlighting just worked uniformly.

Collapse
 
thinkverse profile image
Kim Hallberg

Not much of a math person myself, but that would be nice for users who read and write those expressions. πŸ‘

Collapse
 
grimlink profile image
Sean van Zuidam

Support for the <details> element

Collapse
 
thinkverse profile image
Kim Hallberg

That would be useful. πŸ‘

Collapse
 
trollboy_j profile image
Jacko

Embedded video, highlighted text, and much more

Collapse
 
thinkverse profile image
Kim Hallberg

Yes to all of that. 🀘

Collapse
 
dlordi profile image
dlordi

It would be nice to have a Copy to clipboard button next to code blocks (triple backticks). This is not a formatting feature but it would be really useful for code snippets!

Collapse
 
cchacin profile image
Carlos Chacin β˜•πŸ‘½

Markdown is supposed to be and stay simple in terms of features, a better alternative and still simple is AsciiDoc

Collapse
 
alc0r1985 profile image
Alfio

A flowchart/sequence diagram/gantt/etc standard syntax, like Mermaid.js
Some sort of anchors to create easily things like index

Collapse
 
javacode7 profile image
JavaCode7

Subtitles. Definitely subtitles. I don't really use them but I think they will be useful.

Top Heroku Alternatives (For Free!)

Recently Heroku shut down free Heroku Dynos, free Heroku Postgres, and free Heroku Data for Redis on November 28th, 2022. So Meshv Patel put together some free alternatives in this classic DEV post.