bloggerでFacebookの「いいね」(Like)ボタンを設置するには

Facebook Like / Recommend Button For Blogger ~ Blogger Widgets

こちら参考にしました

 

ブログのダッシュボード

レイアウト->HTMLの編集

ウィジェットのテンプレートの展開チェック

 

data:post.body/

を検索

 

中程で

    <div class='post-header-line-1'/>

    <div class='post-body'>
      <p><data:post.body/></p>

 

この次の行にこれを挿入

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>
</b:if>

 

もしくはこちら

<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/>

 

この違いは先のは記事単独を開いた時だけ「いいね」ボタンを表示するが、後のはブログトップページを開いた時などは表示されてる記事ごとすべてに「いいね」ボタンが表示されるかの違い。

おれは後者のスタイルでやってみた。

 

コメントの表示とかもやってみたいな。

このブログの人気の投稿

Prusa i3 MK3S用 IKEA Lack エンクロージャー作ったぞ、3Dプリンターの入れる箱というか台だ、力作

Prusa i3 MK3S をBearエクストルーダーへ改造したよ

Fusion360へOS標準以外のフォントの利用方法