Automating Markdown links with TextExpander

January 2015 ยท 2 minute read

Adding links to Markdown documents can be tedious at times. Especially when you’re doing it a lot or under pressure, e.g. if you’re creating show notes for your podcast while you’re recording. You’ll usually get a link from somewhere, from the chat, a guest or just by searching for it and all you want to do is insert the link with the proper title and formatting. What would you normally do? Insert the link into your document. Then open it in a new browser tab and copy the headline. Go back to your document. Insert it and fix the formatting.
There must be a better way to do this, right?

And indeed, there is. Several actually. First let me explain how I did it, then I’m going to mention a different approach created by the infamous Brett Terpstra. Depending on your workflow, you might prefer one or the other which is totally fine. Whatever works for you!

My weapon of choice is TextExpander and a little bash script. Simply because that way it will work with literally any document and app on my Mac. Whether I’m using it in Google Docs, Pages or FoldingText, it will work.

Parser snippet

Parser snippet

We’ll need two TextExpander snippet to achieve this. The first one is essentially just a script: #!/bin/bash curl -s –compressed -L –max-redirs 10 “%clipboard” | grep -o ‘.<em>’ | sed ’s/(.</em>)<\/title>/\1/g’ | tr -d ‘\n’</p> <p>It takes the link from your clipboard, fetches the source of the webpage and extracts the content of the title HTML element. You could also use this snippet on it’s own, if you want to.</p> <figure> <img src="https://brendamour.net/uploads/2015/01/md_link_snippet_TextExpander.png" alt="Wrapper snippet" width="590" /> <figcaption> <p> Wrapper snippet </p> </figcaption> </figure> <p>The second element provides the markdown wrapper around the first one: <a href="%clipboard" title="%snippet:xlwtl%">%snippet:xlwtl%</a></p> <p>Some sites take a relatively long time to load, so I’d suggest to increase TextExpander’s script timeout time by executing this on the command line: osascript -e ‘tell application “TextExpander” to set allowed computation time to “28”’ This will increase the time to 28s, which is plenty time for most pages.</p> <p>That’s it. Whenever you need to insert a link, all you need to do is copy it, type the magic TextExpander abbreviation into your document and a few seconds later the link appears.</p> <p>As I mentioned before, there’s another solution Brett Terpstra created: it’s called <a href="http://brettterpstra.com/projects/searchlink/">SearchLink</a> and allows you to insert search terms into your document and let the tool search for the appropriate link on its own. It’s more a solution for people who are writing articles and don’t want to interrupt their flow to look up some random link.</p> </article> <div class="pagination"> <a href="https://brendamour.net/en/2014/12/18/one-week-with-the-withings-aura/">« One Week With the Withings Aura</a> <a href="https://brendamour.net/en/2015/02/13/on-the-ipad-why-it-still-matters-a-lot-for-me/">On the iPad: Why it still matters a lot for me »</a> </div> </section> <br> <section class="disqus"> <div id="disqus_thread"></div> <script type="text/javascript"> (function() { if (window.location.hostname == "localhost") return; var disqus_shortname = 'brendamour'; var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true; dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js'; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); })(); </script> <noscript>Please enable JavaScript to view comments powered by <a href="http://disqus.com/?ref_noscript">Disqus</a>.</noscript> </section> </section> </main> <footer class="row middle-xs center-xs"> <div class="col-xs-3 col-md-2"><a href="https://github.com/drallgood">GitHub</a></div> <div class="col-xs-3 col-md-2"><a href="https://linkedin.com/in/pbrendamour">LinkedIn</a></div> <div class="col-xs-3 col-md-2"><a href="https://twitter.com/casual_kitchen">Twitter</a></div> <div class="col-xs-3 col-md-2"><a href="https://brendamour.net/en/legal/">Legal</a></div> <div class="row center-xs"> </div> <div class="col-xs-12"> Copyright © 2018 Patrice Brend'amour. Theme developed by <a href="https://tomanistor.com">Toma Nistor</a>. </div> <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script> <script src="https://brendamour.net/scripts/retina-87bd4d54.js" type="text/javascript"></script> <script src="https://brendamour.net/scripts/main-be52c14c.js" type="text/javascript"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.10.0/highlight.min.js"></script> </footer> </body> </html>