Preview Images in WorkFlowy with Imagus

By

February 9, 2016

blog-book-button

Now here’s a no-fuss extension which shows images when hovering over image links in WorkFlowy (and the whole of the www, really). The best part about it?… No Markdown formatting is required for links, it works in all major browsers… and it doesn’t break your WorkFlowy flow.

Whether you’re adding Imagus as an extension to Chrome or an add-on in Firefox (etc.), it’s as easy as 2 clicks:

After refreshing WorkFlowy in your browser, here’s the result:

Browsers

Opera, Firefox, Chrome, Safari… and more.

Chrome store

Imagus

Web page (for other browsers)

Imagus

(But two of the) cool features

(1) Right click (long press) on an image link to “activate” an image

  • You can then zoom by scrolling the mouse wheel/ 2-finger scroll on mousepad
  • You can drag the image to desktop (or elsewhere)

(2) Anywhere on the web you can hover over thumbnail images to enlarge them… heck, you can even use this to expand the WorkFlowy blog images now! Take it for a spin 🙂

Extension Options > Preferences

There are a load of options to tinker with. I’ve looked through all of them and recommend the following 4 tweaks:

  1. Display delay (ms)set to 0 (zero)
  2. Add hovered links to the browser historyuncheck to not clutter browser history
  3. Show caption text – toggle for preference
  4. Custom style (CSS) (check advanced button) – cleaner border: change “box-shadow: 0 0 2px” to “box-shadow: 0 0 0px”

A search tip

Most of your image links in your account will have an image extension in the URL, so you can search account wide from your home page by using the “OR” operator:

  • .png OR .jpg OR .gif
  • … or whatever else might predominantly occur in your image links

Are you holding out on us?

If you’re sitting on any useful tips, tricks or ways of using WorkFlowy that you’d like to share with all WorkFlowyans everywhere, please touch base with me: frankman777(at)gmail(dot)com


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

0 0 votes
Article Rating
Subscribe
Notify of
guest

21 Comments
Inline Feedbacks
View all comments
George
George
6 years ago

Actually was I talking about using Imagus to pop up an image from a link in a note. But maybe I misunderstood that?

frank.dg
frank.dg
6 years ago
Reply to  George

Aaah, you were clear in your first comment.

I’m not sure what constitutes a good link for Imagus to act on… and it pretty much works on just about everything… although I have found Google Drive images to be a bit of a challenge in the past while tinkering – both with Imagus and previewing Markdown images. Did anything in the shared list help? I would imagine Rawbytz’s tips there would help for anything related to getting Google Drive images to show up using different methods. The regular Google Drive image links seem to be different to most other image links on the whole of the www. I’m not sure why.

frank.dg
frank.dg
6 years ago
Reply to  George

George, I just popped an image into GD and grabbed the link. I then visited the image online, right clicked on it and opened it in a new tab. I then grabbed that URL. That works with Imagus.

Here’s the original link:

https://drive.google.com/file/d/0Bwjxbpvp_B6fcFpjVW9ZckZNUnM/view?usp=sharing

I right clicked on that and opened in a new tab and got this URL:

https://lh4.googleusercontent.com/_3DvNDODTPiylSMmBpEJoZ63_DDkGSwXCSvSkQwvvrDJ6yR5DPcN7SA8suMAJoHO_q0cBVMj3chAyfI=w1366-h662

The above link, when hovered over should give you an image preview (via Imagus)

It is rather long, but it works. It’s not really a WorkFlowy thing… just the way GD has set up their link sharing/ viewing.

frank.dg
frank.dg
6 years ago

Hey George,

Are you talking specifically about getting image previews using Imagus or about having Markdown images show in WorkFlowy (another post I wrote)? I myself use Dropbox… but here’s a shared list by Rawbytz that might give you some insight into Google Drive image links:

https://workflowy.com/s/C7C.hJFCjpFWJI

George
George
6 years ago

I store most images I have on our google drive folder i.e. https://drive.google.com/file/d/%5Bbunch of identifying code/hex here]/view. Imagus doesn’t seem to be able to work around that when I post the full path in Notes. Am I missing something or do I have to put this in my Dropbox – I would think if it was accessible through DBx, then Google Drive should be able to make it work?

Thanks for any pointers – and thanks again for a great book!

trackback

[…] Imagus allows me to hover over image links to preview. […]

EL
EL
7 years ago

Awesome tip – just what I need!

Is there any way to get this working in the Chrome Workflowy App? (I like to use it because it has a separate icon in the taskbar, and I like to split the screen between my browser and my Workflowy.)

frank.dg
frank.dg
7 years ago
Reply to  EL

Hi El, have you tried what Rawbytz calls WorkFlowy Window? That might be a solution for you… Imagus will do its thing there too. Here’s a post by Rawbytz explaining how to set up “WorkFlowy Window”:

Just as with your (offline capability) Chrome app which gives you an icon in your Windows task bar, you can also pin this Chrome shortcut to your task bar. I don’t like the pixelated icon… but it does the trick. Oh, and Rawbytz also explains in his post that it’s an online tool. Doesn’t work offline.

There are other advantages too, such as having access to other Chrome extensions.

Quick question… besides using “WorkFlowy Window” or the Chrome app you’re talking about, how about opening WorkFlowy in a separate browser window? You could still split your screen between WorkFlowy and another window with miscellaneous tabs.

Stefano F. Rausch
7 years ago

Perfect — exactly what I was looking for!

Kelly
Kelly
7 years ago

Will definitely be using this feature

cflat7
7 years ago

I had this add-on turned on yesterday when I was trying it out. Later in the day I was browsing for some images in Google search and found it very distracting as I scrolled through the images: it kept popping up previews and obscuring things (and generally getting in the way) as I was trying to scroll around and navigate through the list of images. I tried using the keyboard shortcut to turn it off but that didn’t seem to be 100% reliable. I had to eventually delete the add-on and restart Chrome in order to search for images without stuff popping up every 2 seconds. It’d be nice if it had a button to just turn it on/off globally.

frank.dg
frank.dg
7 years ago
Reply to  cflat7

You are able to choose a disable key in options

… also Alt+Shift+D (or a default shortcut of your choosing) suspends Imagus for the current session and domain.

I find that when scrolling (anywhere) via 2-finger mousepad scroll, nothing at all is activated on hover over. It’s only when you hover over images with your cursor that they pop open… so I find that Imagus is pretty awesome once you know when and how it works. Especially when browsing for images in Google images, Facebook, Google+, Twitter, etc.

Not sure whether I want to do without Imagus when on the web in general. Saves me a lot of clicking on images and links.

There are many ways to scroll, including the space bar… but I’m not sure whether one can even scroll by moving the cursor around the screen – which is when images pop up… unless one uses a cursor predominantly as a placemarker when viewing images or reading text.

cflat7
7 years ago
Reply to  frank.dg

I was on a desktop (not mobile) trying to use the mouse wheel to scroll up and down. I tried the disable key sequence and that worked but for reason the previews started popping up again later, not sure why. Most of my work on the web doesn’t need previewing images so I won’t miss not having it turned on. It’s a cool add-on though for those that need it.

rawbytz
7 years ago
Reply to  cflat7

I find it a bit too ‘global’, as well… thankfully, you have complete control of where Imagus is active via Options > Sieve

To disable Google Images:
• GoTo:
chrome-extension://immpkjjlgappgfkkfieppnmlhakdmaab/options.html#sieve
• search for ‘google’
• Ctrl+Click on GoogleImages to select it (it gets shaded)
• Click on the Ø icon (the text will turn red when disabled)
• Save

JuanCar
JuanCar
7 years ago
Reply to  rawbytz

If you prefer to have it working only in Workflowy, you can just disable all domains, except workflowy.com (and others)
• Go to Option/Grants: chrome-extension://immpkjjlgappgfkkfieppnmlhakdmaab/options.html#grants
• Write this
!:*
~:https://workflowy.com/
• Save

frank.dg
frank.dg
7 years ago
Reply to  rawbytz

Thanks Juan! Very useful tip for many here 🙂

Simon Redgrave (@SumOfAllForms)

Very good, thanks Frank – this is a keeper 🙂

LukeMt
LukeMt
7 years ago

Excellent!

When using Safari, Caution! It may mess up the scrolling behavior:
I installed the Safari extension and now when hovering over notes scrolling won’t work anymore. So, don’t use it with Safari.
The good news however is, when you use Safari on a Mac, you may not need it.
A similar feature is baked into Safari. Tap with tree fingers on an image link and you get a preview popup. Works even with whole webpages.
[I’m using a 2010 MacBook with OS X Yosemit, Chrome and Safari]

With Chrome the extension works great.

Thanks!

pottster
pottster
7 years ago

Thanks Frank. Another one for our Workflowy toolbox!

alanneese
alanneese
7 years ago

Excellent tip! I’ve been waiting for this for a long time. Nice work!

cflat7
7 years ago

This is great… one thing I realized is that for the zoom with the mouse-wheel to work, you need to active the image (as you mention) not just have it pop-up when you hover over the link/thumbnail, as you mention.

Subscribe to the newsletter

We'll send you a weekly roundup of the latest posts

Overwhelmed?

Workflowy replaces your notebooks, stickies and bloated apps with a simple, smooth digital notebook that makes it easy to get organized and be productive.