凹レンズログ

くりかえす生活の雑感。まとまらぬままに。

はてなダイアリーでFacebookを活用する方法

はてなダイアリーにFacebookいいねボタンが設定できるようになったのことを全く知らずに過ごしてました。聞くところによると、2011年2月には設定できたんですね・・・。私は最近まで見逃していて、仕組みもうまく理解できなかったので、Facebookのツールを利用する方法をまとめてみました。


「いいね!」 ボタンの設定

まず、ブログのエントリーに「いいね!」ボタンを表示しましょう。設定方法は以下の通りです。


はてなダイアリーにて、「管理」→「設定」→「記事の設定」→「記事共有ボタン」の項目のうち「Facebook「いいね!」ボタンを表示」にチェックを入れる。これで完成、とても簡単!
Facebook「いいね!」ボタンが設置できるようになりました - はてなダイアリー日記


Facebookページ(旧ファンページ)を作成する

まず、Facebookページとは

団体、会社、有名人、バンドなどが、正式にその関連情報を、つながりを持っている人たち(ファン)に公開するためのページ。
ファンとコミュニケーション、ファンとの交流、Facebookイベントなどを通じてファンを獲得するうえで役立つ。
Facebookページ(ファンページ)

つまり、自分のブログのFacebook上の公式ページのことです。これを作成して、ブログの更新情報を流せるようにしておけば、自分のブログ情報のFacebook上でのプラットホームになります。作成方法は、以下のHPが分かりやすいです。

更新情報の流し方は、以下のエントリーがわかりやすいです。

サイドバーにFacebook Like Boxを設定する

さらに、ブログのサイドバーにFacebook Like Boxを設定することができます。これを設置することによって、フェイスブックページへのリンクとして使ったり、いいね!をつけてくれたユーザーをはてなダイアリー上に反映することができます。


まず、以下のHPにアクセスします。


  1. 自分のフェイスブックページのURLを貼り付けます。
  2. 設置したい場所に合うように、幅を調節します。
  3. コードを入手します。

Get Code」を押すと、iframeとXFBMLのプラグインコードが表示されるので、iframeのコードをコピーします。但し、はてなダイアリーには、このコードをそのまま貼り付けることは出来ません。そこで、以下のHPを使用して、はてなダイアリーに設置可能なHTMLを生成します。

iframe → Google Gadget コンバータ

  1. 「iframeタグまたはURL」と書かれている欄に、先ほどコピーしたiframeのコードを貼り付ける
  2. 変換を押して、はてなダイアリーに貼り付け可能なHTMLを表示させる。
  3. HTMLコードをコピーする

※ 私はボックスの高さがどうしてもずれてしまいました。iframeコード中のwidth:140px; height:62px;の部分をいじって大きさの調節が可能です。

生成されたHTMLをブログに設定します。サイドバーに設定する場合は、「管理」 → 「デザイン」 → 「詳細」 → 「ページのフッタ」に貼り付け という形になります。


まとめ

上記のような基本的な設定をして、はてなダイアリーとFacebookをより便利に使っていきましょう。私のFacebookでも友達申請お待ちしております。最後に、人力検索はてなにて質問に答えていただいたid:rouge_2008さん、id:Yoshiyaさん、ありがとうございました。


facebookfacebook
ベン・メズリック,夏目 大

青志社
売り上げランキング : 10986

Amazonで詳しく見る by AZlink

―追記2011.6.27
どうやらGoogle Gadget コンバータを使用せずとも、貼り付けは可能なようです。指摘してくださった皆様、ありがとうございますm(_ _)m