December 25, 2017, at 11:26 PM (0 comments)
Gist.io renders Markdown-formatted Gists as HTML pages. OborWiki can do this too. Here’s how.
Here’s the demo post on gist.io…
And here’s how we do it on OborWiki:
(:markdown:) (:gist-embed idan/3135754 raw no-pre:) (:markdownend:) |
Hello there! This is a sample post for gist.io, a super-lightweight writing soapbox for hackers. Now look up. Further. Above the post title. See that grey text with the gist ID? Now back to me. That grey text is a link! Open that sucker in a new tab to see the source for this post. Also, I'm on a horse. This is a major headingIf you peek at it with a web inspector, you'll see that it is a second-level heading. You can use first level headings, but they'll look just like the second level ones, and the gods of the HTML5 outlining algorithm will frown upon you. There's nothing stopping you from using This is a third-level headingClassy, eh? Those are actually real small-caps, courtesy of the lovely argentine typeface, Alegreya (available from Google webfonts in regular and small-caps variants). Here, have some slipsum in a
This is a fourth-level headingDown here we are quite in the weeds already. I guess this is a good a time as any to say that lists are appropriately styled: Milkshake ingredients to get at the supermarket
Add bananas, chocolate milk powder, and milk to blender. Blend at high-speed until suitably frothy. Drink and then instagram a pic of your milkshake moustache for extra hipster cool points or something. Steps to recovery from milkshake addiction
By the way, the "Milkshakes ingredients" subtitle was a fifth-level heading. It's rare that you need those, and I don't think you'll ever need a H6, so I didn't style those at all. Since you've come this far, you are probably wondering why I don't support something you want me to support. You can help make gist.io better by contributing to the project or filing a bug/feature request. Also: imagesYou can embed images in posts too, and they'll respect the width of your browser: A photo I took of a woman bathing in the Ganges river |
Of course, we could also do the same through Pastebin instead of Gist:
(:markdown:) (:pastebin-embed rft8NYgs raw no-pre:) (:markdownend:) |
Hello there! This is a sample post for gist.io, a super-lightweight writing soapbox for hackers. Now look up. Further. Above the post title. See that grey text with the gist ID? Now back to me. That grey text is a link! Open that sucker in a new tab to see the source for this post. Also, I'm on a horse. This is a major headingIf you peek at it with a web inspector, you'll see that it is a second-level heading. You can use first level headings, but they'll look just like the second level ones, and the gods of the HTML5 outlining algorithm will frown upon you. There's nothing stopping you from using This is a third-level headingClassy, eh? Those are actually real small-caps, courtesy of the lovely argentine typeface, Alegreya (available from Google webfonts in regular and small-caps variants). Here, have some slipsum in a
This is a fourth-level headingDown here we are quite in the weeds already. I guess this is a good a time as any to say that lists are appropriately styled: Milkshake ingredients to get at the supermarket
Add bananas, chocolate milk powder, and milk to blender. Blend at high-speed until suitably frothy. Drink and then instagram a pic of your milkshake moustache for extra hipster cool points or something. Steps to recovery from milkshake addiction
By the way, the "Milkshakes ingredients" subtitle was a fifth-level heading. It's rare that you need those, and I don't think you'll ever need a H6, so I didn't style those at all. Since you've come this far, you are probably wondering why I don't support something you want me to support. You can help make gist.io better by contributing to the project or filing a bug/feature request. Also: imagesYou can embed images in posts too, and they'll respect the width of your browser: A photo I took of a woman bathing in the Ganges river |