Do you find it daunting to compose a blog post or to author some other type of web content? Ugh, all those
<div> tags! Formatting HTML, perhaps with in-line CSS, can be a hassle, and can slow us down. Luckily, there’s a solution — a way to reduce time and complexity. TextExpander and Markdown. Let’s get started.
What is TextExpander?
TextExpander is a single-purpose software app for Mac by Smile Software. It lives in your Mac’s menu bar and helps you type by expanding short bits of text — or as they call them, Snippets — into long passages or elements with intricate formatting. Examples tell the story:
Think of how many times a day you type your own name. Filling out forms, writing a letter, etc. etc. I have a Snippet
PPFF which expands to
Same goes for email addresses. I type
p@tbc and it expands to
Need a date and time?
ttime expand to
It’s amazing. Frankly, it’s the sort of thing that really should be built into the operating system. (In a way, it is, if you dig into the Keyboard preferences, but sadly the Mac native features can’t match TextExpander.)
What Can TextExpander Do?
Aside from simple text — names, companies, email addresses, etc. — TextExpander can be used to store complex pieces of code.
For example, when I need to embed a web video into a blog post, I can type
videovideo to receive the following WordPress-formatted text:
Going one step further, TextExpander can grab the last item copied to the clipboard and paste it into the resulting text. In the above example, I can copy a URL such as
http://www.youtube.com/abc123def456, which will populate when expanded to:
Where the copied item is inserted into a designated spot, not just the beginning or the end. You get the gist!
Why TextExpander is Awesome
TextExpander is amazing. I’m continually finding new uses for it and exploring its features.
I use it to keep 5 paragraphs of dummy text available at a touch.
I use it to type addresses, URLs, and City names, including consistent formatting and soft returns.
I use it to fill in common phrases or passages that seem to come up again and again in email. Example:
Attached is the PDF for the [blank]. This PDF is hi-res and contains bleeds and crop marks. All project info is located in the project slug. Below is a link to a ZIP of the native InDesign files, as well as all images, fonts, and IDML files. Please let me know if you need anything else or have any questions.
And I use it for HTML formatting, and that of Markdown.
What is Markdown
In essence, it’s a faster way to write HTML code. Markdown isn’t a coding or mark-up language per se, but when it’s understood by the underlaying technology, it outputs the same HTML code, but with much less hassle.
The idea is that you can take common formatting, stuff like italics, bold, links, bulleted lists, etc., and make it dead simple to create, and fast. I’m writing this blog post, for example, using Markdown.
Markdown is common on web comment systems and sites, such as Reddit. (in fact, this is pretty much how I was introduced to it.) Read more about Markdown on the aptly-named site whatismarkdown.com.
What Can Markdown Do?
Markdown can do just about everything HTML can regarding text formatting. Headlines, bold, italic, links, lists (ordered and unordered), images, code, rule lines, and other basic elements are super-easy to create.
For example, to make a link to The Busy Creator home page, I’d have to type the following HTML:
<a target="_blank" href="http://busycreator.com" title="The Busy Creator Website">The Busy Creator website</a>
Whereas with Markdown, it’s simpler to type, and more human-readable:
[The Busy Creator website](http://busycreator.com/ "The Busy Creator website")
A few brackets, and you’re good.
Italics is easy, just put your text between a single asterisk or underscore.
Bold is similar, just use double asterisks. e.g.
**this is bold**
Ordered lists (aka numbered lists) are made incredibly simpler. Instead of:
I just use have to use the number 1 with a period and space.
1. First item
1. Second item
1. Third item
Bulleted lists are even easier, replacing the
1. with a simple
If you need to transform HTML to Markdown, or the reverse, use these links:
Why Markdown is Awesome
I mentioned it above, but as you can see there’s some immediate speed gained. In addition to outright per-minute productivity, Markdown is much easier to type, using more familiar punctuation and fewer persnickety formats, such as
</a>. A further benefit is that once you get up to speed with Markdown, your fingers hardly have to leave the keyboard! WYSIWYG tools are almost redundant, since the text itself has so much of the functionality.
TextExpander + Markdown
Now we’re warmed up, let’s get cooking.
Imagine if you could take a single word, highlight it, and in a simple keystroke make it an entire link with a title and everything? Easily done. Want to take my video example from above and expand it to photo captions, pullquotes, and more.
I use a collection of Markdown-focused Snippets to get what I need done. Standing on the shoulders of giants, as I often do, I learned about particular set from David Sparks of the Mac Power Users podcast. The Snippets are a free download, get yours here:
Downloading these will get you started, but the real power comes when you can think of ways to improve your workflow with these tiny, incremental improvements.
Think about things you’re constantly copy-pasting, or the type of phrases you find yourself repeating to friends and colleagues. Make a Snippet of your own. Make an alternate version with Markdown formatting. Here are some examples:
- A link to your LinkedIn or Facebook page
- A “thanks but no thanks” message for quick-reply in email
- A paragraph listing your go-to colleagues and their email addresses/phone numbers
- A simple framework for a Tweet, including the last URL you copied
- The names and links to all your podcasts, portfolios, or projects
I have found tremendous benefit to using Markdown with TextExpander and now I want to hear from you. What appeals to you most about saving time while writing? What are some of the improvements you’ll make to the Snippet set included? Are you already using TextExpander in genius ways?
Leave a comment below or connect on social media. I’ll be happy to share your technique with the community.
Enjoyed this article?
More insight and resources delivered in our newsletter. Sign up below to receive site updates.