音楽系のことはほとんど書きません(詐欺)

音楽系のなんとやら

アウトはシンプル、インでは雑多な生活を好む人間の情報ブログ

はてなブログやFC2ブログ等にFacebookのHTMLウィジェットを設置する方法

自分のFacebookページを宣伝したいけど、ウィジェットの作成ボタンが見つからない、なんて人はいませんか?

ここではFacebookウィジェットの作成方法について紹介します。

http://media.salon.com/2014/06/facebook_friends.jpg

 ウィジェットとは何者だというところから始めますが、簡潔に言いますと、ウィジェットとは、サイト内にそのページの機能を置くことができる、いわば機能付きの置物なわけです。

Facebookウィジェットはこんなやつですね。

f:id:youym014:20150319231501p:plain

見たことがある人がほとんどだと思います。ほとんどのページに設置されていますからね。

ウィジェットを作成する

ウィジェットの作成にはこのページを使います。

developers.facebook.com

Facebookの公式サービスなのですが、どうやらデペロッパーの中に隠れている模様……

そりゃ見つからないわけだ!!

 

まず上記のサイトにアクセスすると次の画像のような感じだと思います。

f:id:youym014:20150319225906p:plain

その中でも

f:id:youym014:20150319225958p:plain

ここを編集します。編集項目は以下のとおり。

FacebookPage URL

・表示させたいFacebookページのURLをコピペ。

Width

ウィジェットの幅を任意の数字で設定。狭めのブログだと210くらいがオススメ。(当ブログも210。)

Hight

ウィジェットの高さを任意の数字で設定。お好きなだけ、どれだけでも。

Color Scheme

ウィジェットのテーマカラーを設定。LightとDarkの二種類から設定可能。ブログの印象にあわせてどうぞ。

Show Friends' Faces

・いいね!をしている人のアイコンを表示。表示したくなければチェックを外す。

Show Header

・上の「Facebookもチェック」と書いてあるヘッダーを非表示にする。

Show Posts

Facebookページに投稿した内容をウィジェット内に表示。長ったらしくなるのでオススメはしない。

Show Border

・外枠の表示。

任意の設定が終わったら下の方の『Get Code』を押してコードを所得してください。

2つ出ると思いますが、はてなブログに対応していたのは下の短いコードの方でした。(HTML)

記事内には表示させることができませんのでご注意を。

 

これといって集客効果があるわけではありませんが、サイトが華やかになりますよね。

音楽系のなんとやらのFacebookをよろしくお願いします!!

広告を非表示にする