Evernoteの「CLIPボタン」を追加してみた

2010/10/01 0:46 | IT・ガジェット

最近、Evernoteを使ってよくウェブサイトの情報をクリップするので自分のブログにも「CLIPボタン」を付けてみた。

やり方はLifehacking.jpの「あなたのブログに Evernote Site Memory を追加する」という記事を参考にさせていただきました。

Evernoteのウェブサイトには特設ページができていて、そこでコードを作成するツールも提供されています。ちなみにこのボタンの名前は「Evernote Site Memory Button」というそうです。なんだか親しみにくい。。。笑

このブログでは、特設ページで作成したコードをもとに以下のようなコードを入れ込みました。

<script type="text/javascript" src="http://static.evernote.com/noteit.js"></script>
<a class="evernote-button" href="#" onclick="Evernote.doClip({providerName:'ブログ名',url:'記事のURL',title:'記事のタイトル',contentId:'クリップさせたいコンテンツを含むHTMLタグのID'}); return false;"><img src="http://static.evernote.com/article-clipper.png" alt="Clip to Evernote" /></a>

このブログでは、以下の要素を入れましたが、他にもクリップする際のタグやノートブックなども指定できるようです。Developer Guideのページに項目一覧が掲載されています。

• providerName: ブログ名
• url: 記事のURL
• title: 記事のタイトル
• contentId: クリップさせたいコンテンツを含むHTMLタグのID

結局、以下のコードをWordPressのThematicのChild Themeのfunctions.phpに入れて使いました。

$postmeta .= '<script type="text/javascript" src="http://static.evernote.com/noteit.js"></script>';
$postmeta .= '<a class="evernote-button" href="#" onclick="Evernote.doClip({providerName:\'ウェブ、やってます\',url:\'';
$postmeta .= get_permalink();
$postmeta .= '\',title:\'';
$postmeta .= get_the_title();
$postmeta .= '\',contentId:\'post-';
$postmeta .= get_the_ID();
$postmeta .= '\'}); return false;';
$postmeta .= '"><img src="http://static.evernote.com/article-clipper.png" alt="Clip to Evernote" /></a>';

functions.phpの編集については、「ThematicのChild Themeに本家ツイートボタンを追加してみた」をご参照。