Skip to content

JavaScript

Control animated GIF playback on WordPress sites

I wanted to embed an animated GIF in my post about changing the iOS Settings screen. However, because the GIF was about 4MB in size, I didn't want it to auto-load—and in general, I find auto-playing GIFs annoying. I wanted something that would stop and start on click, like this (wonderfully subtle) example GIF…

So I did what any WordPress user would do in such a situation: I went looking for a WordPress plug-in that offered control over GIFs.

I initially found WP GIF Player and GIF Animation Preview. Both did what I wanted, mostly, but they added a bunch of their own HTML and CSS, and/or relied on the WordPress media library (which I don't use). After testing both, I just couldn't get them to work with the GIF and the size/position that I wanted to use. Perhaps there are others that would work, but I got frustrated and gave up searching.

[continue reading…]



A much-improved special character palette

A while back, I created a pop-up character palette using Keyboard Maestro to allow easy insertion of the Mac's special characters (like , ⌘, ⌥, etc.). While this worked fine, I discovered a few major shortcomings:

  • I couldn't create more than one character without calling up the palette again.
  • I had to decide in advance if I wanted HTML entities or the actual characters.
  • Two palettes (HTML or character) meant two keyboard shortcuts to remember.
  • Adding characters to the palette was a real pain, because they had to be done twice.
  • I was out of digits for shortcuts, so I was going to have to change the palette structure.
  • It was slow: From calling up the palette to identifying which icon I wanted to use to selecting that icon, and then doing it all again for a second character was just really slow.

I set out to fix all of these issues, thinking I could use Keyboard Maestro's Custom HTML Prompt action, as I did for my iTunes song info window. And, in the end, that's what I used for the new-and-improved character palette:

This doesn't have to be used just for Mac special characters, of course. You could make yourself a customized pop-up for emoji, math symbols, whatever…

Read on for the how-to and download, if you'd like to put this to use…

[continue reading…]



Create an iTunes song info window using Keyboard Maestro

For those who aren't aware, Keyboard Maestro is a macro-creation tool, designed to help you automate routine tasks. But its powers let you do some really cool stuff, not all of which could be classified as automation. Such is the case with this project: Creating an iTunes song info pop-up window.

There are lots of apps out there—including Many Tricks own Butler—that can do this for you, and my Keyboard Maestro version is worse than most of those in many respects. However, I wanted to teach myself more about Keyboard Maestro, and this seemed like a good project with which to do so.

I use Buter's iTunes pop-up info window, which looks like this:

I wasn't really interested in the rating or volume controls (though they should be doable), but I wanted to see if I could get the album art and song info in a window via Keyboard Maestro. After some struggles, here's what I came up with in Keyboard Maestro:

My window is larger by design, so I can have somewhat more visible album art (aging eyes). And I can't decide on a background color or gradient, so it keeps changing—this was the look when I snapped the screenshot, but it's since changed again.

Read on if you'd like to know more about Keyboard Maestro, and how I used it to create this iTunes info window. (Note that this write-up assume some familiarity with Keyboard Maestro, though I try to explain each step in the process.)

[continue reading…]