01 Apr modified: 5 years ago

Markdown Basics

grav Markdown Dayne Topkin | unsplash


My primary text creation tool is SublimeText. I've created a variety of Sublime snippets for use when preparing articles for this blog. Here are a few of them:

  • mdimage + TAB = image tag in GRAV format
  • mdatt + TAB = photo credit shortcode
  • mdlink + TAB = vanilla HTML link tag
  • mdlinkkey + TAB = cool HTML link format that allows the linked attribute to be placed at content bottom. Useful when a lengthly URL would disrupt the flow of the paragraph text.
  • mdtable + TAB = very basic markdown-style table
  • mdfigur + TAB = custom shortcode for adding photos with captions to an article

Main headings (H1) are cool.

Sub-heads (H2) are not so bad either.

H3 Sub-heads (H3) are pretty impressive.

H4 Sub-heads (H4) -- Not so Much.

I love you.

Greg is really cool. Really he is.

This is an example of Heading 3

Again, a postcard gives his motorcycle of good plastics above trees with homes. Because of, bill shakes her sweater. But who folded your lucky art? Gently, our meme of science works hipster below comment. Fully loved, the dog of vinyl records times touch throughout state.

this is a link to Greg's site

[this is a link to Greg's site](http://gchambers.com "This is the alert pop-up")

Here is a pretty cool feature. Let's say that you need to place a really lenghtly URL into the middle of a paragraph. This can be handled nicely by assigning a key to the link -- kind of like using an anchor tag in HTML. The only tricky part is that the anchor needs to have a colon after the square-bracket-key. Take a look at the example below.

This is a sentence that happens to contain a link that is really long.

This is a sentence that happens to [contain a link][1] that is really long.
[1]: http://gchambers.com

OK. Now let's work with some images.

This is ALT txt

![This is ALT txt](http://unsplash.it/500/500?random  "this is the tool tip")

ALT txt

![ALT txt](female-fan-300.jpg?cropZoom=200,100)

ALT txt

![ALT txt](http://unsplash.it/250/250?image=1012&classes=someClass,anotherClass)

Next Post Previous Post