R-style

Sharing is Power! / Create your own way.

Menu
  • ホーム
  • About
  • メルマガ
  • 著作リスト
  • Evernoteの使い方
  • Scrapboxの使い方
  • Tools
  • お問い合わせ
Menu

WordPressでのEvernoteのサイトメモリー導入について

Posted on 2010 年 9 月 16 日2017 年 4 月 30 日 by Rashita
Tag:
  • Evernote

以前簡単に紹介しまたが、もう少しまとまったものとWordpress初心者の方への説明も加えて、バージョンアップ記事を書いておきます。

導入したいけど手の付け方が分からない、という方の参考になれば幸いです。

逆にすでに導入している、あるいはwordpressについての知識はばっちりという方は、GTFしてください。
※GTF・・・Go to next feed(or Blog).

基本となるコード

基本となるコードは以下のリンクからゲットできます。

サイトメモリーボタン

わかりやすいように入力できる部分にすべて文字列を入れてコードをはき出すと以下のようなコードが生成されます。

<script type=”text/javascript” src=”http://static.evernote.com/noteit.js”></script>
<a href=”#” onclick=”Evernote.doClip({providerName:’入力項目A’,contentId:’入力項目B’,suggestNotebook:’入力項目C’,code:’入力項目D’,title:’入力項目E’,url:’入力項目F’,suggestTags:’入力項目G’}); return false;”><img src=”http://static.evernote.com/article-clipper.png” alt=”Clip to Evernote” /></a>

この入力項目+アルファベットの部分を入れ替えることでカスタマイズすることができます。

基本の4つ

まずは、基本で表示されている4つの入力項目から。

  • Webサイト名
  • 候補となる保存先のノートブック
  • クリップするコンテンツ
  • Evernote紹介コード

Webサイト名:入力項目A

空白にしておくと、ドメイン名になります。Blogの名前などを入力しておけばよいでしょう。Wordpressをお使いの方であれば、

<?php bloginfo(‘name’); ?>

の中にブログのタイトルが入っているのでこれを使うのも一手です。

つまり、

providerName:'<?php bloginfo(‘name’); ?>’

こんな感じですね。この方法をとっておけば、後でブログのタイトルを変更したときに勝手にクリップの方のタイトルも変更されます。

候補となる保存先のノートブック :入力項目B

当たり障りない対応をしたければ、空白にしておけばよいでしょう。できればタグと同じで提案型であればよかったのですが、今のところEvernoteでのノートブックの使い方の多様性を考えるとけっこう「余計なお節介」な気分がしています。特に「自分のブログのタイトル」を入れるとそうとう「目に付き」ます。

仮に入力するとしても、「自分はこのジャンルで書いているんだ!」ということが明確になっている場合の「ジャンル」を入力しておくぐらいが無難だと思います。

クリップするコンテンツ:入力項目C

簡単に説明だけすると「指定したHTMLのID要素に囲まれている部分をクリップ対象にする」というもの。

難しいことを考えたくなければ、テンプレートを見て、一番上最初にでてくる<div id=”○○”>を探して、その○○を指定しておけばとりあえずクリップをしてもらうことだけはできます。mainあるいはcontentなどの可能性が高いです。単一記事のテンプレならばこれでも問題ないでしょう。

インデックスページ(トップページ)の場合、これをやってしまうとページ全体がクリップされてしまう可能性があるのでその辺に注意が必要です。

できれば「post」あるいは「entry」という文字列がでてくる付近のidを探した方がよいでしょう。

例えば、テンプレ内に

id=”post-<?php the_ID(); ?>”

こういう表記ががあれば、これを指定してしまうのも一手です。つまり

contentId:’post-<?php the_ID(); ?>’

こういう感じに。

もしテンプレの意味がはっきり分かっている方ならば、既存のDivにidを追加するか、クリップ用のDivを追加するか、という選択もできると思います。一応注意すべき点は、id名はそのページ内に一つしか存在してはいけない、というルールになっているということです。class指定の重複は可能ですがid指定は重複不可__言葉の意味から考えても当然ですが__です。これは頭の片隅にでも置いておいてください。

なので、インデックスページでの運用を考えると、独自のIDを作る場合は、

id=”clip-<?php the_ID(); ?>”

というようなエントリーごとに異なる名前が割り振られるIDの指定をしておくのが無難でしょう。

Evernote紹介コード :入力項目D

これは好みの問題ですが、アフィリエイト用のコードを埋め込む所です。
アフィリエイトが気になる方&少々の英語を読むのを厭わない方は、

http://www.evernote.com/about/affiliate/

からコードを入手して、

code:’rashita△’

みたいな感じでもらったコードを入力してください。

個別の詳細4つ

では引き続いて、詳細の方の入力項目も見ていきましょう。

  • 候補となるノートタイトル
  • URL
  • 候補となるタグ
  • 保存様式

候補となるノートタイトル:入力項目E

空白の場合はページのタイトルが使われますので、単一記事のテンプレの場合は空白でも問題ありません。インデックスページで空白にするとノートのタイトルがブログのタイトルになってしまうので使う人にとっては不便です。

WordPressであれば、

<?php the_title(); ?>

を使うことで、記事のタイトルを持ってくることができます。例えば

title:'<?php the_title(); ?>’
title:’R-style <?php the_title(); ?>’

のような感じが考えられます。

URL:入力項目F

これもタイトルと同じ考えで。単一記事の場合は空白でも問題ありません。インデックスページなどは、その記事のURLを引っ張ってくる必要があるので、

<?php the_permalink(); ?>

を使います。こんな感じに。

url:'<?php the_permalink(); ?>’

候補となるタグ:入力項目G

これも空白で問題ありませんが、ブログのタイトルやあるいはジャンルなどを入れておけば使う人にとって便利かも知れません。考えられるものとしては

  • 「ブログのタイトル」
  • 「Blog」「ブログ」
  • 「日記」「ニュース」「ネタ」「ハック」などのブログのジャンル

があるでしょうか。

以前の記事でも紹介しましたが、ワードプレスの記事のタグをEvernoteのタグとして提案することもできます。具体的には以下のような書式。

suggestTags:'<?php
$posttags = get_the_tags();
if ($posttags) {
foreach($posttags as $tag) {
echo $tag->name . ‘ ,’;
}
}
?>’});

好みに応じてお使いください。

保存様式

これは入力項目ではありません。スタイルの保存と言ったところでしょうか。基本的に推奨されている「テキストのみ」を選択しておけば問題ないでしょう。

以下は、「開発者向けガイド(英語)」より 

The clip styling strategy that the clipper should use. Valid values are “none” to ignore page styles, “text” to only apply page styles to textual elements, and “full” to attempt to copy the full styling of the page. The default value is “text”, which we suggest using as it yields clips that display consistently across platforms. “full” styling often looks good one one platform but fails to render well on others. Note that there is currently no way to style clips made from IE.

超概略意訳:
「none(無し)」はページのスタイルを無視します。「text(テキストのみ)」は文章要素を最適な形で保存します。「full(全て)」はページをまるっとコピーします。デフォはテキストでOK。フルは良いときもあるけども、プラットフォームが変わると酷いときもあるっす。IEくんには要注意だね!

とりあえず、「テキストのみ」を選択しておきましょう。ブログならこれで問題ないはずです。
※テキストのみはデフォルトなのでコードに記入するところはありません。

どこにつける?

さて、コードが出来たところでテンプレに追加しましょう。単一記事の表示テンプレと、トップページのテンプレ、この二つを押さえておけば無難です。

記事中のボタン設置の場所ですが、考えられる場所は、記事の前の方か後ろの方だと思います。

今回は記事タイトルの後ろに付けるとして話を進めていきます。テンプレを開いてみて、the_titleとかタイトルがらみの場所を見つけましょう。どこかにあるはずです。大体<h2>あたりで囲まれていると思いますが、テーマごとに違うので断言はできません。もし見つからなければ、一度自分のブログをブラウザで開いてみて、ソースを確認してみてください。右クリックなり、メニューの「表示」なりにあるはずです。

ソースを見たら、記事のタイトルが表示されている部分を探して、そのあたりに出てくる要素を憶えておきます。H2とかあるはclass=””とかが手がかりになるはずです。

あとは、テンプレにかえって先ほどの表示を作っていた部分を探します。発見したらタイトルの直後に、作ったコードを入れればOKです。
※<h2glt;</h2>でタイトルが表示されていたら、</h2>の直後に入れる。

ボタンを別の部分に入れる場合でも、おなじような感じで設置場所を見つけてみてください。

コードを入れたら、忘れずに保存(orアップロード)を実行しておきましょう。

おわりに

これで大体WordpressでのSiteMemoryボタンの導入はできるのではないかと思います。ページのテーマにもよりますが、完璧に対応するのであれば、

  • tag.php (tag.php)
  • アーカイブ (archive.php)
  • カテゴリーテンプレート (category.php)
  • ページテンプレート (page.php)
  • メインインデックスのテンプレート (index.php)
  • 単一記事の投稿 (single.php)
  • 検索結果 (search.php)

あたりのテンプレをいじる必要があります。

あと、おまけ的な紹介になりますが、すでにプラグインがあります。

Evernote Site Memory for WordPressプラグイン(kwLog)

使い方(kwLog)

最新のバージョンがどうなっているのかはわかりませんが、自分でボタンを導入したい場所にコードを埋め込む作業は必要な感じです。

プラグインのサイトはこちら

http://wordpress.org/extend/plugins/site-memory-for-wordpress/

自分で一からやるも良し、テンプレの助けを借りるも良しです。Evernoteを使っていてるブロガーの方は、「おれもEvernote使っているよ」のアピールと共にボタンを設置してみてはいかがでしょうか。

▼こんな一冊も:

EVERNOTE「超」仕事術
EVERNOTE「超」仕事術 倉下忠憲

シーアンドアール研究所 2010-08-18
売り上げランキング : 478

おすすめ平均 star
starクラウド時代のGTD指南本
starGTDに使えそうです
starEVERNOTEを利用した『知的生産の技術』指南本

Amazonで詳しく見る by G-Tools

前の記事 次の記事

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

有料メルマガ配信中!

サークルもやってます

New Book!

すべてはノートからはじまる あなたの人生をひらく記録術

「やること地獄」を終わらせるタスク管理「超」入門 (星海社新書)

オススメ本

→これまでの著作一覧
  • →SNS:
  • rashita2 さんのプロフィールを Twitter で表示
  • rashita さんのプロフィールを GitHub で表示

Hot Books!

→紹介記事

→紹介記事

→紹介記事

最近の投稿

  • ライン、ボード、カード
  • 『Re:vision』が「Kindle本夏のビッグセール」対象となりました。
  • ノートがやがてうまく使えなくなる問題
  • ノートで世界を知る、自分を知る
  • 一つの情報に、もう一度触れること
  • 執筆はメモからはじめる

カテゴリー

  • 0-知的生産の技術 (1,580)
    • BlogArts (121)
    • Evernoteの使い方 (177)
    • Scrapboxの用法 (101)
    • Scrivenerへの散歩道 (22)
    • アウトライナーで遊ぼう (88)
    • プログラミング (11)
    • 執筆法 (45)
    • 断片からの創造 (93)
    • 物書き生活と道具箱 (682)
  • 1-情報ツール考察 (75)
  • 2-社会情報論 (108)
  • 3-叛逆の仕事術 (392)
    • 「タスク」の研究 (260)
  • 4-僕らの生存戦略 (259)
  • 5-創作文 (91)
  • 6-エッセイ (217)
  • 7-本の紹介 (465)
  • コレクション (4)
  • 未分類 (2,833)
    • まとめ記事 (516)
    • 企画 (83)
    • 告知 (262)
    • 感想群 (111)
    • 時事ニュース (1,241)

タグ

#365日の書斎 #AppleScriptでEvernoteを操作する #「目標」の研究 #わりと身も蓋もない話 applescript blog BlogArts CategoryAllegory Dynalist Evernote GTD iPhone・iPad・Mac Scrapbox Scrivener Workflowy 〈学びの土曜日〉 「本」の未来 『「やること地獄」を終わらせるタスク管理「超」入門』 うちあわせCast ささやかな質問 ほぼ日手帳 アウトライナー アナログ道具あそび ショートショート セミナー・オフ会・イベント セルフ・ブランディング タスク管理 ノート ノート術 ポッドキャスト 哲学 思想 思考の技術 情報カード 情報摂取の作法 手帳術 政治・社会 教育 文房具 文章の織り方 新しい時代を生きる力 書評 発想法の探求 経済・金融 電子書籍

アーカイブ

メタ情報

  • ログイン
  • 投稿フィード
  • コメントフィード
  • WordPress.org

My Works

著作リスト

著作リスト

アーカイブ

カテゴリー

アーカイブ

  • 2022年8月
  • 2022年7月
  • 2022年6月
  • 2022年5月
  • 2022年4月
  • 2022年3月
  • 2022年2月
  • 2022年1月
  • 2021年12月
  • 2021年11月
  • 2021年10月
  • 2021年9月
  • 2021年8月
  • 2021年7月
  • 2021年6月
  • 2021年5月
  • 2021年4月
  • 2021年3月
  • 2021年2月
  • 2021年1月
  • 2020年12月
  • 2020年11月
  • 2020年10月
  • 2020年9月
  • 2020年8月
  • 2020年7月
  • 2020年6月
  • 2020年5月
  • 2020年4月
  • 2020年3月
  • 2020年2月
  • 2020年1月
  • 2019年12月
  • 2019年11月
  • 2019年10月
  • 2019年9月
  • 2019年8月
  • 2019年7月
  • 2019年6月
  • 2019年5月
  • 2019年4月
  • 2019年3月
  • 2019年2月
  • 2019年1月
  • 2018年12月
  • 2018年11月
  • 2018年10月
  • 2018年9月
  • 2018年8月
  • 2018年7月
  • 2018年6月
  • 2018年5月
  • 2018年4月
  • 2018年3月
  • 2018年2月
  • 2018年1月
  • 2017年12月
  • 2017年11月
  • 2017年10月
  • 2017年9月
  • 2017年8月
  • 2017年7月
  • 2017年6月
  • 2017年5月
  • 2017年4月
  • 2017年3月
  • 2017年2月
  • 2017年1月
  • 2016年12月
  • 2016年11月
  • 2016年10月
  • 2016年9月
  • 2016年8月
  • 2016年7月
  • 2016年6月
  • 2016年5月
  • 2016年4月
  • 2016年3月
  • 2016年2月
  • 2016年1月
  • 2015年12月
  • 2015年11月
  • 2015年10月
  • 2015年9月
  • 2015年8月
  • 2015年7月
  • 2015年6月
  • 2015年5月
  • 2015年4月
  • 2015年3月
  • 2015年2月
  • 2015年1月
  • 2014年12月
  • 2014年11月
  • 2014年10月
  • 2014年9月
  • 2014年8月
  • 2014年7月
  • 2014年6月
  • 2014年5月
  • 2014年4月
  • 2014年3月
  • 2014年2月
  • 2014年1月
  • 2013年12月
  • 2013年11月
  • 2013年10月
  • 2013年9月
  • 2013年8月
  • 2013年7月
  • 2013年6月
  • 2013年5月
  • 2013年4月
  • 2013年3月
  • 2013年2月
  • 2013年1月
  • 2012年12月
  • 2012年11月
  • 2012年10月
  • 2012年9月
  • 2012年8月
  • 2012年7月
  • 2012年6月
  • 2012年5月
  • 2012年4月
  • 2012年3月
  • 2012年2月
  • 2012年1月
  • 2011年12月
  • 2011年11月
  • 2011年10月
  • 2011年9月
  • 2011年8月
  • 2011年7月
  • 2011年6月
  • 2011年5月
  • 2011年4月
  • 2011年3月
  • 2011年2月
  • 2011年1月
  • 2010年12月
  • 2010年11月
  • 2010年10月
  • 2010年9月
  • 2010年8月
  • 2010年7月
  • 2010年6月
  • 2010年5月
  • 2010年4月
  • 2010年3月
  • 2010年2月
  • 2010年1月
  • 2009年12月
  • 2009年11月
  • 2009年10月
  • 2009年9月
  • 2009年8月
  • 2009年7月
  • 2009年6月
  • 2009年5月
  • 2009年4月
  • 2009年2月
  • 2009年1月
  • 2008年12月
  • 2008年11月
  • 2008年10月
  • 2008年9月
  • 2008年8月
  • 2008年7月
  • 2008年6月
  • 2008年5月
  • 2008年4月
  • 2008年3月
  • 2008年2月
  • 2008年1月
  • 2007年12月
  • 2007年11月
  • 2007年10月
  • 2007年9月
  • 2007年8月
  • 2007年7月
  • 2007年6月
  • 2007年5月
  • 2007年4月
  • 2007年3月
  • 2007年2月
  • 2007年1月
  • 2006年12月
  • 2006年11月
  • 2006年10月
  • 2006年9月
  • 2006年8月
  • 2006年7月
  • 2006年6月
  • 2006年5月
  • 2006年4月
  • 2006年3月
  • 2006年2月
  • 2006年1月
  • 2005年12月
  • 2005年11月
  • 2005年10月
  • 2005年9月
  • 2005年8月
  • 2005年7月
  • 2005年6月
  • 2005年5月
  • 2005年4月
  • 2005年3月
  • 2005年2月
  • 2005年1月
  • 2004年7月
  • 2004年6月
  • 2004年5月
  • 2004年4月
  • 2004年3月
©2022 R-style | WordPress Theme by Superbthemes.com