Tags

, , ,

title: Experiments with StackEdit
published: true

tags: [Markdown, stackedit.io, WP, wordpress.com]

Composed in StackEdit

This post was composed in the offline StackEdit, an offline Markdown editor that claims support for synchronization with cloud services such as DropBox and Google Drive, and which can publish to a range of blogging platforms including WordPress.

I’m currently typing in the Chrome App flavor, which has filled my browser window with a two-pane view of my document. On the left is an editor in which I write directly in Markdown. On the right is a live rendering of the Markdown via HTML for display in the browser.

Things that seem to just work

  • The sample document synched with Google Docs with no fuss or muss.
  • The preview panel to my right is slick.
  • It noticed I’m writing a list and offered a new bullet item.

Things to test after posting

Charts!

StackEdit has some JS magic to support state charts and flow charts. I wonder how those work out, so let’s give them a try.

You render sequence diagrams as code block in the language “sequence”, but with the restriction that the block is fenced by exactly three back ticks and not tildes or any other number of back ticks:

Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob–>Alice: I am good thanks!

And flow charts as code blocks in the language “flow”:

st=>start: Start
e=>end
op=>operation: My Operation
cond=>condition: Yes or No?

st->op->cond
cond(yes)->e
cond(no)->op

MathJax

You can render LaTeX mathematical expressions using MathJax, as on math.stackexchange.com:

The Gamma function satisfying $\Gamma(n) = (n-1)!\quad\forall n\in\mathbb N$ is via the Euler integral

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

Tip: Make sure you include MathJax into your publications to render mathematical expression properly. Your page/template should include something like this: 

<script type="text/javascript" src="https://stackedit.io/libs/MathJax/MathJax.js?config=TeX-AMS_HTML"></script>

WordPress shortcode for latex

The Gamma function satisfying \Gamma(n) = (n-1)!\quad\forall n\in\mathbb N is via the Euler integral

\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.

\lambda = \frac{c}{f} = \frac{1126\, \text{ft} \cdot \text{sec}^{-1} }{ f} = \frac{1126\, \text{ft} \cdot \text{sec}^{-1} }{ 65.4\, \text{Hz}} = 17.2\, \text{ft}

L_{open} = \frac{\lambda}{2} - 2 w_i
L_{open} + 2 w_i = \frac{\lambda}{2} = \frac{17.2\, \text{ft}}{2} = 8.6\, \text{ft} = 8\,\text{ft}\;7.3\,\text{inches}

L_{stopped} = \frac{\lambda}{4} - w_i

Things I might miss

Abbreviations

According to the quick reference WP includes the Abbreviations feature of Markdown Extra. If that works, then the word HTML should get tagged as an abbreviation with the expansion “Huge Trail of Muddy Language”. In StackEdit right now, it is not tagged and the *[] reference is displayed after this paragraph.

Of course, Stack Overflow doesn’t use them, so I probably shouldn’t be surprised they aren’t working in StackEdit. I have seen them work on WP itself. We’ll see if they work when this is published.

Despite not displaying in the editor, they do work correctly on WP if the post was published as Markdown.