Any Background Color You Want for Individual WorkFlowy Lists: Tweaking “Painter For WorkFlowy” Chrome Extension


This is for those among us who squeeze a lot out of WorkFlowy in the Chrome browser. This is also for those who like a tad bit of (the “right”) color in their outlines… Continue reading “Any Background Color You Want for Individual WorkFlowy Lists: Tweaking “Painter For WorkFlowy” Chrome Extension”

Markdown Preview Directly in any WorkFlowy List


This is for all of you Markdown fans out there… and a teaser for those of you who need to take your writing places (and have yet to discover what Markdown is). Learning Markdown is as easy as remembering the names of 5-10 new people, max. And the more you engage with those people, the easier it is to remember their names. Go ahead and Google Markdown. I double dare you.

It doesn’t get any better than implementing Markdown in an outliner. If you’re a Markdown adept and you haven’t been writing directly in WorkFlowy, you’ve been seriously missing out on the punch that WorkFlowy packs as an outliner – you know, the ability to organize your thoughts. In my book I walk you through automating Markdown writing in WorkFlowy – from the very first bullet of your body of work all the way up to Word and Adobe Indesign for self publishing.

Seeing is believing

So you’re a Markdown junkie and you want to preview your work – to see what your end format looks like – especially displaying any images you might have – instead of copying to an online Markdown tool in another browser tab. Wouldn’t it be something if you had one simple keyboard shortcut that gave you the ability to preview (see the HTML) of whatever list you’ve zoomed into – right in WorkFlowy? I’ve been doing this for a couple of weeks already, and it’s sublime. First a show and tell… and then I’ll explain the very few steps to set it up. It’s going to be a breeze.

In the GIF below, I’ve zoomed into a chapter from my book (written in Markdown in WorkFlowy). All I do is hit Ctrl+Shift+F5 to have a configurable window that pops up with the entire contents of my list, giving me a preview of my work. I can resize or fully expand that window as I wish:

… and the best part is that every time I zoom into the same list, the exact same window will be right there where I left it:

I can minimize the window to a teeny tiny tile, place it wherever I want… and click on it whenever I want to preview my Markdown:

Presentation mode

Remember the Alt/Ctrl+Shift+9/0 Keyboard shortcuts from this post? What you’ll see in the below GIF is that I’ve created a Markdown “preview window” for each of the chapter lists within a section of my book. If I expand each preview window to fullscreen mode before exiting, when I flip between chapters using the above keyboard shortcuts, I get a presentation in HTML, especially if I go into my browser’s fullscreen mode. Tell me this is not brilliant:

Your toolbox

Now for the behind the scenes stuff. After this simple setup, it’s all smooth sailing from there on out. Here are the free tools you’ll need to make it happen:

  1. Chrome browser
  2. Web Page Sticky Notes Chrome extension.
  3. PhraseExpress (optional)

Web Page Sticky Notes Chrome extension

This little Chrome extension is what makes it possible. That, and the fact that every single list of yours in WorkFlowy has it’s own unique URL.

What this extension allows one to do is attach sticky note(s) to any web page you want. Any color, size, font family, etc., etc. When you revisit a web page where you created sticky notes, your note(s) will be exactly the way you left them. It simply works. So your mind is probably now racing with all the possibilities. You can use this extension just as most people do… or you can use it as a “preview window” for your Markdown writing. That’s the gist of it.

A quick Q&A:

Q: What happens if something goes wrong with the extension and you lose all your notes?

A: In the unlikely event, keep in mind that for the purpose of previewing your Markdown writing in WorkFlowy, essentially you’re copying existing information from any zoomed in list into your preview window. Nothing to lose, everything to gain. There’s no hard work to lose: Even starting from scratch, all you do (after the setup I’m going to show you) is hit your own tailor-made shortcut (Ctrl+Shift+F5 for me) in any list you’re currently in… and Bob’s your uncle.

In the same vein, I wouldn’t recommend that you go out of your way to create sticky notes containing new information – mostly because you won’t be able to filter/search for them within WorkFlowy.

Monkey see, monkey do

When you first install the Sticky Notes extension, your default settings will be a tad different. Here are the few tweaks I made in a one-time setup:

SETTINGS: Tool icon, top right of the note

  1. Default Background Color: white
  2. Default Width: 400px / Default Height: 250px
  3. Disable Auto Resize: Yes
  4. Default Rendering/ Editing Mode: Github Flavored Markdown


PhraseExpress (Windows) is optional. You could also attempt the same key-stroke automation with AutoHotkey (Windows) or Keyboard Maestro (Mac).

Basically what one of the above tools will allow you to do is to take what would have been exactly 5 keyboard strokes or shortcuts and whittle it down to just 1. Here’s the command you can paste directly into the “Phrase Content” field of a new PhraseExpress phrase. Then just choose an available shortcut (after testing in WorkFlowy):

  • {#CTRL -chars A -count 2}{#clipboard -copy}{#CTRL {#SHIFT {#INS}}}{#CTRL {#SHIFT -chars V}}{#CTRL {#HOME}}

UPDATE: (4/27/2016) Due to a tweak on WPSN’s part, in the above code I have swapped out a clipboard paste, with Ctrl+Shift+V, which pastes as plain text into the Sticky Note, thereby avoiding pasting in rich text, along with your WorkFlowy outline formatting. It’s good to go!

The essential ingredient in simulating the above sequence of keyboard shortcuts is finding out what the keyboard shortcut for the Web Page Sticky Note Chrome extension is to bring up a new note. The default is Ctrl+Shift+Ins.

It’s a wrap!

One final tip: make sure your entire list is expanded before you either copy your list manually (Ctrl+A,A) or activate your keyboard shortcut. You can do this by double-clicking on your list’s title.

Happy previewing!

Here’s the WorkFlowy list that I wrote this blog post in (in Markdown). You can use it to test the Web Page Sticky Note Chrome extension once you’ve installed it. (You’ll need to add the list to your account before giving it a working over).

Get EXCLUSIVE bite-sized  WorkFlowy  updates: tips, tricks & news about FREE online workshops with Frank Degenaar. Sign up here.