Mac Blog Workflow – Scrivener, Markdown, Textmate (video)

Here’s a little video I put together to share a bit about my blog workflow on a Mac. Here’s the gist:

  • I use Scrivener to write, because it’s great for writing (that particularly delicate convergence of headspace, motivation and creativity that’s so damn hard to follow through on since you’ve found smush cat face). It’s got the fullscreen writing, the organization, the customizable typography… I like it a lot and wrote about writing with scrivener before.
  • I write in Markdown, a sort of shorthand way to write that’s both easy to read and edit and it can be easily converted to beautiful, functional HTML. I’ve started writing all my notes in markdown because it’s so simple to get used to and can be converted to HTML in a click or two. I highly recommend getting familiar with markdown if your a blogger or digital note taker.
  • Finally I’ll copy and paste the text i’m working on in Scrivener (which is written using the markdown syntax) and paste it into Textmate, the best ever mac tool ever for text ever. I do this because Textmate has this sweet little “convert markdown to HTML” button I can click and, BAM! We’ve got perfect HTML to copy and paste straight into WordPress, or Posterous, or whatever your “listen to me” weapon of choice is.

This is the process I use now and I think it’s so much better than what I was doing before. Maybe you like it too.

If you’re not on the list   I can't help you.   Get on the list!
ken edwards

always interesting to peek into others’ work-flows. i also love scrivener, but for my blogs, find MarsEdit is fabulous. it does most of the html for me without having to worry about any markup most of the time.

Chase Reeves

@ken Thanks! I tried MarsEdit a bit and found that I really missed the fullscreen writing view in scrivener. It helps me to care about what I’m writing, because i’m prone to distraction ;)I also should mention that Scrivener has a MultiMarkdown to HTML converter built into it. What this does is creates an HTML file you can save somewhere temporary and then open, copy the code, and paste that into your WordPress or Posterous, etc.I use Textmate instead of Scrivener’s export to HTML feature simply because Textmate is kind of like another hand for me. It’s always open, I’ve got keyboard shortcuts that I’m well versed in, and I’d just as soon rather not have another .html file somewhere that I need to delete. I also tend to wait till i’m in Textmate and converted to HTML to add images… I like to be able to float an image, and make sure it’s inside of the tags, etc.

Hey, thanks for the video. Out of curiosity, what program did you use to make the screencast? I like how you’ve got the thumbnail of you with the screencast recording.

Chase

Thanks, Seth. I used Screenflow on this recording.

This is awesome! Thanks for sharing this.

I’ve been wanting to use Scrivener for blogging but was so frustrated that I couldn’t easily get it into HTML on WordPress. I already use TextMate (awesome app!) and never realized I could just use Markdown and convert it to HTML with one click.

Awesome video by the way. I love the embedded frame of yourself. :)

I think I am going to give this a try. I like the full screen and the “typewriter scrolling” crap – drives me nuts in the WP web editor at times.

One question: How do handle image inserts? Just in the web interface for whatever blog platform, or is it earlier in your workflow? Again, kind of a pain in the ass in WP as I often have to delete their markup because the images are skewed when it’s posted.

Thanks Chase – really interesting/useful.

Chase

Good question about the images. Here’s how I roll:

Both markdown and textile have methods for including images inline. On my blogs (like Father Apprentice for example) I use Thesis’ built in Post Images for each post… Great for many reasons, not the least of which it auto-generates the thumbnails I use at the bottom of each post for related content, etc. This Post Image requires it’s own little meta box underneath the main wordprss edit content frame (on the WP edit post page) so I can’t add these inline.

Many times that’s the only image I have in the whole post. But when I do need an image in the content of a post, I normally just have a placeholder there like [BIG EFFIN' IMAGE OF THE THING] on it’s own line so I can clearly see it.

I find that I normally need to add the stuff to an image in HTML manually… things like align_right and frame as classes.

So, that’s how I roll the images: I do them after. This is actually on purpose because it focuses me on the writing, no stoppy to make-ee the prett-ee peecturez.

Alright. I have now downloaded Scrivener and am using it. I am also having a HOLY CRAP moment – this is awesome. SO much better than a text editor/Word-ish thing for writers. Thanks Chase – I’m a convert.

Great tutorial, thanks. I found you by googling Scrivener and Markdown.

But what did you create that video with? I love the embedded image of you with the screen capture, the zooming in. That’s just fantastic.

Thanks!

Doh! Should have read the comments more carefully. Got my answer.

Scrivener also has a function for converting existing Bold and Italics to Markdown.

Scrivener is awesome in that it can compile to rtf, doc, mobi, epub, html, markdown, markdown to html, etc. Love all those options!

I love textmate too – but the textmate step is totally unnecessary when working with Scrivener. Write to your heart’s desire in Scrivener, then choose File >> Compile >> Format As: = Original, Compile For: Multimarkdown -> HTML. It saves perfectly formatted HTML directly. No need for the Textmate step.

If MultiMarkdown isn’t an option in Scrivener – you haven’t completed the installation. See (about half way down the page to finish Scrivener install).

http://fletcherpenney.net/multimarkdown/use/

Chase

I normally just select, place into textmate (since it’s always open for me) and Command + Control + H and then I have my HTML to copy and paste… A little easier for the smaller posts to simply copy and paste instead of open a new file, etc.

That’s what’s easiest for me.

Truth is, I find myself writing more and more just in Textmate. I haven’t opened Scrivener in a while. But i have a large-ish project coming up… so i’ll likely roll that one up in Scrivener for good measure.

Though all the new Dropbox sync text file apps have me using that a bunch.

If you do end up using Scrivener again, you can keep you workflow as described above, but cut out the cut/paste to textmate step by adding the Edit in Textmate service described here. At the bottom of that page, it explains how to call textmate from any cocoa application.

But, as this is a wordpress blog, you could also use one of the various markdown plugins, and textmate’s Blogger bundle to post directly from within textmate.

Came across this last week, and finally got around to trying it out.

Only problem I encountered was with Scrivener’s predilection for prettifying double quotes. When I tried to convert the markdown to HTML, the links I’m made with double-quoted titles weren’t recognised.

Is the only option to turn off this behaviour in Scrivener, or can TextMate solve that problem too?

Chase

Chris, this issue comes up for me every now and then as well, especially if I’m copying something (like a published blog post) i had written in markdown. Markdown automatically converts all the double quotes, single quotes, elipsis and other entities to proper html encoded entities. So when I copy from the exported post/page and paste back into Scrivener or TextMate all the entities get copied in their “entity state” instead of their hex or html code.

When I preview or export in TextMate or Scrivener these entities show up as weird characters; something get’s lost in translation.

The only way to fix this is to find and replace all left-double-quotes, right-double-quotes, left-single-quotes, right-single-quotes, ellipsis, ndashes, etc., and convert them to standard double quotes, apostrophes, tripple periods, double dashes, etc. I’ve had to do this quite a bit and, though it’s an extra step, it’s not that challenging once you get the hang of it.

Actually, Scrivener’s compile process can strip out all smart quotes, ellipses, em-dashes and more. Take a look in the Transformations section of the Compile dialog. For good measure, there’s a full text replacement feature too.

Great post. I appreciate you sharing your work flow, and this alone is going to save me a TON of time. Seriously, thank you for taking the time to put this up.

Tom

Thanx for sharing your workflow. I just downloaded scrivener and it really got me writing: straight out of the box. Wrote a real longie and it’s a real pleasure to write in it. I’m quite heavy on text mate.

I also use Evernote for keeping my stuff in between devices. Like it for it’s syncing, but writing Text in a Mac Desktop really sucks as it has all these bubbles around. So it looks like Scrivener might be a good setup for me.

Nice workflow. I also prefer Scrivener and TextMate with the Blogging Tools.

However, if you prefer the full-screen mode, you may prefer ByWord. The only reason why I choose Scrivener over Byword, is because Scrivener helps me organize my research and notes in the same entry.

I gotta ask, what were you using to launch apps from your keyboard? :)

Cheers!

Hi,

I see your post is old, but it appeared in my SERPs when reserarching the matter.

I think your advice is great. That’s my workflow right now and I can’t be happier. multimarkdown+scrivener rocks

But I would say that marked 2 is a better option than pasting into textmate. Everyone: check marked 2 for markddown rendering from ANY app. When you have it in your dock you don’t have to worry again about the capabilities of any program (scrivener included) No compile, no nothing. Try Marked.

Give & Take

Your email address will not be published. Required fields are marked *

Other posts you’ll like