サイト運営には不可欠!!自分のブログ用のFacebookPage作ろう。

ブログを始めて間もないのですが、ブログをやっている人達って皆んな自分のブログのFacebookPage持ってるじゃないですか。必ずと言っていいほどブログのどこかにFacebookPageへのいいねボタンありますし…
僕も自分のFacebookPageが欲しい!!!!!
そしてこのブログのサイドバーにFacebookPagePluginを設置したい!!!!
FacebookPageってなあに?
まずはそもそもFacebookPageが一体なんなのかという説明から。
Facebookには「個人用アカウント」と「FacebookPage」の2つの種類のアカウントが存在しています。
個人用アカウントの特徴は…
- 基本的に実名で登録する必要がある
- 友達申請が可能
- 既に知り合いの人と繋がるのが目的
それに対してFacebookPageの特徴は…
- 実名以外でも登録可能
- 友達申請が不可(代わりにいいねして貰う事でファンになってもらう)
- 基本的に公開で誰でも見る事が可能
つまり個人用アカウントが閉鎖的なアカウントであるのに対してFacebookPageはオープンなアカウントという事になります。
よってFacebookPageは基本的に企業やサービスが利用して自分たちのサービスをより多くのFacebookユーザーに広める事を目的としてアカウントの運営をしています。
そして、このFacebookPageは個人用アカウントがあれば誰でも作成する事ができるので、ブログだったりWebサイトのFacebookPageを作成して、自分のサイトを広めたりブログの場合は更新情報を発信するために利用する事が可能なのです。
FacebookPageを作成してみる
FacebookPageが何なのか分かったところで、早速作成していきましょう。
まずはFacebookPageの作成ページへと飛びましょう。

パッと見この6つのカテゴリの中から自分の作成するFacebookPageに該当するものを選択しないといけないのかと焦るのですが、実はそれぞれの項目をクリックすると更にそこからカテゴリーが細かく分かれています。

「ブランドまたは製品」の方には「ウェブサイト」というカテゴリがあります。

また、「アーティスト、バンドまたは著名人」の方には「ブロガー」というまさにこれだ!というカテゴリが存在しています。
ブログのFacebookPageを作成する場合は「ウェブサイト」か「ブロガー」を選択すると良いですね。
ちなみに僕は「ウェブサイト」の方にしました。理由は「アーティスト、バンドまたは著名人」の中のカテゴリであるブロガーを選ぶ勇気が無かったからです。

カテゴリを選択したらその下にはウェブサイト名を入力して「スタート」をクリックします。
ここから先は細かい設定になります。

FacebookPageに関する簡単な説明。そしてサイトのURL、FacebookPageのカスタムURLを記入して「情報を保存」をクリックします。

お次はFacebookPageのプロフィール画像の設定ですが、何も考えていませんでした。
とりあえず今回は飛ばします。個人アカウント同様に後から幾らでも変更できるので。できればプロフィール画像はシンプルな感じにしたいなぁと思っています。テキストだけみたいな。

お次は自分のページをFacebookのサイドバーに登録してすぐにアクセスできるようにするかどうかの設定。とりあえず「お気に入りに追加」をクリックして追加しておくことにします。

さて最後はちょっとマーケティングっぽい事をします。
ターゲットの設定ですね。ここで設定した人がこのページを発見しやすくなるようです。
僕の場合「地域」はどこでもいいのですが、お店のFacebookPageならここをお店の近くに設定したりするわけですね。
「年齢」はなるべく若い人でウェブデザインを丁度勉強しているような人に読んで欲しいので18〜23歳に設定。「性別」は特に設定しないで、「趣味・関心」にはウェブデザインを設定しておきました。
そして「言語」は日本語なのですが、Facebookには日本語と言っても「日本語」と「日本語(関西)」の2種類の言語が存在しているので一応両方設定しておきます。
設定し終わったら「保存」ボタンをクリックします。

作成完了しました〜!!
後はプロフィール画像の設定やカバー画像の設定。そして細かいプロフィール情報なんかを記入していけば完成です。
PagePluginを追加したい
さてFacebookPageの作成が完了したので、FacebookのPagePluginというのをブログの方に追加してみようと思います。
PagePluginというのはこういうやつの事です↓
ブログや企業サイトなんかでよく見かけますよね。
FacebookPageもできた事ですし、このブログのサイドバーにも設置しようかと思います。
コードの取得
まずはコードの取得から。
facebook for developersのページプラグインにアクセスします。
少し下にスクロールするとPagePluguinの設定をする場所があります。
初めはFacebookの公式Pageが設定されていますが、「FacebookページのURL」を自分のFacebookPageのURLに変更すると自分のFacebookPageに変わります。

後は幅や高さを調節したりですが、設定しなくても特に問題ないだろうという事で今回は放置します。
幅や高さを設定する項目の下には4つのチェックマークがありますが、そこはお好みで設定しましょう。

設定が完了したら下にある「コードを取得」ボタンをクリックします。
するとコードが表示されるのでコードを貼り付ければWebサイトにPagePluginを設置する事ができるというわけです。

コードの設置
僕は今回サイドバーにPagePluginを設置したいのでサイドバーにコードを貼り付けます。

とりあえずカテゴリーの下に設置しました。
なんとも味気ないですが、これからプロフィール画像やカバー画像を設定していきます。
以上、FacebookPageの作成からPagePluginの導入までの手順でした。


Alfredの検索結果の表示がおかしくなったら確認すること
Keyboard Maestroでダークモードかどうか判定して、条件分岐で処理を変える方法
Path Finder 10がリリース!Big Surに完全対応したり、AirDropが使えるように!
Brewfileを使ってMac移行時にコマンド1つで必要なアプリを全てインストールできるようにする|Homebrew Bundle
高速なzshのプラグインマネージャー「Zplugin」の導入方法
SteerMouseの「自動移動」機能で保存ダイアログが表示されたら自動でデフォルトボタンへカーソルを移動させる
macOSのシステム環境設定「アクセシビリティ」内にあるVoiceOverの設定見直し
Alfred 4で使えるシステムコマンドのまとめ
Path Finderのクラウドファイルアップロード機能で、選択ファイルをサーバー上にすばやくアップする
Workspacesの検索ウインドウで使えるコマンド一覧
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
HyperSwitchをインストールしておくと「隠す(command + M)」で隠したウインドウもすぐ開けるようになる
Visual Studio Codeでパス補完機能を細かく設定して自分好みにできる拡張機能「Path Autocomplete」
WordPressのプラグインはどれを入れたら良い?とりあえず最初に導入をオススメするプラグイン一覧
Path Finderの情報パネルにある「作成日」「更新日」「追加日」の違い
Macのデフォルトシェルをbashからzshへ変更する方法
Backlogをショートカットキーで操作する方法
技術的な文章を書く時の自分ルール
MacのターミナルからVisual Studio Codeを開く方法
CSS Nite in Kobe, vol.41「最新ネット広告の打ち手を学ぶ1dayレッスン 〜レスポンシブ検索広告からAmazon広告、ストーリーまで」に参加してきました
Obsidianで整理した知識をAnkiで定着させる方法