自分のブログに facebook のウォールを表示することができる jQuery を利用したプラグイン fb.wall

自分のブログに facebook のウォールを表示することができる jQuery を利用したプラグイン fb.wall の設置メモ。

こちらが本ちゃんのサイトですが、今後は「neosmart STREAM」に全面的に移行するようです。

目次

設置方法

1. 表示したいアカウントでログインした状態で、下記 URL にアクセスします。
http://www.neosmart.de/social-media/facebook-wall/

2. 「Facebook ID?」に表示したい facebook の IDを入力し、
「Access Token?」にある「Connect and create access token」リンクをクリックします。

3. 「Live Demo Code」に出てくる「accessToken」の値を控えてください。

4. 先のサイトからダウンロードしたファイルをサーバーの適当な場所に解凍してください。

5. 以下のコードを、head タグ内に記述します。
コード中の「ID」は表示したい facebook の ID、
「accessToken」は上記3の手順で取得した値を指定します。

[code lang=’html’]



[/code]

6. 次のコードを、ウォールを表示したい場所に記述してください。

[code lang=’html’]
[/code]

以上です。

日付のカスタマイズ

このスクリプトは日付のフォーマットを文字連結で行ったいます。
日本の記述にしたい場合は、次のファイルを編集して変更するしかなさそうでした。

編集するファイル:jquery.neosmart.fb.wall.js
編集する箇所:187 行目にある formatDate() 関数内のコード

[code lang=’javascript’] ampm = (hour<12) ? ‘am’ : ‘pm’;
return day+’.’+month+’.’+date.getFullYear()+’ at ‘+hour+’:’+minute+’ ‘+ampm;
return day+’.’+month+’.’+date.getFullYear()+’ ‘+o.translateAt+’ ‘+hour+’:’+minute;
[/code]

この3箇所(別の行です)で日付を作り出しているので、次の様に日本語になるようにしました。

[code lang=’javascript’] ampm = (hour<12) ? ‘午前’ : ‘午後’;
return date.getFullYear()+’/’+month+’/’+day+’ ‘+hour+’:’+minute+’ ‘+ampm;
return date.getFullYear()+’/’+month+’/’+day+’ ‘+o.translateAt+’ ‘+hour+’:’+minute;
[/code]

このように、設置等々非常に簡単ですが、XREA では XML 解析エラーでうまく動かずでした。
広告が差し込まれるのが原因の様ですが、そこまででタイムアップだったので今回はそのまま。

10年集客し続けられるサイトを、ワードプレスで自作する9つのポイント プレゼント

【最後まで読んでくれたあなたに】

あなたは、24時間365日、自分の代わりに集客し続けてくれるWebサイトを作りたい!と思ったことはありませんか?

私はこれまで500以上のWebサイトの構築と運営のご相談に乗ってきましたが、Webサイトを作ってもうまく集客できない人には、ある一つの特徴があります。

それは、「先を見越してサイトを構築していないこと」です。
Webサイトで集客するためには、構築ではなく「どう運用するか」が重要です。

しかし、重要なポイントを知らずにサイトを自分で構築したり、業者に頼んで作ってもらってしまうと、あとから全く集客に向いていないサイトになっていたということがよく起こります。

そこで今回、期間限定で
『10年集客し続けられるサイトをワードプレスで自作する9つのポイント』
について、過去に相談に乗ってきた具体的な失敗事例と成功事例を元にしてお伝えします。

・ワードプレスを使いこなせるコツを知りたい!
・自分にピッタリのサーバーを撰びたい!
・無料ブログとの違いを知りたい!
・あとで悔しくならない初期設定をしておきたい!
・プラグイン選びの方法を知っておきたい!
・SEO対策をワードプレスで行うポイントを知りたい!
・自分でデザインできる方法を知りたい!

という方は今すぐ無料でダウンロードしてください。

期間限定で、無料公開しています。

※登録後に表示される利用条件に沿ってご利用ください

コメントを残す