新・元地方の中規模印刷会社で苦悩するWebデザイナー改めWebディレクターの日記

自由な20代、窮屈な30代を経て、遂に40代になっちまったWebディレクター&パソコン講師の覚書と思う言(こと)。略称【ちほちゅう】

*

ファンページ「いいね!ボックス」の作り方【Facebookページの作り方03】

      2014/11/09

  • このエントリーをはてなブックマークに追加

1年以上前の記事です。内容が古い可能性があります。

賛否両論あるみたいですが先日、実名以外のアカウントを凍結したようにfacebookをやっている方たちは基本、実名オープンな方たちと思われるので、当ブログにファンページの「いいね!ボックス」(Like Box)を配置することにしました。
右メニュー下の方に常設しておきますので、当ブログのファンのかたは是非、「いいね!」をしていってください。
ただし、一定時間自分の顔アイコンが表示されますのでそういうのはちょっと困るという方は影で見守っていてもらえればOKです。

ここにも貼っておきます。

スポンサーリンク
 

といったところで「いいね!ボックス」の作り方です。
一旦、閉めてしまったのでまた最初から。まずはファンページを開きます。

  1. 左メニュー下「RSS Graffiti」や「ノート」の近くに「広告とfacebookページ」というのがあるのでそこをクリック。
  2. 該当のfacebookページ(旧ファンページ)のタイトルをクリック。
  3. 左メニューより「利用開始」をクリック。
  4. 一番下「「いいね!」ボックスを追加」をクリック。
    「いいね!」ボックスの作り方01
  5. ここで簡単に「いいね!ボックス」のソースが取得できます。
    一番上「Facebook Page URL」にfacebookページ(ファンページ)のURLを入れ、
    「width」に横幅をピクセル数で入力。
    あとは表示させる項目のみチェックをいれて「Get Code」をクリックです。
    右に表示されるレビューを見ながら作りましょう。
    「いいね!」ボックスの作り方02
  6. こんなソースができました。実はこのソースにはちょこっと問題があります。
    <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2F%25E3%2581%25A1%25E3%2581%25BB%25E3%2581%25A1%25E3%2582%2585%25E3%2581%2586%2F206104872737076&amp;width=220&amp;colorscheme=light&amp;show_faces=true&amp;stream=false&amp;header=true&amp;height=62" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:220px; height:62px;" allowTransparency="true"></iframe>

    赤文字になっている部分(縦幅)が狭すぎるんです。これを適当な数値に変更しましょう。

    <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2F%25E3%2581%25A1%25E3%2581%25BB%25E3%2581%25A1%25E3%2582%2585%25E3%2581%2586%2F206104872737076&amp;width=220&amp;colorscheme=light&amp;show_faces=true&amp;stream=false&amp;header=true&amp;height=300" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:220px; height:300px;" allowTransparency="true"></iframe>
  7. 最後にできたソースをブログやホームページに埋め込みます。以下はライブドアブログの場合。
    「いいね!」ボックスの作り方03

以上です。

ちょっと前はいろんなブログで見かけていたのですがもう、既に取り外しちゃっているところが結構ありますね。
やっぱり、実名が日本ではネックになってきちゃっているのかもしれません。

僕も様子を見てあまりファンが増えないようだったら取り外すことも考えたほうがいいのかなぁ。。
と、付けたばかりなのに思ってしまいました。

【6/22追記】
ある程度日が経つと上記メニューが無くなってしまうので直接「いいね!ボックス」のつくれるページへのリンクを入れておきます。
□ Like Box – Facebook開発者

 - Facebook(フェイスブック), デザイン, 覚え書き ,

アドセンス広告メイン

Comment

  1. 大山高峰です! より:

    鮎川はづきさん手塚は北朝鮮人だ!!
    潤さんにもう一度連絡して手塚を逮捕しないとはづきさんが
    北朝鮮に連れて行かれる!?
    手塚は多重人格者の病気です・・・・・・狂ってる?
    人を使いはづきを洗脳すると言ってるから!?
    はづきを助けて下さい!!

  2. 大山高峰です! より:

    鮎川はづきさん手塚の言いなりを聞くな?!
    私の所に来て下さい!
    米子市永江
    オオヤマ・コウホウです!

Message

メールアドレスが公開されることはありません。

  関連記事

Tumblr(タンブラー)のFacebook連携が変わった

1年以上前の記事です。内容が古い可能性があります。今まではFacebookアプリ …

iPhoneでUSTREAM生中継をする際の注意点

1年以上前の記事です。内容が古い可能性があります。今回、うちわ祭USTをさせてい …

no image
携帯サイト(ケータイサイト)の作り方

1年以上前の記事です。内容が古い可能性があります。以前、携帯サイト(i-mode …

no image
地図を大判で印刷したいらしい

1年以上前の記事です。内容が古い可能性があります。したいらしいシリーズがまた来ま …

Facebookでシェア、Bitstrips(ビットストリップス)の漫画がシュールでいいっ!

1年以上前の記事です。内容が古い可能性があります。今までもアバター系のアプリはい …

no image
Safariの癖

1年以上前の記事です。内容が古い可能性があります。忘れないうちに「Safari」 …

WordPress(ワードプレス)を会員制のサイトにする方法1 #wp

1年以上前の記事です。内容が古い可能性があります。ここではサイト全体を会員制にし …

USTREAMが日本語化、生中継の方法を解説

1年以上前の記事です。内容が古い可能性があります。ソフトバンク社長、孫正義氏がツ …

WordPress(ワードプレス)テーマで使った画像やJSファイルの場所 #wp

1年以上前の記事です。内容が古い可能性があります。といった具合に各コンテンツを固 …

Youtubeでライブ配信可能アカウントかどうか調べる方法

1年以上前の記事です。内容が古い可能性があります。YouTubeでライブ配信が可 …

血液型オヤジ