Megan Taylor

front-end dev, volunteacher, news & data junkie, bibliophile, Flyers fan, sci-fi geek and kitteh servant

Journalism Warning Stickers Bookmarklet – Help?

When I first saw Tom Scott’s Journalism Warning Stickers, my first thought was that surely, by the next day, someone would have written a bookmarklet for them.

I haven’t seen one yet, so I’m taking a stab at it myself. (I’ve never written a bookmarklet before, so we’ll see how this works out…)

The idea: Create a bookmarklet that will open up a j.mp or Publish2 style sidebar overlay. From here, you can select which sticker to overlay on a web page, and create a URL for the page WITH the overlay to share on Twitter, FB, etc.

So far, I have the script that will overlay an image on a website:

javascript:
(function(){
  document.body.innerHTML+='<img src="http://www.megantaylor.org/jwarnings
/jwarnings_02.gif?x23240" style="position:absolute; left: 200px; top: 150px; z-index: 1000">';
}
)();

The image URLs are jwarnings_02.gif, 03.gif, etc.

I tried to link the bookmarklet here, but I think WP is messing with my code. Here’s a quick example of the output:

Journalism-Warning-Labels-Tom-Scott

I’m gonna keep working on this, but if anyone wants to give me a hand, or point me in the direction of some useful code, I’d really appreciate it.

8 Comments