Yahoo!ブックマークに登録ボタンを表示する †

yahoo1.png
注意

Yahoo!ブックマークは、2016/2/29にサービスが終了しました。

▲ ▼

基本的なコード †

「Yahoo!ブックマークに登録」ボタンは、「便利ツール : 「Yahoo!ブックマークに登録」ボタン・アイコン - Yahoo!ブックマーク」に設置方法の説明があります。

また、「ブックマーク人数表示」画像は、「便利ツール : 「ブックマーク人数表示」画像 - Yahoo!ブックマーク」に設置方法の説明があります。

この2つを組み合わせたコードは、「便利ツール : ブログパーツの組み合わせ - Yahoo!ブックマーク」で取得できます。

このページで取得できる基本的なコード（大きい登録ボタン、別ウィンドウ表示、カウンタを文章で表示、文字サイズ中）は、以下のようになります。

<a href="javascript:void window.open('http://bookmarks.yahoo.co.jp/bookmarklet/showpopup?t='+encodeURIComponent(document.title)+'&amp;u='+encodeURIComponent(location.href)+'&amp;ei=UTF-8','_blank','width=550,height=480,left=100,top=50,scrollbars=1,resizable=1',0);"><img src="http://i.yimg.jp/images/ybm/blogparts/addmy_btn.gif" width="125" height="17" alt="Yahoo!ブックマークに登録" style="border:none;"></a><script src="http://num.bookmarks.yahoo.co.jp/numimage.js?disptype=medium"></script>

小さい画像ボタンで、同一画面内遷移、カウンタは数字のみ表示、文字サイズ小とした時のコードは、以下のようになります。

<a href="javascript:location.href='http://bookmarks.yahoo.co.jp/action/bookmark?t='+encodeURIComponent(document.title)+'&amp;u='+encodeURIComponent(location.href);"><img src="http://i.yimg.jp/images/sicons/ybm16.gif" width="16" height="16" alt="Yahoo!ブックマークに登録" style="border:none;"></a><script src="http://num.bookmarks.yahoo.co.jp/numimage.js?disptype=shortsmall"></script>
▲ ▼

JavaScriptを使わずにカウンターを表示する †

例えば、「http://dobon.net/」のブックマーク人数表示を行うには、次のようなコードを書きます。

<a href="http://bookmarks.yahoo.co.jp/url?url=http%3A%2F%2Fdobon.net%2F"><img src="http://num.bookmarks.yahoo.co.jp/image/medium/http://dobon.net/" style="border: none;" /></a>

上の例では、文字サイズ中（画像の高さが17px）で、文章で表示（〇〇人が登録）しています。その他にも、文字サイズが3種類と、数字だけ表示するタイプが用意されています。それらのURLを表示まとめると、以下のようになります。

表示形式大きさ画像の高さ(px)srcのURL
文章で表示大20http://num.bookmarks.yahoo.co.jp/image/large/(対象ページのURL)
文章で表示中17http://num.bookmarks.yahoo.co.jp/image/medium/(対象ページのURL)
文章で表示小15http://num.bookmarks.yahoo.co.jp/image/small/(対象ページのURL)
数字のみ大20http://num.bookmarks.yahoo.co.jp/image/shortlarge/(対象ページのURL)
数字のみ中17http://num.bookmarks.yahoo.co.jp/image/shortmedium/(対象ページのURL)
数字のみ小15http://num.bookmarks.yahoo.co.jp/image/shortsmall/(対象ページのURL)

Yahoo!ブックマークに登録ボタンとカウンタを並べた時のコードは、次のようになります。ここでは、小さい画像ボタン、同一画面内遷移、カウンタを文章で表示、文字サイズ中としています。

<a href="http://bookmarks.yahoo.co.jp/action/bookmark?u=http%3A%2F%2Fdobon.net%2F"><img src="http://i.yimg.jp/images/sicons/ybm16.gif" width="16" height="16" alt="Yahoo!ブックマークに登録" title="Yahoo!ブックマークに登録" style="border:none;" /></a>
<a href="http://bookmarks.yahoo.co.jp/url?url=http%3A%2F%2Fdobon.net%2F"><img src="http://num.bookmarks.yahoo.co.jp/image/medium/http://dobon.net/" alt="Yahoo!ブックマーク" title="Yahoo!ブックマーク" style="border: none;" /></a>
▲ ▼

コメント †


▲ ▼
ページ情報
[ トップ ]   [ 編集 | 凍結 | 差分 | バックアップ | 添付 | 複製 | 名前変更 | リロード ]   [ 新規 | 子ページ作成 | 一覧 | 単語検索 | 最終更新 | ヘルプ ]