<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
  <channel>
    <title>Get Info: #extension</title>
    <description>Posts tagged “extension” — Blog of independent game and app developer Matt Sephton. Featuring vintage Macintosh, game development, digital artwork, Japanese esoterica, video game reviews, hacks and tips, and much more.</description>
    <link>https://blog.gingerbeardman.com/tag/extension/</link>
    <atom:link href="https://blog.gingerbeardman.com/tag/extension/index.xml" rel="self" type="application/rss+xml"/>
    <pubDate>Wed, 01 Jul 2026 16:09:47 +0000</pubDate>
    <lastBuildDate>Wed, 01 Jul 2026 16:09:47 +0000</lastBuildDate>
    <generator>Jekyll v4.4.1</generator>

    
      
        <item>
          <title>Fresh Files Extension for Nova editor</title>
          <description>&lt;p&gt;I spotted &lt;a href=&quot;https://github.com/FreHu/vscode-fresh-file-explorer&quot;&gt;Fresh File Explorer&lt;/a&gt;, a VS Code extension, &lt;a href=&quot;https://github.com/FreHu/vscode-fresh-file-explorer&quot;&gt;on Hacker News&lt;/a&gt; and loved the idea—a file sidebar that only shows recently modified files.&lt;/p&gt;

&lt;p&gt;The default file sidebar in an editor shows &lt;em&gt;everything&lt;/em&gt;, which in a large project is mostly noise. I thought it would be fun to have something like this for &lt;a href=&quot;https://nova.app&quot;&gt;Nova&lt;/a&gt;, so I reimplemented the concept from scratch using only the OG repo readme as a reference. No code is shared, it’s a completely new extension built against Nova’s API. That means I can’t do as much as the VS Code extension, such as colour coding the files like a heatmap, but it’s still quite useful as it is.&lt;/p&gt;

&lt;p&gt;The result is a sort of hybrid filesystem/git/bookmarks sidebar which I’m finding quite pleasant to use.&lt;/p&gt;

&lt;p class=&quot;tofigure&quot;&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/fresh-files-extension-for-nova.png&quot; alt=&quot;PNG&quot; title=&quot;Fresh Files showing pinned files and recent changes&quot; /&gt;&lt;/p&gt;

&lt;h2 id=&quot;how-it-works&quot;&gt;How it works&lt;/h2&gt;

&lt;p&gt;In Git repositories, Fresh Files uses &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;git status&lt;/code&gt; and &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;git log&lt;/code&gt; to figure out what’s changed. In non-Git workspaces it falls back to filesystem modification times, so it works in any folder. It shares some functionality with the built-in Git Sidebar but I’ve been careful to not duplicate too much.&lt;/p&gt;

&lt;p&gt;There are two modes:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;strong&gt;Pending Changes&lt;/strong&gt; — shows uncommitted files (or files modified in the last day if there’s no Git)&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Historical&lt;/strong&gt; — shows files modified within a configurable time window, from 1 hour to 360 days&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You can toggle the time window from the sidebar header, the command palette, or project settings.&lt;/p&gt;

&lt;h2 id=&quot;features&quot;&gt;Features&lt;/h2&gt;

&lt;p&gt;The sidebar supports both a flat file list and a directory tree view, with sorting by recency or name. Files show relative timestamps like “2h ago” or “3d ago” so you can see at a glance what’s freshest.&lt;/p&gt;

&lt;p&gt;Other things worth mentioning:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;strong&gt;Pinned files&lt;/strong&gt; — pin files to keep them visible regardless of time window&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;File history&lt;/strong&gt; — right-click any file to see its commit history with diffs&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Diff Search (Pickaxe)&lt;/strong&gt; — find commits where a string was added or removed, file-scoped from the sidebar or repo-wide from the command palette&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Line History&lt;/strong&gt; — view git history for the current line or selection&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Exhume&lt;/strong&gt; — view deleted file contents with syntax highlighting&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Resurrect&lt;/strong&gt; — restore deleted files to their original location&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Show All Files&lt;/strong&gt; — temporarily show all tracked files, overriding the time window&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Search Fresh Files&lt;/strong&gt; — full-text search across fresh files from the command palette&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;New File&lt;/strong&gt; — create a new file from the sidebar context menu&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Move to Trash&lt;/strong&gt; — delete files from the sidebar context menu&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Quick Open&lt;/strong&gt; — fuzzy-open from just the fresh files via the command palette&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Deleted file indicators&lt;/strong&gt; — deleted files show up with a distinct icon&lt;/li&gt;
  &lt;li&gt;&lt;strong&gt;Auto-refresh&lt;/strong&gt; — the sidebar updates after saves, git commits, checkouts, and merges&lt;/li&gt;
&lt;/ul&gt;

&lt;h2 id=&quot;context-menu&quot;&gt;Context menu&lt;/h2&gt;

&lt;p&gt;Right-click gives you New File, Show in Finder, Copy Path, Copy Relative Path, Move to Trash, Pin/Unpin, Show File History, Diff Search, and Exhume/Resurrect for deleted files.&lt;/p&gt;

&lt;h2 id=&quot;get-it-now&quot;&gt;Get it now&lt;/h2&gt;

&lt;p&gt;You can install it at: &lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.FreshFiles/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.FreshFiles/&lt;/a&gt;&lt;/p&gt;
</description>
          <author>by Matt Sephton</author>
          <pubDate>Tue, 24 Feb 2026 13:00:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2026/02/24/fresh-files-extension-for-nova-editor/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2026/02/24/fresh-files-extension-for-nova-editor/</guid>
        </item>
      
    
      
        <item>
          <title>Remove Comments Extension for Nova editor</title>
          <description>&lt;p&gt;I’ve released a new extension for the Nova editor.&lt;/p&gt;

&lt;p&gt;It’s called &lt;em&gt;Remove Comments&lt;/em&gt; and it …removes comments from the current line, or selected lines, in your code. That’s it!&lt;/p&gt;

&lt;p&gt;Oh, I’ve tried to support as many comment/syntax formats as I can think of. Sadly it’s not possible to get the current comment formatting from the Nova API, so I had to roll my own logic and heuristics.&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.remove-comments/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.remove-comments/&lt;/a&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;examples&quot;&gt;Examples&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;JavaScript (C-style comments):&lt;/strong&gt;&lt;/p&gt;
&lt;div class=&quot;language-javascript highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;span class=&quot;c1&quot;&gt;// This comment will be removed&lt;/span&gt;
&lt;span class=&quot;kd&quot;&gt;const&lt;/span&gt; &lt;span class=&quot;nx&quot;&gt;x&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;=&lt;/span&gt; &lt;span class=&quot;mi&quot;&gt;10&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;;&lt;/span&gt; &lt;span class=&quot;c1&quot;&gt;// This trailing comment will be removed&lt;/span&gt;
&lt;span class=&quot;cm&quot;&gt;/* This block comment will be removed */&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;After running Remove Comments:&lt;/p&gt;
&lt;div class=&quot;language-javascript highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;
&lt;span class=&quot;kd&quot;&gt;const&lt;/span&gt; &lt;span class=&quot;nx&quot;&gt;x&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;=&lt;/span&gt; &lt;span class=&quot;mi&quot;&gt;10&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;;&lt;/span&gt;

&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;&lt;strong&gt;Python (hash-style comments):&lt;/strong&gt;&lt;/p&gt;
&lt;div class=&quot;language-python highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;span class=&quot;c1&quot;&gt;# This comment will be removed
&lt;/span&gt;&lt;span class=&quot;n&quot;&gt;value&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;=&lt;/span&gt; &lt;span class=&quot;mi&quot;&gt;42&lt;/span&gt;  &lt;span class=&quot;c1&quot;&gt;# This trailing comment will be removed
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;After running Remove Comments:&lt;/p&gt;
&lt;div class=&quot;language-python highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;
&lt;span class=&quot;n&quot;&gt;value&lt;/span&gt; &lt;span class=&quot;o&quot;&gt;=&lt;/span&gt; &lt;span class=&quot;mi&quot;&gt;42&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;&lt;strong&gt;HTML:&lt;/strong&gt;&lt;/p&gt;
&lt;div class=&quot;language-html highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;span class=&quot;c&quot;&gt;&amp;lt;!-- This comment will be removed --&amp;gt;&lt;/span&gt;
&lt;span class=&quot;nt&quot;&gt;&amp;lt;div&amp;gt;&lt;/span&gt;Content&lt;span class=&quot;nt&quot;&gt;&amp;lt;/div&amp;gt;&lt;/span&gt; &lt;span class=&quot;c&quot;&gt;&amp;lt;!-- This trailing comment will be removed --&amp;gt;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;After running Remove Comments:&lt;/p&gt;
&lt;div class=&quot;language-html highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;
&lt;span class=&quot;nt&quot;&gt;&amp;lt;div&amp;gt;&lt;/span&gt;Content&lt;span class=&quot;nt&quot;&gt;&amp;lt;/div&amp;gt;&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;
</description>
          <author>by Matt Sephton</author>
          <pubDate>Mon, 08 Dec 2025 15:00:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2025/12/08/remove-comments-extension-for-nova-editor/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2025/12/08/remove-comments-extension-for-nova-editor/</guid>
        </item>
      
    
      
        <item>
          <title>Three.js Completions Extension for Nova editor</title>
          <description>&lt;p&gt;I’ve released an extension to add &lt;a href=&quot;https://threejs.org&quot;&gt;Three.js&lt;/a&gt; completions support to the Nova editor.&lt;/p&gt;

&lt;p&gt;The coolest thing about this extension is that most of the code is automatically generated straight from the Three.js TypeScript files. This means there’s the potential for less errors in the data, and I can easily update the extension whenever a new release of Three.js comes out just by running a single command. Why work &lt;em&gt;harder&lt;/em&gt; when you can work &lt;em&gt;cleverer&lt;/em&gt;?&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.ThreeJS/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.ThreeJS/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You might be quick to deduce that—yes—I’m making a 3D game. 😘&lt;/p&gt;
</description>
          <author>by Matt Sephton</author>
          <pubDate>Sat, 04 Oct 2025 15:00:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2025/10/04/three-js-completions-extension-for-nova-editor/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2025/10/04/three-js-completions-extension-for-nova-editor/</guid>
        </item>
      
    
      
        <item>
          <title>Updates to Extensions for Nova editor</title>
          <description>&lt;p&gt;In late 2024, I spent some time improving my tools by &lt;a href=&quot;/2024/10/17/extensions-for-nova-editor/&quot;&gt;building a set of extensions for Nova editor&lt;/a&gt; to streamline some time-consuming tasks I encounter during blogging and game development.&lt;/p&gt;

&lt;p class=&quot;tofigure&quot;&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/nova-extensions.png&quot; alt=&quot;IMG&quot; title=&quot;My current list of extensions for Nova editor&quot; /&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;p&gt;This week, I released major updates to many of them with enhancements and new features:&lt;/p&gt;

&lt;h2 id=&quot;bookmarks&quot;&gt;Bookmarks&lt;/h2&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.Bookmarks/&quot;&gt;Version 2.0.0&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;Adds sorting, the ability to bookmark folders, marking of missing items, and other improvements.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2 id=&quot;markdown-file-linker&quot;&gt;Markdown File Linker&lt;/h2&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.MarkdownFileLinker/&quot;&gt;Version 2.0.0&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;Results in the choice palette are now sorted by default using dates found in filenames.&lt;/li&gt;
  &lt;li&gt;Along with other filtering improvements.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2 id=&quot;unwrap-paragraph&quot;&gt;Unwrap Paragraph&lt;/h2&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.unwraptext/&quot;&gt;Version 2.0.0&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;You can now unwrap the text surrounding cursor, which removes some friction.&lt;/li&gt;
  &lt;li&gt;In selected text multiple paragraphs will be unwrapped individually.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2 id=&quot;word-counter&quot;&gt;Word Counter&lt;/h2&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.wordcounter/&quot;&gt;Version 2.0.0&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;Watched words can be managed through the sidebar, added from selected text, or via typing.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2 id=&quot;yaml-tag-picker&quot;&gt;YAML Tag Picker&lt;/h2&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.YAMLTagPicker/&quot;&gt;Version 2.0.0&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;You can quickly insert or update the creation/modified ISO date in your front matter.&lt;/li&gt;
&lt;/ul&gt;

&lt;hr /&gt;

&lt;p&gt;&lt;em&gt;Plus!&lt;/em&gt; I also released a brand new extension:&lt;/p&gt;

&lt;h2 id=&quot;csv-to-md-table&quot;&gt;CSV to MD table&lt;/h2&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.csv2md/&quot;&gt;Version 1.0.0&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;Convert tabular data between CSV/TSV and Markdown formats.&lt;/li&gt;
&lt;/ul&gt;
</description>
          <author>by Matt Sephton</author>
          <pubDate>Sat, 30 Aug 2025 15:03:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2025/08/30/updates-to-my-extensions-for-nova-editor/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2025/08/30/updates-to-my-extensions-for-nova-editor/</guid>
        </item>
      
    
      
        <item>
          <title>Word Counter extension for Nova editor</title>
          <description>&lt;p&gt;So the &lt;a href=&quot;/2024/10/24/macro-extension-for-nova-editor/&quot;&gt;Macro extension&lt;/a&gt; and &lt;a href=&quot;/2024/10/17/extensions-for-nova-editor/&quot;&gt;a bunch of smaller extensions&lt;/a&gt; were supposed to be it, but it’s so much fun to create these that whenever I get an idea for an extension I can’t help making it.&lt;/p&gt;

&lt;p&gt;This time I wanted to keep track of how many times I’m calling certain functions in my code. That’s quite a niche requirement so I made a more general purpose word counter with sidebar, thresholds and coloured blobs!&lt;/p&gt;

&lt;p&gt;You can configure a list of words to count, and the thesholds that will trigger the grey/green/yellow/red coloured blobs, on a per-project basis using the workspace &lt;em&gt;Project Settings…&lt;/em&gt; panel.&lt;/p&gt;

&lt;p&gt;And you can double-click on a word in the sidebar to search the current document for it. This feature uses AppleScript so you’ll need to give Nova permissions, though it should prompt you to do that if it doesn’t have them already.&lt;/p&gt;

&lt;p&gt;Note: the screenshot below is slightly old as I’ve since refined the images in the extension.&lt;/p&gt;

&lt;p class=&quot;tofigure&quot;&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/nova-word-counter.png&quot; alt=&quot;PNG&quot; title=&quot;Counting some Playdate SDK specific function names&quot; /&gt;&lt;/p&gt;

&lt;h2 id=&quot;downloads&quot;&gt;Downloads&lt;/h2&gt;

&lt;p&gt;You can download it at: &lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.wordcounter/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.wordcounter/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;And the &lt;a href=&quot;https://github.com/gingerbeardman/Word-Counter&quot;&gt;source code is available on GitHub&lt;/a&gt; and PRs are more than welcome!&lt;/p&gt;
</description>
          <author>by Matt Sephton</author>
          <pubDate>Sun, 27 Oct 2024 17:12:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2024/10/27/word-counter-extension-for-nova-editor/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2024/10/27/word-counter-extension-for-nova-editor/</guid>
        </item>
      
    
      
        <item>
          <title>Macro extension for Nova editor</title>
          <description>&lt;p&gt;After creating &lt;a href=&quot;/2024/10/17/extensions-for-nova-editor/&quot;&gt;a bunch of smaller Nova Extensions quite quickly&lt;/a&gt; I wondered how far I could push things, just as a personal challenge. I had the idea of implementing a Macro text recording and playback system. There was something similar in TextMate editor, and whilst the Nova API doesn’t currently allow as sophisticated a system I thought it was something still worth exploring.&lt;/p&gt;

&lt;p&gt;Design of the system was incremental, with improvements and simplifications that came about through using it. It took a few aborted attempts to land on a good mechanism of recording and playing back “actions”, which currently encompass:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;insertions&lt;/li&gt;
  &lt;li&gt;deletions&lt;/li&gt;
  &lt;li&gt;cursor position changes&lt;/li&gt;
  &lt;li&gt;selection changes&lt;/li&gt;
  &lt;li&gt;selection replacements&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;I encode these changes with some simple JSON markup. Insertions are represented as text, and replacements as pairs of text, whilst deletions, cursor position changes, and selection changes are represented as numbers where positive means “to the right” and negative means “to the left”. It’s a simple system but should prove to be expandable if the Nova API is expanded to include extra capabilities, such as hooking into the &lt;em&gt;Find&lt;/em&gt;, &lt;em&gt;Files&lt;/em&gt; sidebar, or the &lt;em&gt;Command Palette&lt;/em&gt;.&lt;/p&gt;

&lt;p&gt;Macro data can end up quite large, as we’re recording single character or position changes, so I added the ability to compress a macro by coalescing actions of the same type into one. A sort of naïve huffman encoding scheme. This makes a huge difference to both size and playback speed.&lt;/p&gt;

&lt;p&gt;You can download the extension at: &lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.Macro/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.Macro/&lt;/a&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;recording&quot;&gt;Recording&lt;/h2&gt;

&lt;p&gt;Recording is done on-demand, only when you want it. A notification will signal recording has begun. When you’ve finished you click the Stop button in the notification and the macro will be automatically saved to the sidebar with a sequential name. You can rename it afterwards if you’d like.&lt;/p&gt;

&lt;p&gt;You can also start the recording using the &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;+&lt;/code&gt; sidebar icon, or using the command via the Editor menu or &lt;em&gt;Command Palette&lt;/em&gt;, but recording is always stopped through the notification. It took a while to arrive at this mechanism, and for a long time the extension was a lot more complicated and confusing to use.&lt;/p&gt;

&lt;p class=&quot;tofigure&quot;&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/nova-macro-extension-record.png&quot; alt=&quot;IMG&quot; title=&quot;Macro recording notification&quot; /&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;example-macro&quot;&gt;Example Macro&lt;/h2&gt;

&lt;p&gt;Let’s type:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Nova!&amp;lt;move left 1&amp;gt;&amp;lt;select -3&amp;gt;&amp;lt;replace &quot;ova&quot; → &quot;O&quot;&amp;gt;VA&amp;lt;move left 3&amp;gt;&amp;lt;delete 3&amp;gt;ova&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The end result of which is:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;Nova!&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;If we were to record this, the results would be…&lt;/p&gt;

&lt;p&gt;Raw macro (17 actions):&lt;/p&gt;
&lt;div class=&quot;language-json highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;name&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;Macro 1&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;actions&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:[{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;N&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;o&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;v&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;a&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;!&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;POS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;direction&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;←&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;1&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;SEL&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;-1&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;SEL&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;-2&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;SEL&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;-3&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;REP&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;old&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;ova&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;new&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;O&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;V&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;A&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;POS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;direction&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;←&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;1&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;POS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;direction&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;←&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;1&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;POS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;direction&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;←&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;1&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;DEL&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;1&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;DEL&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;1&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;DEL&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;1&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;o&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;v&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;a&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;}],&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;isExpanded&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;kc&quot;&gt;false&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;}&lt;/span&gt;&lt;span class=&quot;w&quot;&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;Compressed macro (6 actions):&lt;/p&gt;
&lt;div class=&quot;language-json highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;span class=&quot;p&quot;&gt;[{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;Nova!&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;POS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;direction&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;←&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;1&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;SEL&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;-3&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;REP&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;old&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;ova&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;new&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;O&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;VA&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;POS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;direction&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;←&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;3&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;DEL&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;count&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;mi&quot;&gt;3&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;},{&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;type&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;INS&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;&lt;span class=&quot;nl&quot;&gt;&quot;text&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;:&lt;/span&gt;&lt;span class=&quot;s2&quot;&gt;&quot;ova&quot;&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;}]&lt;/span&gt;&lt;span class=&quot;w&quot;&gt;
&lt;/span&gt;&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;Compression also helps with readability though I added a function to copy a human-readable version of the macro,which is how the &lt;a href=&quot;#example-macro&quot;&gt;text at the start of this example&lt;/a&gt; was generated.&lt;/p&gt;

&lt;p class=&quot;tofigure&quot;&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/nova-macro-extension-anim.gif&quot; alt=&quot;IMG&quot; title=&quot;Playback of the above macro&quot; /&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;sidebar&quot;&gt;Sidebar&lt;/h2&gt;

&lt;p&gt;Recorded macros live in a bespoke sidebar, and can be expanded or collapsed on demand. This allows us to see each action in the macro and exactly how the compressed version differs. The context menu provides functions to manipulate and manage the macros.&lt;/p&gt;

&lt;p class=&quot;tofigure&quot;&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/nova-macro-extension-sidebar.png&quot; alt=&quot;IMG&quot; title=&quot;Macro sidebar with raw and compressed versions, expanded to show all actions&quot; /&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h3 id=&quot;context-menu&quot;&gt;Context Menu&lt;/h3&gt;

&lt;p&gt;After a macro is recorded you can manipulate it using the context menu of items in the Macro sidebar:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;Replay&lt;/li&gt;
  &lt;li&gt;Compress&lt;/li&gt;
  &lt;li&gt;Duplicate&lt;/li&gt;
  &lt;li&gt;Rename&lt;/li&gt;
  &lt;li&gt;Copy (Compressed)&lt;/li&gt;
  &lt;li&gt;Copy (Raw)&lt;/li&gt;
  &lt;li&gt;Copy (Readable)&lt;/li&gt;
  &lt;li&gt;Delete&lt;/li&gt;
&lt;/ul&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;configuration&quot;&gt;Configuration&lt;/h2&gt;

&lt;p&gt;Recording selections adds extra weight and slowness to a macro, so whilst the extension defaults to recording text selection changes I added the option to switch it off. If you’re only interested in the smallest size macros you can enable automatic compression of every macro which happens as the macro is saved.&lt;/p&gt;

&lt;p&gt;Playback is very quick but in some situations, such as playing back for a screen recording, you might want the text to appear more slowly, so I added a playback speed option.&lt;/p&gt;

&lt;p&gt;Note: if you want to see the smoothest character-by-character playback, you should make sure compression and record selection changes are both switched off.&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;improvements&quot;&gt;Improvements&lt;/h2&gt;

&lt;p&gt;There are still some improvements I’d like to make in the future: to be able to more easily see the cursor during playback, and to highlight the current action in the sidebar so you can keep track of progress. We’ll see if/when I get around to those.&lt;/p&gt;

&lt;p&gt;The &lt;a href=&quot;https://github.com/gingerbeardman/Macro&quot;&gt;source code is available on GitHub&lt;/a&gt; and PRs are more than welcome!&lt;/p&gt;
</description>
          <author>by Matt Sephton</author>
          <pubDate>Thu, 24 Oct 2024 14:02:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2024/10/24/macro-extension-for-nova-editor/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2024/10/24/macro-extension-for-nova-editor/</guid>
        </item>
      
    
      
        <item>
          <title>Extensions for Nova editor</title>
          <description>&lt;p&gt;I’m a big believer in solving problems yourself if it’s possible rather than waiting for app updates that might never arrive. Making extensions for the &lt;a href=&quot;https://nova.app&quot;&gt;Nova editor&lt;/a&gt; that I do most of my programming and blogging in is so much fun! So, here are some of my own creation:&lt;/p&gt;

&lt;p&gt;View all: &lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/&lt;/a&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;yaml-tag-picker&quot;&gt;YAML Tag Picker&lt;/h2&gt;

&lt;p&gt;Allows you to easily select tags for the front matter in your blog posts. It scans your existing posts for tags and presents them in a Choice Palette, making it easy to maintain consistent tagging across your blog. Nice!&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.YAMLTagPicker/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.YAMLTagPicker/&lt;/a&gt;&lt;/p&gt;

&lt;p class=&quot;tofigure&quot;&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/yaml-tag-picker.png&quot; alt=&quot;IMG&quot; title=&quot;Searching existing tags for the word “play”&quot; /&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;markdown-file-linker&quot;&gt;Markdown File Linker&lt;/h2&gt;

&lt;p&gt;Allows you to insert links to local files as Markdown, perfect for linking between articles in your Jekyll blog! Also includes the ability to wrap the current text in a link, and if there’s a URL on the clipboard that’ll be used as the link destination.&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.MarkdownFileLinker/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.MarkdownFileLinker/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You choose a local file using the file selector, such as:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;/Users/matt/Projects/blog/_posts/2023/2023-11-21-yoyozo-how-i-made-a-playdate-game-in-39kb.md&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;And it will be inserted as:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;/2023/11/21/yoyozo-how-i-made-a-playdate-game-in-39kb/&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;If you’ve selected some text before invoking the extension, you’ll get:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;[YOYOZO](/2023/11/21/yoyozo-how-i-made-a-playdate-game-in-39kb/)&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;For an image you might end up with:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;![IMG](∕images/posts/yoyozo-teaser.gif)&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;reindent-o-matic&quot;&gt;Reindent-o-matic&lt;/h2&gt;

&lt;p&gt;Allows you to apply &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;.editorconfig&lt;/code&gt; indent rules to the current file, or all files matching specific extensions. Important: changes are applied but not saved, giving you the opportunity to review.&lt;/p&gt;

&lt;p&gt;Useful when reusing code from one project that used space indentation to a new one that uses tab indentation. Ideally Nova should do this automatically, and sometimes it does, but not every time for reasons I can’t figure out.&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.Reindent-o-matic/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.Reindent-o-matic/&lt;/a&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;toggle-scroll-bars&quot;&gt;Toggle Scroll Bars&lt;/h2&gt;

&lt;p&gt;Allows you to see the scrollbar at all times. This is useful because the scrollbar also contains source control change markers. With scrollbars always visible you can more easily locate changes across the entire length of your document.&lt;/p&gt;

&lt;p&gt;This has already saved me so much time and effort and I’ve only been using the editor this way for a week. So I thought I’d create an extension to make it easier for other people to enjoy this usability improvement.&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.scrollbars/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.scrollbars/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Scroll Bars on/off&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/scrollbars-on-minimap-off.png&quot; alt=&quot;on-off&quot; /&gt; &lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/scrollbars-off-minimap-off.png&quot; alt=&quot;off-off&quot; /&gt;&lt;/p&gt;

&lt;p&gt;&lt;br clear=&quot;both&quot; /&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;unwrap-paragraph&quot;&gt;Unwrap Paragraph&lt;/h2&gt;

&lt;p&gt;OK, I got carried away. This one adds the ability to merge multiple lines of selected text into one.&lt;/p&gt;

&lt;p&gt;This is useful for combining multiple lines of data into one, or reflowing a paragraph of text that has had manual line breaks applied such as something pasted from an old email. It also colalesces areas of white space into a single space. So, it’s not just “Join Lines” but something more specific.&lt;/p&gt;

&lt;p&gt;In the &lt;em&gt;TextMate&lt;/em&gt; editor this command is called Unwrap Paragraph, so I’ve kept the same name.&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.unwraptext/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.unwraptext/&lt;/a&gt;&lt;/p&gt;

&lt;h2 id=&quot;example&quot;&gt;Example&lt;/h2&gt;

&lt;p&gt;Text, before:&lt;/p&gt;
&lt;div class=&quot;language-plaintext highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;	What 
exactly does  
this   extension	
do with the
text?  🤔
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;Text, after:&lt;/p&gt;
&lt;div class=&quot;language-plaintext highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;What exactly does this extension do with the text? 🤔
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;Source code, before:&lt;/p&gt;
&lt;div class=&quot;language-lua highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;span class=&quot;p&quot;&gt;{&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x050&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x104&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x202&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x050&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x451&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x104&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x505&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x088&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x272&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x104&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt;
	&lt;span class=&quot;mh&quot;&gt;0x050&lt;/span&gt;
&lt;span class=&quot;p&quot;&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;p&gt;Source code, after:&lt;/p&gt;
&lt;div class=&quot;language-lua highlighter-rouge&quot;&gt;&lt;div class=&quot;highlight&quot;&gt;&lt;pre class=&quot;highlight&quot;&gt;&lt;code&gt;&lt;span class=&quot;p&quot;&gt;{&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x050&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x104&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x202&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x050&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x451&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x104&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x505&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x088&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x272&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x104&lt;/span&gt;&lt;span class=&quot;p&quot;&gt;,&lt;/span&gt; &lt;span class=&quot;mh&quot;&gt;0x050&lt;/span&gt; &lt;span class=&quot;p&quot;&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;&lt;/div&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;filter-through-command&quot;&gt;Filter Through Command&lt;/h2&gt;

&lt;p&gt;Run terminal commands on selected text. When you need to use a terminal command but you just want the results. The possibilities are endless as command line is your oyster! Comes with a library of useful commands including sort, base64 decode/encode, extract URLs, remove blank lines, count loc, remove HTML tags.&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.FilterThroughCommand/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.FilterThroughCommand/&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Type your own command&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/nova-filter-through-custom-command.png&quot; alt=&quot;PNG&quot; /&gt;&lt;/p&gt;

&lt;p&gt;&lt;br clear=&quot;both&quot; /&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Pick from a library of commands&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;img src=&quot;https://cdn.gingerbeardman.com/images/posts/nova-filter-through-command.png&quot; alt=&quot;PNG&quot; /&gt;&lt;/p&gt;

&lt;p&gt;&lt;br clear=&quot;both&quot; /&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;bookmarks&quot;&gt;Bookmarks&lt;/h2&gt;

&lt;p&gt;Bookmark files in the Sidebar for easier management. Ideal if the Files Sidebar is too much, or you want a simpler view of the files you are working on.&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.Bookmarks/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.Bookmarks/&lt;/a&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;tag-sync&quot;&gt;Tag Sync&lt;/h2&gt;

&lt;p&gt;Automatic synchronisation of closing tag when editing opening tag. Improve your coding efficiency by ensuring tag pairs stay synchronized while editing markup languages!&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.tagsync/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.tagsync/&lt;/a&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;openscad&quot;&gt;OpenSCAD&lt;/h2&gt;

&lt;p&gt;Adds language support for &lt;a href=&quot;https://openscad.org&quot;&gt;OpenSCAD&lt;/a&gt;: &lt;em&gt;The Programmers Solid 3D CAD Modeller&lt;/em&gt;, including both syntaxes (with highlighting) and completions (with alternate forms).&lt;/p&gt;

&lt;p&gt;&lt;a href=&quot;https://extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.openscad/&quot;&gt;extensions.panic.com/extensions/com.gingerbeardman/com.gingerbeardman.openscad/&lt;/a&gt;&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;macro&quot;&gt;Macro&lt;/h2&gt;

&lt;p&gt;Text editing recording and playback system. This one &lt;a href=&quot;/2024/10/24/macro-extension-for-nova-editor/&quot;&gt;has its own blog post&lt;/a&gt;.&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;word-counter&quot;&gt;Word Counter&lt;/h2&gt;

&lt;p&gt;Count multiple words and have their tally displayed in the sidebar. This one also &lt;a href=&quot;/2024/10/27/word-counter-extension-for-nova-editor/&quot;&gt;has its own blog post&lt;/a&gt;.&lt;/p&gt;

</description>
          <author>by Matt Sephton</author>
          <pubDate>Thu, 17 Oct 2024 20:47:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2024/10/17/extensions-for-nova-editor/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2024/10/17/extensions-for-nova-editor/</guid>
        </item>
      
    
      
        <item>
          <title>Automating the most annoying aspects of blogging</title>
          <description>&lt;p&gt;Back in 2021 I had a look around and decided to base this incarnation of my blog on an open-source &lt;a href=&quot;https://jekyllrb.com&quot;&gt;Jekyll&lt;/a&gt; theme called “&lt;a href=&quot;https://github.com/ahmadajmi/type&quot;&gt;Type&lt;/a&gt;”, though I’ve changed and added so much it’s quite some distance from the original as it stands today. As I added blog posts the performance became much worse. Initially I blamed Jekyll for this, until I took a closer look. What I learned was that the blog theme did some things in sub-optimal ways, so over the course of 2024 I have corrected as many of them as I can. Build time dropped from ~12 seconds to ~1 second.&lt;/p&gt;

&lt;p&gt;My fixes and optimisations included:&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;Optimised SASS to compile once in plugin rather than header of every page (23 Feb)&lt;/li&gt;
  &lt;li&gt;Optimised all includes and templates to reduce build time (19 Aug)&lt;/li&gt;
  &lt;li&gt;Improved “noun” replacement, which are automatically-emphasised words (3 Sep)&lt;/li&gt;
  &lt;li&gt;Better YouTube embeds using lite-yt-embed (11 Sep)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;And my additions along the way:&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;Multi-carousel support (14 Jul)&lt;/li&gt;
  &lt;li&gt;Automatic transformation of local images urls to CDN urls (19 Aug)&lt;/li&gt;
  &lt;li&gt;Automatic smart quotes in post titles (19 Aug)&lt;/li&gt;
  &lt;li&gt;Added OpenSearch to allow searching blog from address bar (15 Sep)&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You might ask… what’s left to do? Not much I reckon. So I took a closer look at what is involved in me creating a blog post and made a list of the most repetitive, awkward or error prone tasks:&lt;/p&gt;

&lt;ol&gt;
  &lt;li&gt;Entering links, partcularly links to other blog posts&lt;/li&gt;
  &lt;li&gt;Entering tags, going from memory or using search across project&lt;/li&gt;
  &lt;li&gt;Getting images onto my CDN server, currently copy by SFTP&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Let’s solve all these annoyances!&lt;/p&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;entering-links-and-tags&quot;&gt;Entering links and tags&lt;/h2&gt;

&lt;p&gt;You can read about these two in previous blog posts:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;Created &lt;a href=&quot;/2024/10/08/markdown-file-linker/&quot;&gt;Markdown File Linker&lt;/a&gt; to make linking easier (8 Oct)&lt;/li&gt;
  &lt;li&gt;Created &lt;a href=&quot;/2024/10/08/yaml-tag-picker/&quot;&gt;YAML Tag Picker&lt;/a&gt; to make tagging easier (8 Oct)&lt;/li&gt;
&lt;/ul&gt;

&lt;hr /&gt;

&lt;h2 id=&quot;getting-images-onto-my-cdn-server&quot;&gt;Getting images onto my CDN server&lt;/h2&gt;

&lt;p&gt;I was still having to copy my images to my CDN server manually, which was a pain. But the software stack on the server was intimidating. I kept putting it off for a rainy day, but I knew I would eventually get around to automating it.&lt;/p&gt;

&lt;p&gt;The idea was to not upload the images at all, but rather download them to the server directly. I’d use a GitHub Webhook to trigger a &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;git pull&lt;/code&gt; of the latest files onto my server. It took a few hours and a few attempts, but I finally arrived at a fairly elegant system I’m happy with:&lt;/p&gt;

&lt;ol&gt;
  &lt;li&gt;GitHub Webhook that runs on push event&lt;/li&gt;
  &lt;li&gt;PHP script in web server docker container receives, validates, and creates a trigger file&lt;/li&gt;
  &lt;li&gt;Service on server outside of docker looks for trigger file and does &lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;git pull&lt;/code&gt;&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Note: in January 2025, since this post was originally written, I have simplified the following files after migrating away from web servers in Docker containers to &lt;a href=&quot;https://caddyserver.com&quot;&gt;Caddy server&lt;/a&gt;. Highly recommended!&lt;/p&gt;

&lt;h3 id=&quot;github-webhook&quot;&gt;GitHub Webhook&lt;/h3&gt;

&lt;ul&gt;
  &lt;li&gt;Payload URL: https://www.example.com/webhook.php&lt;/li&gt;
  &lt;li&gt;Content type: application/json&lt;/li&gt;
  &lt;li&gt;SSL verification: enabled&lt;/li&gt;
  &lt;li&gt;Which events would you like to trigger this webhook: Just the push event&lt;/li&gt;
  &lt;li&gt;Active: on&lt;/li&gt;
&lt;/ul&gt;

&lt;h3 id=&quot;webhook-receiver-php-script&quot;&gt;Webhook receiver (PHP script)&lt;/h3&gt;

&lt;noscript&gt;&lt;p&gt;&lt;a href=&quot;https://gist.github.com/gingerbeardman/63e4dc0bce459ad6609c2701963eb61f&quot;&gt;View the source code as a Gist&lt;/a&gt;&lt;/p&gt;&lt;/noscript&gt;
&lt;script src=&quot;https://gist.github.com/gingerbeardman/63e4dc0bce459ad6609c2701963eb61f.js&quot;&gt;&lt;/script&gt;

&lt;h3 id=&quot;webhook-git-pull-watcher-shell-script&quot;&gt;Webhook git pull watcher (Shell script)&lt;/h3&gt;

&lt;noscript&gt;&lt;p&gt;&lt;a href=&quot;https://gist.github.com/gingerbeardman/e1c513c69b9e9d41aa91155893ae7334&quot;&gt;View the source code as a Gist&lt;/a&gt;&lt;/p&gt;&lt;/noscript&gt;
&lt;script src=&quot;https://gist.github.com/gingerbeardman/e1c513c69b9e9d41aa91155893ae7334.js&quot;&gt;&lt;/script&gt;

&lt;h3 id=&quot;trigger-system-service&quot;&gt;Trigger (System service)&lt;/h3&gt;

&lt;noscript&gt;&lt;p&gt;&lt;a href=&quot;https://gist.github.com/gingerbeardman/1ff95ce64a6a255919b8262dd4a21bc7&quot;&gt;View the source code as a Gist&lt;/a&gt;&lt;/p&gt;&lt;/noscript&gt;
&lt;script src=&quot;https://gist.github.com/gingerbeardman/1ff95ce64a6a255919b8262dd4a21bc7.js&quot;&gt;&lt;/script&gt;

&lt;h3 id=&quot;access-control&quot;&gt;Access control&lt;/h3&gt;

&lt;noscript&gt;&lt;p&gt;&lt;a href=&quot;https://gist.github.com/gingerbeardman/23e0da9949a8d41ebd190d60b0bd033b&quot;&gt;View the source code as a Gist&lt;/a&gt;&lt;/p&gt;&lt;/noscript&gt;
&lt;script src=&quot;https://gist.github.com/gingerbeardman/23e0da9949a8d41ebd190d60b0bd033b.js&quot;&gt;&lt;/script&gt;

&lt;h3 id=&quot;setup&quot;&gt;Setup&lt;/h3&gt;

&lt;p&gt;You can set up the service using:&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;sudo systemctl daemon-reload&lt;/code&gt;&lt;/li&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;sudo systemctl start git-pull-watcher&lt;/code&gt;&lt;/li&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;sudo systemctl enable git-pull-watcher&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Other commands&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;sudo systemctl restart git-pull-watcher&lt;/code&gt;&lt;/li&gt;
  &lt;li&gt;&lt;code class=&quot;language-plaintext highlighter-rouge&quot;&gt;sudo systemctl status git-pull-watcher&lt;/code&gt;&lt;/li&gt;
&lt;/ul&gt;
</description>
          <author>by Matt Sephton</author>
          <pubDate>Fri, 11 Oct 2024 16:42:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2024/10/11/automating-the-most-annoying-aspects-of-blogging/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2024/10/11/automating-the-most-annoying-aspects-of-blogging/</guid>
        </item>
      
    
      
        <item>
          <title>Adding Markdown Support to Safari</title>
          <description>&lt;p&gt;I recently created a Safari Extension that renders plain text Markdown files as good looking HTML right in your browser. I also added a context menu item so you can swap between the rendered HTML and the original Markdown text.&lt;/p&gt;

&lt;h2 id=&quot;download&quot;&gt;Download&lt;/h2&gt;

&lt;p&gt;&lt;a href=&quot;http://www.gingerbeardman.com/safari/Doctor.safariextz&quot;&gt;gingerbeardman.com/safari/Doctor.safariextz&lt;/a&gt; (25Kb)&lt;/p&gt;

&lt;p&gt;To install: double click the file after it has downloaded.&lt;/p&gt;

&lt;h2 id=&quot;why&quot;&gt;Why?&lt;/h2&gt;

&lt;p&gt;Recently my buddy and fellow Former Apple Technology Evangelist @&lt;a href=&quot;https://medium.com/u/35a6b2e3855b?source=post_page-----c19f3d74f728--------------------------------&quot;&gt;TDRBY&lt;/a&gt; asked if there was an extension available for rendering Markdown files in Safari. I had a quick look—there wasn’t—and that got me thinking.&lt;/p&gt;

&lt;p&gt;On macOS you can use Quick Look plugins to add support for new file types to Finder’s Quick Look preview popup. These plugins are great, I use a bunch of them, but they only apply in Finder and not in Safari. Maybe I could do something similar?&lt;/p&gt;

&lt;p&gt;So, knowing that Safari renders plain text files by wrapping them in simple &lt;em&gt;HTML&lt;/em&gt; &amp;gt; &lt;em&gt;BODY&lt;/em&gt; &amp;gt; &lt;em&gt;PRE&lt;/em&gt; markup, I thought that an extension should be able to modify such files. That was enough to pique my interest—so I got to work!&lt;/p&gt;

&lt;h2 id=&quot;how&quot;&gt;How?&lt;/h2&gt;

&lt;p&gt;The extension took less than an hour to put together. This blog post took me a lot more time to write! Anyway, here’s how I did it:&lt;/p&gt;

&lt;ol&gt;
  &lt;li&gt;Create new extension using &lt;em&gt;Safari&lt;/em&gt; &amp;gt; &lt;em&gt;Develop&lt;/em&gt; &amp;gt; &lt;em&gt;Extension Builder&lt;/em&gt; &amp;gt; &lt;em&gt;+ button&lt;/em&gt;&lt;/li&gt;
  &lt;li&gt;Set website access level to &lt;em&gt;All&lt;/em&gt;&lt;/li&gt;
  &lt;li&gt;Confirm extensions run on plain text files in Safari by adding a CSS file containing only &lt;em&gt;body { background-color: red !important; }&lt;/em&gt;—success, they do!&lt;/li&gt;
  &lt;li&gt;Find a suitable JavaScript Markdown to HTML converter &lt;a href=&quot;https://github.com/showdownjs/showdown&quot;&gt;showdown.js&lt;/a&gt;—this ticks two important boxes: it is easy to use, and is still being actively developed&lt;/li&gt;
  &lt;li&gt;Write a few lines of JavaScript to run &lt;em&gt;showdown.js&lt;/em&gt; on the page text and replace it with the generated HTML&lt;/li&gt;
  &lt;li&gt;Add &lt;a href=&quot;https://github.com/sindresorhus/github-markdown-css&quot;&gt;github-markdown.css&lt;/a&gt; and apply the &lt;em&gt;markdown-body&lt;/em&gt; class to make things look better&lt;/li&gt;
  &lt;li&gt;Configure the extension to run only on URLs ending in &lt;a href=&quot;http://superuser.com/a/285878&quot;&gt;common Markdown file extensions&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;Manually add &lt;em&gt;https://&lt;/em&gt; variations of the Markdown file extensions to the &lt;em&gt;Info.plist&lt;/em&gt; (far quicker than using the Extension Builder user interface)&lt;/li&gt;
  &lt;li&gt;Edit the .map file reference out of the minimised &lt;em&gt;showdown.js&lt;/em&gt; to avoid a runtime access warning&lt;/li&gt;
  &lt;li&gt;Build the release package&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;At this point I’d like to mention a couple of great open-source projects that made this task so much easier: &lt;a href=&quot;https://github.com/sindresorhus/github-markdown-css&quot;&gt;github-markdown.css&lt;/a&gt; by &lt;em&gt;Sindre Sorhus&lt;/em&gt;, and &lt;a href=&quot;https://github.com/showdownjs/showdown&quot;&gt;showdown.js&lt;/a&gt; by &lt;em&gt;Estevão Soares dos Santos&lt;/em&gt;—nice work guys!&lt;/p&gt;

&lt;h2 id=&quot;testing&quot;&gt;Testing&lt;/h2&gt;

&lt;p&gt;There are Markdown files all over the internet, but two notable source stand out.&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;Almost every GitHub project has a README.md file. View the RAW version to have the extension render it as HTML. Here’s &lt;a href=&quot;https://raw.githubusercontent.com/primer/primer-markdown/master/README.md&quot;&gt;the one I used&lt;/a&gt; for testing.&lt;/li&gt;
  &lt;li&gt;&lt;a href=&quot;https://medium.com/u/182e1a455da3?source=post_page-----c19f3d74f728--------------------------------&quot;&gt;John Gruber&lt;/a&gt;’s excellent &lt;a href=&quot;http://daringfireball.net&quot;&gt;daringfireball.net&lt;/a&gt; blog is written using Markdown, and the source of each post can be seen by appending .text to the URL. Here are &lt;a href=&quot;http://daringfireball.net/linked/2016/11/15/designed-by-apple-in-california.text&quot;&gt;two&lt;/a&gt; &lt;a href=&quot;http://daringfireball.net/2016/11/new_touch_bar_equipped_macbook_pros.text&quot;&gt;posts&lt;/a&gt; that I used to test. Of course, John is also the creator of Markdown. Thanks, John! 👍&lt;/li&gt;
&lt;/ul&gt;

&lt;h2 id=&quot;postmortem&quot;&gt;Postmortem&lt;/h2&gt;

&lt;p&gt;After the initial build, a period of testing revealed some issues:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;Strikethrough, and some other non-standard but frequently used Markdown, was not being rendered. This was fixed by enabling some options in the &lt;em&gt;showdown.js&lt;/em&gt; file.&lt;/li&gt;
  &lt;li&gt;Rendering quirks due to using &lt;em&gt;github-markdown.css&lt;/em&gt; outside of the GitHub page structure required few manual CSS tweaks. Mainly this was to make tables look better.&lt;/li&gt;
  &lt;li&gt;Markdown on GitHub that was already rendered as HTML was being processed a second time, resulting in corrupted pages. This was fixed by blacklisting the &lt;em&gt;github.com&lt;/em&gt; domain.&lt;/li&gt;
  &lt;li&gt;Sometimes I wanted to see the plain text Markdown. I fixed this by spending an inordinate amount of time adding a context menu item that allows you to &lt;em&gt;Show&lt;/em&gt; or &lt;em&gt;Render Markdown&lt;/em&gt;. I hope it was worth it! 😬&lt;/li&gt;
&lt;/ul&gt;

&lt;h2 id=&quot;safari-wish-list&quot;&gt;Safari Wish List&lt;/h2&gt;

&lt;p&gt;Despite the brief development, I noticed a few quirks to do with Safari that I did not expect to encounter:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;You can’t open the Web Inspector whilst viewing a plain text file. But if you open the inspector on a blank tab, or an existing HTML page, you can then navigate to the plain text file and the inspector will remain open. Phew!&lt;/li&gt;
  &lt;li&gt;Due to the way Safari Extension access permissions work, I have had to enable the extension for all pages and then reduce its power by whitelisting a range of Markdown file extensions. This feels like cracking a nut with a sledgehammer.&lt;/li&gt;
  &lt;li&gt;Extensions do not run on local &lt;em&gt;file:///&lt;/em&gt; documents. 😩&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Please join me in &lt;a href=&quot;http://bugreport.apple.com&quot;&gt;filing enhancement requests with Apple&lt;/a&gt; if you’d like to add your support to any of the above points.&lt;/p&gt;

&lt;h2 id=&quot;thanks-for-reading&quot;&gt;Thanks for reading!&lt;/h2&gt;

&lt;p&gt;If you have any questions feel free to get in touch using &lt;a href=&quot;http://twitter.com/gingerbeardman&quot;&gt;twitter&lt;/a&gt; or &lt;a href=&quot;http://www.gingerbeardman.com&quot;&gt;my website&lt;/a&gt;. I’m interested to see more extensions that add support for other file formats in Safari. And I’m available to help you make better products!&lt;/p&gt;
</description>
          <author>by Matt Sephton</author>
          <pubDate>Fri, 25 Nov 2016 00:00:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2016/11/25/adding-markdown-support-to-safari/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2016/11/25/adding-markdown-support-to-safari/</guid>
        </item>
      
    
      
        <item>
          <title>iStock: Download large comp</title>
          <description>&lt;p&gt;Back in 2012, before my time at Apple, I was a contract developer and would often work with designers on specific projects. Over the course of those projects, we’d have to find stock photos for the apps or websites we were building and generally turned to &lt;a href=&quot;https://www.istockphoto.com&quot;&gt;iStockPhoto&lt;/a&gt; as our main resource.&lt;/p&gt;

&lt;p&gt;During the design phase we would go through number of different image options, using the watermarked thumbnail images from iStock as temporary placeholders, or &lt;a href=&quot;https://en.wikipedia.org/wiki/Comprehensive_layout&quot;&gt;comps&lt;/a&gt;, before settling on the final image that we would buy.&lt;/p&gt;

&lt;p&gt;As well as the thumbnail, iStock also offered a zoom function that let you scroll around a large version of the photo. It occurred to me that I might be able to use this to get a larger watermarked comp for download?&lt;/p&gt;

&lt;h2 id=&quot;version-1&quot;&gt;Version 1&lt;/h2&gt;

&lt;p&gt;In 2012, iStock’s zoom function loaded in the larger image split in tiles. My hunch is that this was to prevent people from downloading the larger version, as I doubt it would be much of a bandwidth saving mechanism.&lt;/p&gt;

&lt;p&gt;Regardless, I was undaunted and up for the challenge. My first attempt at solving the problem, to prove that it was possible, was a UserScript. This is a snippet of JavaScript that can be run using an extension like &lt;a href=&quot;http://www.greasespot.net&quot;&gt;GreaseMonkey&lt;/a&gt; or &lt;a href=&quot;https://github.com/os0x/NinjaKit&quot;&gt;NinjaKit&lt;/a&gt; in much the same way as a native browser extension. They’re a very quick way to prototype an idea.&lt;/p&gt;

&lt;p&gt;After the concept was proven I wrote extensions for both Safari and Chrome. When triggered—via a modified link on the page—the extension would zoom the image to the highest level, then programmatically grab each tile, composite the tiles together on a HTML5 canvas element, and finally convert the canvas into a large JPEG image that can easily be downloaded.&lt;/p&gt;

&lt;p&gt;A lot of effort, you might say, but it worked very well and became quite popular throughout the design community.&lt;/p&gt;

&lt;h2 id=&quot;version-2&quot;&gt;Version 2&lt;/h2&gt;

&lt;p&gt;In early 2013 iStock changed their website to remove the zoom feature, allowing the large comp to be accessed directly without having to stitch together a bunch of tiles. I updated my extensions to cope with these changes, which of course involved throwing out most of the code I’d written for the first version.&lt;/p&gt;

&lt;p&gt;As a software developer you learn to be ready to &lt;a href=&quot;http://c2.com/cgi/wiki?KillYourDarlings&quot;&gt;kill your darlings&lt;/a&gt; during any sort of refactoring.&lt;/p&gt;

&lt;h2 id=&quot;version-3&quot;&gt;Version 3&lt;/h2&gt;

&lt;p&gt;Today I release the third version of the extension, rewritten to work with the current iStock website. The extension becomes even simpler, but remains incredibly useful. You can &lt;a href=&quot;http://www.gingerbeardman.com/safari/&quot;&gt;download it at my website&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;This version adds a link—a green “Download large comp” button—below the existing, red “Download this photo” button. The beauty of this new link is that it is more usable and friendly than the previous versions of the tool.&lt;/p&gt;

&lt;p&gt;The download can be triggered in a few different ways:&lt;/p&gt;

&lt;ul&gt;
  &lt;li&gt;Clicking the green button will open the zoomed image in a new tab.&lt;/li&gt;
  &lt;li&gt;Option-clicking the green button to download the large comp immediately.&lt;/li&gt;
  &lt;li&gt;Right-clicking on the green button will to show a contextual menu with further options, such as the ability to copy the web address.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;This version will hopefully last for a while, but I’ll be keeping my eye on it. &lt;a href=&quot;https://github.com/gingerbeardman/iStockLargeComp.safariextension&quot;&gt;The source code is, of course, on GitHub&lt;/a&gt;.&lt;/p&gt;

&lt;p class=&quot;tofigure&quot;&gt;&lt;img src=&quot;https://miro.medium.com/max/1400/1*LdtRYi2Bv7oBTKTpLtXC-w.jpeg&quot; alt=&quot;&quot; title=&quot;iStockLargeComp: notice the new green button&quot; /&gt;&lt;/p&gt;

&lt;h2 id=&quot;final-thoughts&quot;&gt;Final thoughts&lt;/h2&gt;

&lt;p&gt;I have a lot of fun building extensions. Not just because it involves programming, DOM manipulation using JavaScript, and some HTML and CSS for styling. For me, the real fun comes out of deconstructing the inner workings of the webpage—I guess you could call it reverse engineering—and then implementing a solution that will not only work well, but be resistant to breaking at the slightest changes to the page it is modifying.&lt;/p&gt;
</description>
          <author>by Matt Sephton</author>
          <pubDate>Mon, 30 Jul 2012 00:00:00 +0000</pubDate>
          <link>https://blog.gingerbeardman.com/2012/07/30/istockphoto-download-large-comp/</link>
          <guid isPermaLink="true">https://blog.gingerbeardman.com/2012/07/30/istockphoto-download-large-comp/</guid>
        </item>
      
    

  </channel>
</rss>
