- 追加された行はこの色です。
- 削除された行はこの色です。
ブログなどに貼り付けるブックマーク用ボタンのリスト
#contents
*Google +1 [#g0796178]
以下のページでコードを取得してブログ等に貼り付ける
[[+1 をウェブサイトに表示:http://www.google.com/intl/ja/webmasters/+1/button/index.html]]
上記のページでサイズやタイプを選ぶとコードが生成される。
生成例．
次のコードをコピーして、サイトに貼り付けてください。
<!-- このタグを +1 ボタンを表示する場所に挿入してください -->
<g:plusone></g:plusone>
<g:plusone size="medium"></g:plusone>
<!-- この render 呼び出しを適切な位置に挿入してください -->
<script type="text/javascript">
window.___gcfg = {lang: 'ja'};
(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>
タグの部分をページのボタンを表示したい部分にコピペ。
Javascriptは、<head>タグの中に追記する。
*はてなブックマーク [#xd5ef94a]
下記のページで、ページ情報を入力し、タイプを選ぶとコードが生成される。
[[はてなブックマークボタンの作成・設置について:http://b.hatena.ne.jp/guide/bbutton]]
生成例．
<a href="http://b.hatena.ne.jp/entry/http://wiki.t-y4.com/" class="hatena-bookmark-button" data-hatena-bookmark-title="yoshi's wiki" data-hatena-bookmark-layout="standard" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a>
<script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>
<a href="http://b.hatena.ne.jp/entry/http://wiki.t-y4.com/" class="hatena-bookmark-button" data-hatena-bookmark-title="hogehoge" data-hatena-bookmark-layout="simple" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>
a タグは、ページのボタンを表示したい部分にコピペ。
Javascriptは、<head>タグの中に追記する。
**pukiwikiのページに貼る場合は [#l0e04ae0]
URLとページタイトルが自動的に変わるようにPHPのスクリプトを挿入
例．
<a href="http://b.hatena.ne.jp/entry/http://wiki.t-y4.com/index.php?<?php echo rawurlencode($title);?>" class="hatena-bookmark-button" data-hatena-bookmark-title="<?php echo $title ?> - <?php echo $page_title ?>" data-hatena-bookmark-layout="standard" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a>
<a href="http://b.hatena.ne.jp/entry/http://wiki.t-y4.com/index.php?<?php echo rawurlencode($title);?>" class="hatena-bookmark-button" data-hatena-bookmark-title="<?php echo $title ?> - <?php echo $page_title ?>" data-hatena-bookmark-layout="simple" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a>
a タグの href と data-hatena-bookmark-title に PHPのスクリプトを挿入
*livedoorクリップ [#p1c462cb]
下記のページから画像を選んでコードをコピペ。
[[ブログに「clip!」ボタンを設定しよう！:http://clip.livedoor.com/guide/blog.html]]
**pukiwikiのページに貼る場合は [#mfb26e8b]
URLとページタイトルが自動的に変わるようにPHPのスクリプトを挿入
例．文字コードがUTF-8の場合
<a href="http://clip.livedoor.com/redirect?link=http://wiki.t-y4.com/index.php?<?php echo rawurlencode($title);?>&title=<?php echo $title ?>%20-%20<?php echo $page_title ?>&ie=UTF-8" class="ldclip-redirect" title="この記事をクリップ！"><img src="http://parts.blog.livedoor.jp/img/cmn/clip_16_12_w.gif" width="16" height="12" alt="この記事をクリップ！" style="border: none;vertical-align: middle;" /></a>
*Yahoo!ブックマーク [#rf8500e1]
下記のページからタイプを選んでコードをコピペ。
[[「Yahoo!ブックマークに登録」ボタン・アイコン:http://bookmarks.yahoo.co.jp/settings/tools/savelink]]
ボタンを表示したいところにコピペするだけ
*Buzzurl [#y1f269d3]
下記のページからアイコンとブログを選んでコードを生成。
[[ブックマークアイコン:http://buzzurl.jp/icongenerator/]]
このコードをボタンを表示したい部分にコピペ。
**pukiwikiのページに貼る場合は [#x55bae18]
URLとが自動的に変わるようにPHPのスクリプトを挿入
例．
<a href="http://buzzurl.jp/entry/http://wiki.t-y4.com/index.php?<?php echo rawurlencode($title);?>" title="Buzzurlにブックマーク" target="_blank"><img src="http://buzzurl.jp.eimg.jp/static/image/api/icon/add_icon_mini_05.gif" alt="Buzzurlにブックマーク" style="border:0"></a><a href="http://buzzurl.jp/entry/http://wiki.t-y4.com/index.php?<?php echo rawurlencode($title);?>" title="Buzzurlにブックマーク" target="_blank"><img src="http://api.buzzurl.jp/api/counter/http://wiki.t-y4.com/index.php?<?php echo rawurlencode($title);?>" alt="Buzzurlにブックマーク" style="border:0"></a>
*tumblr [#qf7f4e55]
以下のページでコードを取得してブログ等に貼り付ける
[[Tumblr共有ボタン:http://www.tumblr.com/docs/ja/share_button]]
上記のページでタイプを選ぶとコードが生成される。
生成例．
ステップ１
<script type="text/javascript" src="http://platform.tumblr.com/v1/share.js"></script>
ステップ２
<a href="http://www.tumblr.com/share" title="Share on Tumblr" 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;">Share on Tumblr</a>
<a href="http://www.tumblr.com/share" title="Share on Tumblr" style="display:inline-block; text-indent:-9999px; overflow:hidden; width:20px; height:20px; background:url('http://platform.tumblr.com/v1/share_4.png') top left no-repeat transparent;">Share on Tumblr</a>
Javascriptは、<head>タグの中に追記する。
aタグの部分をページのボタンを表示したい部分にコピペ。
*twitter [#e84babaa]
以下のページでコードを取得してブログ等に貼り付ける
[[Twitterボタン:https://twitter.com/about/resources/buttons#tweet]]
上記のページでタイプを選ぶとコードが生成される。
そのコードをページのボタンを表示したい部分にコピペ。
**pukiwikiのページに貼る場合は [#c918dc1f]
pukiwikの場合、初期値のままではURLがうまく変換されない。
[[Twitterボタン:https://twitter.com/about/resources/buttons#tweet]]の画面で「URLを共有」の項目にダミーの文字を入れてコードを生成。
以下のソースのように data-url の部分にURLが自動的に変わるようにPHPのスクリプトを挿入
<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://wiki.t-y4.com/index.php?<?php echo rawurlencode($title);?>" data-via="ty4_yoshi" data-lang="ja">ツイート</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
*facebook [#r9e23a9d]
以下のプラグインのページでコードを取得する
http://developers.facebook.com/docs/plugins/
**Like Button [#y8472480]
タイプを選らんでコードを生成する。
IFRAMEが簡単ですがこれからはHTML5かと
1)
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/ja_JP/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
2)
<div class="fb-like" data-send="true" data-layout="button_count" data-width="200" data-show-faces="false"></div>
1)をbodyタグの直後にコピペ、2)をページのボタンを表示したい部分にコピペ。
*del.icio.us [#n994bbeb]
以下のページでコードを取得する
http://delicious.com/help/savebuttons
ページのボタンを表示したい部分にコピペ。
**pukiwikiのページに貼る場合は [#la62acda]
URLとページタイトルが自動的に変わるようにPHPのスクリプトを挿入
例．
<a href="http://www.delicious.com/save" onclick="window.open('http://www.delicious.com/save?v=5&noui&jump=close&url='+encodeURIComponent('http://wiki.t-y4.com/index.php?<?php echo rawurlencode($title);?>')+'&title='+encodeURIComponent('<?php echo $title ?> - <?php echo $page_title ?>'),'delicious', 'toolbar=no,width=550,height=550'); return false;"><img src="http://www.delicious.com/static/img/delicious.small.gif" height="10" width="10" alt="Delicious" /> Save this on Delicious</a>
url= のあとの encodeURIComponent と title= のあとの encodeURIComponent にPHPスクリプトを挿入
[[ウェブ関連]]
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
