2016/2/5 : ボタンの順番を変えました。 ( Twitter / はてな / Facebook / Google+ ) また、自由に変えやすいようにコードに改行を挿入しました 2016/01/28 : Facebook のいいねボタンでは無く、シェアボタンに変更できるようにしました Facebook のみ、アプリが必要になります( 966242223397117 というデフォルトの appid が使えるようです )し、Facebook のレスポンスは相当悪いのであまりおすすめではありません。Facebook は、アプリID がチェックボックスの代りになります。 ブログ等で使う場合は、URL 部分が 記事の URL になるように、テンプレート等の変数をセットするといいでしょう。 正直、Seesaa のブックマーク処理は効率が悪いようなので作成してみました。Google+ ( 単純な Google+1ボタンにする => ) はてな Twitter
対象URL
Twitterテキスト
facebook アプリID 966242223397117 ( デフォルトの appid が使えるようです )
※ Shareボタンにする
『単純な Google+1ボタンにする』場合は、対象URL が表示されているページとなります。『単純な Google+1ボタンにする』のチェックを外すと、対象URL が必要になります。 ブログのトップベージのように、記事が複数ある場合は、上のテキストエリアのものを貼り付けて、下側のテキストエリアはページの最後に一度だけ実行されるようにします。 ▼ Seesaa で、Facebook 無しの記事下に貼り付けるコード
<div>
<table>
<tr><td>
<div class="g-plusone" data-size="medium" data-href="<% article.page_url %>">
</td><td>
<a href="http://b.hatena.ne.jp/entry/<% article.page_url %>" class="hatena-bookmark-button" data-hatena-bookmark-layout="standard-balloon" data-hatena-bookmark-lang="ja"><img src="http://b.st-hatena.com/images/entry-button/button-only@2x.png" style="border: none;" /></a>
</td><td>
<a href="https://twitter.com/share" class="twitter-share-button" data-url="<% article.page_url %>" data-lang="ja" data-text="<% article.subject %>"></a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
</td></tr>
</table>
</div>
▼ Seesaa の記事 HTML の最後に貼り付けるコード( Facebook 無し )
<!-- google -->
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
<!-- hatena -->
<script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>
Twitter 用としては、Seesaa では、data-text="<% article.subject %>" にする必要があります。 ボタン情報 Google +1ボタン はてなブックマークボタン Twitter buttons Facebook Like Button Facebook Share Button 関連する記事 livedoor Blog で、Facebook の『シェアボタンを表示する』 Seesaa のソーシャルボタンのテンプレート上の設定( 古いテンプレートから最新に変更する手順 )
※ テンプレートは
そもそも、
作者さんの意図では、本来 ajax を使ってサーバー側のデータをリアルタイムに取得する事が目的のようですが、利用するには少し問題が多そうです。サーバー側の解説も無く、クライアント側の解説もそれほど明快なものではありません。
なので、最低限確実に動くサンプルを作成しました。サーバーと連携したい場合は単純に一括で ajax で必要な JSON を取得してから jquery.ajax-combobox に引き渡すといいでしょう。
オリジナルの説明ではできるような事が書かれていますが、それば付属のデーターベースアクセスを行う PHP を使う必要があるようで、JSON データをクライアントのデータとして持たせて使う場合には動作しませんでした。
▼ jquery.ajax-combobox 利用時の概要
※ エキスパートモードで表示しています
アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります
