1. Top
  2. » ネット関係

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

このブログは更新やめます

タイトルのまんまですが、基本的には更新オシマイにします。今の家は日当りの関係であまり植物を育てられないので、、、
メインのブログからのリンクも外しました。

全く更新してないにも関わらず検索経由で毎日50~100人ぐらい迷い込む方がいるみたいなので参考までに消さずに残しておきます。特にカレーリーフ栽培と空芯菜栽培?
超絶たまにカレーリーフの近況を貼付けるかもしれなかったり園芸と関係のないポエム(?)を書きなぐる事はあるかもしれませんが良く分かりません。

ごきげんよう。
スポンサーサイト

「Tumblrで共有」ボタンで画像を含むFC2ブログエントリをリブログする為の設定

以前追加した「Tumblrで共有」ボタンの設定を変更し、画像を含むエントリの場合は画像がリブログされるようにする。Tumblrで用意されているスクリプトではphotosetのリブログは出来ないようなので、エントリ中の1つめの画像ファイルでリブログする事にした。エントリ中に画像を含まない場合は今まで通りにエントリ本文の引用をリブログする。

前回の手順3の代わりに以下の設定を行う。


手順1
本文を含むテンプレート変数(本文:<%topentry_body>や追記:<%template_extend>)を囲む<div>タグや<span>タグの属性に、以下を追加、、、というかEvernote用に記載したものを流用した。

id="content<%topentry_no>"


手順2
<!--topentry-->~<!--/topentry-->に以下を記載。
<script type="text/javascript">
var imgObj = document.getElementById("content<%topentry_no>").getElementsByTagName("img");
var tumblr_button<%topentry_no> = document.createElement("a");
if( imgObj.length != 0 ){
imgurl = imgObj[0].src.replace("s.jpg",".jpg");
tumblr_button<%topentry_no>.setAttribute("href", "http://www.tumblr.com/share/photo?source=" + encodeURIComponent(imgurl) + "&caption=" + encodeURIComponent("<%topentry_title> - <%blog_name>") + "&clickthru=" + encodeURIComponent("<%topentry_link>"));
}
else{
tumblr_button<%topentry_no>.setAttribute("href", "http://www.tumblr.com/share/link?url=" + encodeURIComponent("<%topentry_link>") + "&name=" + encodeURIComponent("<%topentry_title> - <%blog_name>") + "&description=" + encodeURIComponent("<%topentry_discription>"));
}
tumblr_button<%topentry_no>.setAttribute("title", "Share on Tumblr");
tumblr_button<%topentry_no>.setAttribute("style", "display:inline-block; text-indent:-9999px; overflow:hidden; width:81px; height:20px; background:url('http://platform.tumblr.com/v1/share_1.png') top left no-repeat transparent;");
document.getElementById("tumblr_button_<%topentry_no>").appendChild(tumblr_button<%topentry_no>);
</script>


説明
見たままなので説明を記述するほどでもないが、、
1、エントリを特定するID(content<%topentry_no>)で各エントリのオブジェクトを取得
2、エントリオブジェクトに含まれる一つ目の"img"オブジェクトを取得
3、"img"が一つ以上ある場合、imgのsrcの末尾をs.jpgから.jpgに置き換え(小さいサムネイルではなく大きい画像を指定してリブログするように)、後はphotoのリブログとして各種の属性を指定する
4、"img"が無い場合は、リンクのリブログとして各種の属性を指定する

Googleの「+1(プラスワン)」ボタンをFC2ブログに設置する

Googleより「+1(プラスワン)」ボタンが発表された為、早速ブログに設置する。
設置方法はソーシャルボタンの中では比較的シンプルで、ここからタグを取得し若干の書き換えを行えば設置可能。

以下、簡単な手順。

まずテンプレートの<head>タグ内に以下を記述。

<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: 'ja'}
</script>

次に、<!--topentry-->~<!--/topentry-->内の任意の場所に、以下を記載。

<g:plusone size="medium" href="<%topentry_link>"></g:plusone>

URLを指定しないと「今表示しているURL」に対する+1ボタンとなる為、個別記事への+1ボタンとなるようにhref属性に<%topentry_link>を指定する。

FC2ブログにEvernoteのクリップボタン「Evernote Site Memory」を設置

手順1
<!--topentry-->~<!--/topentry-->内のクリップボタン設置場所に以下を記述。

<script type="text/javascript" src="http://static.evernote.com/noteit.js"></script><a href="#" onclick="Evernote.doClip({providerName:'<%blog_name>',title: '<%topentry_title> - <%blog_name>',url: '<%topentry_link>',contentId:'content<%topentry_no>'}); return false;"><img src="http://static.evernote.com/article-clipper-jp.png" alt="Clip to Evernote" /></a>

手順2
クリップしたい場所を示すテンプレート変数(本文:<%topentry_body>や追記:<%template_extend>)を囲む<div>タグや<span>タグの属性に、以下を追加。

id="content<%topentry_no>"

自分が使用しているテンプレートの場合は本文を囲むdivタグがあったのでそこに記述した。追記が含まれないが、追記は殆ど使用しないので手抜き。
適当なタグが無い場合は<span id="content<%topentry_no>">と</span>で囲めば大丈夫と思う(多分)。


留意点
別の画像が良い場合、公式のSite Memoryページでタグを生成する。
公式のタグは、他のソーシャルボタンと同様「1HTMLに1ボタン」の前提で生成される為、「1HTMLに複数記事(複数ボタン)」が大前提のブログサービスではそのままでは上手くいかない。この為、上述のような対応が必要となる。

FC2ブログに「Tumblrで共有」ボタンを設置

Tumblrから公式の「Tumblrで共有」ボタンリリースされたので、早速設置した。

リンク・引用など幾つかの方法があるが、とりあえずはリンク方式とし、description部に本文の要約を載せる事とする。


手順1
<head>タグ内に以下を記述。

<script type="text/javascript" src="http://platform.tumblr.com/v1/share.js"></script>


手順2
<!--topentry-->~<!--/topentry-->内のtumblrボタン設置場所に以下を記述。

<span id="tumblr_button_<%topentry_no>"></span>


手順3
先ほどの手順2の下あたり(<!--/topentry-->よりは前)に以下を記述。

<script type="text/javascript">
var tumblr_button<%topentry_no> = document.createElement("a");
tumblr_button<%topentry_no>.setAttribute("href", "http://www.tumblr.com/share/link?url=" + encodeURIComponent("<%topentry_link>") + "&name=" + encodeURIComponent("<%topentry_title> - <%blog_name>") + "&description=" + encodeURIComponent("<%topentry_discription>"));
tumblr_button<%topentry_no>.setAttribute("title", "Share on Tumblr");
tumblr_button<%topentry_no>.setAttribute("style", "display:inline-block; text-indent:-9999px; overflow:hidden; width:81px; height:20px; background:url('http://platform.tumblr.com/v1/share_1.png') top left no-repeat transparent;");
document.getElementById("tumblr_button_<%topentry_no>").appendChild(tumblr_button<%topentry_no>);
</script>



これだけ。


留意点
公式のタグは「1HTMLに1ボタン」の前提で生成される為、「1HTMLに複数記事(複数ボタン)」が大前提のブログサービスではそのままでは上手くいかない。この為、安直にブログ記事のユニーク番号をid(および変数)に付与する事にして回避した。

また、Tumblrボタンに限らないがブログ記事の本文中にダブルクォーテーションが含まれる場合、<%topentry_discription>を展開した際に崩れる。本文内のダブルクォーテーションを忘れずに「&quot;」とエスケープしておきたい。
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。