EVERNOTEからリリースされた新機能「Site Memory」を早速実装してみました。
設置は非常に簡単でものの10分程度あっさりと完了!手順は以下の通りです。
SiteMemoryのページにアクセス
設置用のコードを取得します。
以下の手順にしたがって必要項目を入力します。
「ノート個別の詳細オプションを表示する」をクリックするとタイトルやタグ、URLなども指定できるようになります。 また、ここで保存先のノートブック名を入力できるのですが、該当のノートブックがないとユーザー側に自動的に作成されるので自分がクリップする側だったらノートブックを勝手に作成されるのは嫌だなーと思いあえて指定しませんでした。
あとは生成された以下のコードを設置したい箇所に貼りつければ完了です。
<script type="text/javascript" src="http://static.evernote.com/noteit.js"></script> <a href="#" onclick="Evernote.doClip({code:'',providerName:'designaholic',url:'',suggestTags:'',title:'',contentId:'maincontents'}); return false;"> <img src="http://static.evernote.com/article-clipper.png" alt="Clip to Evernote" /></a>
ここでせっかくMTで実装するので少しカスタマイズ。設置用のコードを見てみると設定で入力したものが以下のように定義されています。
styling | 保存様式 全て(full)か なし(none)の時のみ記述 |
---|---|
providerName | Webサイト名 |
suggestNotebook | 候補となる保存先のノートブック |
code | Evernote紹介コード |
url | URL |
suggestTags | 候補となるタグ |
title | 候補となるノートタイトル |
contentId | クリップさせたいHTMLエレメントのID |
空欄にしてもタイトルは<title></title>の値、URLは該当ページのURLを取得してくれるのですがせっかくなのでMTタグを利用して以下のようにカスタマイズ。
<script type="text/javascript" src="http://static.evernote.com/noteit.js"></script> <a href="#" onclick="Evernote.doClip({providerName:'<$mt:BlogName encode_html="1"$>',title:'<$mt:EntryTitle$>',url:'<$mt:EntryPermalink$>',contentId:'maincontents',code:''}); return false;"> <img src="http://static.evernote.com/article-clipper.png" alt="Clip to Evernote" /></a>
また<mt:Entries></mt:Entries>内で利用すれば繰返し要素に対してそれぞれCLIPボタンを表示させることもできそうですね。ただ”contentId”がかぶっていると最初に登場したものをとってくるのでIDを連番で繰り返すなどの工夫が必要そうです。
ちなみに設置は簡単ですが、どのくらいニーズがあるかはまだ未知数なので様子を見ていきたいと思います。