SnowBlog: The Snowball Factory Blog

If you have a self-hosted WordPress blog, the code below will not work for you. Instead, go here to get the plugin.

Techmeme is an essential news discovery tool for me. It replaced my RSS reader and the totally unmanageable list of blog feeds that came with it years ago, and now I’d estimate that at least 95% of the news I consume is discovered via Techmeme or Twitter. For me, more than Digg or Hacker News or anything else, Techmeme is my social news source.

As such, it was big news to me when Techmeme announced this past Wednesday that they’re now accepting “tips” via Twitter. So much so that I was hoping (and even not so subtly suggesting) some of my Twitter “friends” would submit one of the blog posts I wrote since the feature was announced. But, then I realized  most of my friends didn’t know they could do this — and even if they did, the syntax is irregular (why “tip @techmeme” instead of just “@techmeme”?) and the whole process is a bit complicated.

So, it occurred to me we should have a “Digg It” equivalent embeddable call-to-action for Techmeme submission. Since no one else seemed to have made one yet, I took a stab:

Suggest to^?

As you can tell, I’m not a designer or a developer. I’m just a lowly product monkey, and this isn’t meant to be anything more than my version of a working feature spec.

That said, here’s the code:

<div class="techmeme-suggest-button">
<p style="font-family: sans-serif; font-size: small">
<a style="text-decoration: none" title="Suggest to Techmeme via Twitter" href="javascript:var d=document,f='http://twitter.com/home/',l=d.location,e=encodeURIComponent,p='?status=tip%20@Techmeme%20',q=e(l.href)+'%20'+e(d.title);1;try{if(!/^(.*\.)?twitter\.[^.]*$/.test(l.host))throw(0);share_internal_bookmarklet(p)}catch(z){a=function(){if(!window.open(f+p+q,'twitter'))l.href=f+p+q};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else{a()}}void(0)">Suggest to <sub><img src="http://thesnowballfactory.com/images/techmemechicklet_16.png" border="0" alt="" /></sub></a><a style="text-decoration: none" title="What's this?" href="http://news.techmeme.com/090128/twitter-tips" target="_blank"><sup>?</sup></a>
</p>
</div>

If you want to use it, just copy and paste it into the bottom of your blog posts (make sure you’re editing in HTML mode). You can change the size and font of the text  by editing <p style="font-family: sans-serif; font-size: small"> (for example, try font-family: serif or font-size: medium). You can also change the size of the Techmeme favicon by switching out techmemechicklet_16.png for techmemechicklet_24.png (24px) or techmemechicklet_32.png (32px).

Lord knows it’s *ugly* (both the code and the design). So, real developers and designers I invite you to please improve upon it. All I ask is for you to post a link to your better version in the comments below, so we can all use it (and I can stop using my crappy one ).

Update: This blog is hosted on WordPress.com. And I was pretty surprised when I was originally able to embed the javascript for the buttons and it didn’t get stripped out, because I thought you weren’t allowed to run any scripts on WP.com. Well, it turns out you aren’t but they just don’t check for it when you post. At some point in the last 11hrs, the javascript powering the buttons in this post got stripped out (thereby breaking them, to which Russ alerted me). To make them work again, I’ve now just hardcoded the URL’s for them. The example javascript should still work for you (as long as your blog isn’t on WP.com), and you can see the javascript version in action at the bottom of this post on my (self-hosted) personal blog.

Update 2: The post just made the front page of Techmeme thanks to a mention from Gabe and a tip from Rahmin. If that’s not meta, I don’t know what is . And, it’s super cool to get some love from Gabe — I’m a huge fan of what he and the team have done over at Techmeme.

Update 3: As my buddy Mark just figured out, even self-hosted WordPress chokes on javascript in the body of the post. The only reason I didn’t notice this on my self-hosted WP blog is because I have the (very handy) Exec-PHP plugin installed, which apparently not only executes php in your posts but also js. The elegant solution (other than you also installing Exec-PHP on your self-hosted WP blog) would be to do a php version or maybe even a WP plug-in or template tag. But, frankly I can’t be bothered . So, I might just make a bookmarklet that generates static HTML for a ‘Submit to Techmeme’ button based on whatever page you’re on, so you can copy and paste it into any post on any publishing platform that supports HTML.

Update 4: Last one, I swear! Just to say there’s now a ‘Submit to Techmeme’ button plugin for WordPress (self-hosted).