内容一覧
こんにちわ!
ひでゆきです^^(dehichan0728)
デニーズのモーニングセットが230円でコーヒー飲み放題&軽食付でコスパ最強です!
早起きして仕事する方にオススメです!!
さて、本日はブログやウェブサイトと切っても切れない存在のSNS「Facebook」のいいね!を
WordPressのサイドバーに表示する方法を紹介します!
私も先ほどサイドバーに表示したのですが、ビジュアル的になんだかカッコいい!!笑

LikeBoxというサービスが2015年に終了してPagePluginというサービスに変わりました。
設置方法が簡単になったので、ぜひ設置してください^^
Facebookでアカウント作成
Facebookのいいね!を設置する場合は個人ページではないページである必要があります。
特に会社でなくても作ることは可能なので、「ブログ名」「ハンドルネーム」でOK
Facebookのアカウントを持ってないと作れません!

自分のサイトやウェブサイトのカテゴリーを選びましょう。

カテゴリーを決めたら詳細を設定しましょう。
- ブログやウェブページの簡単な説明を記入
- ブログやウェブサイトのURLを記入

プロフィール写真の設定
プロフィールとは別にトップ画像を後で設定します。

自分のFacebookページのお気に入りに設定。
ページにアクセスしやすくなります。

ターゲットを明確にすることで、検索させた時に見つけられやすくなります。
ブログやウェブサイトのお客様をイメージするといいでしょう。

Facebookトップ画像の設定
プロフィール画像の設定はできているのでトップ画像を設定しましょう。

これでFacebookのアカウントを作ることができました!
では、いいね!boxを作りに行きましょう!!
LikeBoxの変わりPagepluginで設置
2015年まではいいね!を作っているサービス名は「LikeBox」ライクボックスでした。
廃止になって新しいサービス名はPagepluginです!(ページプラグイン)
いいね!を作るFacebookページはこちらPageplugin

主に決めるのは4つ
- FacebookのURL
- タグ
- 幅・高さ
- 設定
それぞれを解説していきます。

FacebookのURL
Facebookページを作るときに決めたURLはFacebookページを表示すると見れます。
個人のページのURLは無効になり表示できません。

タグ
タグのデフォルトが「timeline」
タイムラインを表示することで縦長になるので、嫌ならタグを空欄にしましょう!
timeline

events(イベント)

messages(メッセージ)

events、messagesの複合で表示

幅・高さ
このブログではデフォルトのまま使用しています。
幅・高さを変えると、すぐにプレビューで反映されるのでお好みの大きさを見つけましょう!
設定
- スモールヘッダーを使用
- カバー写真を非表示にする
- 友達の顔を表示する

スモールヘッダーを使用する

まぁ、好みでしょう。笑

カバー写真を非表示にする

ある方が良さそうですね…お好きな方をお選びください。笑

友達の顔を表示する

お好みで~

設置方法
自分好みの設定ができたら、コードを取得をクリック!!

上下に2つコードが表示されるので、両方を使っていきます。

WordPressにウィジェットで追加
全く同じ流れになります。
ダッシュボードの外観→「ウィジェット」

テキストをサイドバーへ移動させます。
テキスト内に先ほど表示したコード2つを貼り付けたら設置完了です!!

番外編 Twitterをサイドバーに表示させる
全く同じように設置できるので、もしよかったらやってみてください^^

まとめ
HTMLとかCSSとかの変更なくできるので簡単ですね!!
ソーシャルネットとブログやウェブサイトの連携は今の時代は必須です。
簡単なのでFacebook・Twitterと両方設定しておくことをオススメします^^
では!!
コメントを残す