シリウスにコメント欄を設置したい~その2~Facebook編

こんにちは。

お父さんアフィリエイター、
はまぞふです。

さて、先週に引き続き、

『シリウスにコメント欄を設置したい』

という事で、
今週もコメント欄の設置方法を
ご紹介しますね。

先週は、『Disqus』というサービスを
使った方法でした。

先週の記事をご覧になられていない方は、
コチラの記事も読んでみて下さいね。

シリウスにコメント欄を設置したい~その1~Disqus編


今週は、『Facebook』を使った方法をご紹介します。

『Facebook』を使ったコメント欄って、
実は、よく見かけるんですよね。

なので、そのコメント欄を、
「シリウスで作ったサイトに、設置できないかなー」
と思ってました。

実際にやってみると、
意外と簡単に、設置することが出来ました。

「シリウスにコメント欄を設置したいけど、
『Disqus』への登録がチョット面倒・・・」
と思われている方がいたら、

今回のFacebookのコメント欄を設置することを
オススメしますよ。

チビ子
「Facebookのコメント欄って、
確かによく見かけるわね。」

チビ助
「でも、どうすれば設置できるのか、
わからないや。」

はまぞふ
「ちなみに、今回のFacebookのコメント欄の設置方法は、
おすすめ度 ★★
難易度 ★★

ってとこかな。」

  おすすめ度 難易度
Disqusを使う方法 ★★★ ★★★
Facebookを使う方法 ★★ ★★
掲示板を使う方法


はまぞふ
「それじゃ、早速いくよー・・・の前に、

まずは、Facebookに登録しておこうね

今回はFacebookを使った方法になるので、
Facebookへの登録は必要不可欠だよ。」


チビ子
「はーい!」


チビ助
「登録したよー!」


はまぞふ
「それじゃ、いくよー!」

Facebookを使ってコメント欄を実現する方法~登録編~


はまぞふ
「最初に、Facebookに開発者として登録して、
コメント欄を設置するブログのURLを追加しよう。

まずは、『facebook for developers』 のページにアクセスしてね。

facebook for developers


アクセスしたら、『今すぐ登録』のボタンをクリック。

WS000716

 

パスワードの入力を求められることがあるので、
パスワードを入力して、『送信』をクリック。

WS000718

 

『同意しますか?』と聞かれるので、中段の赤枠の部分をクリックして、
『はい』にしてから、『次へ』をクリック。

WS000719

 

認証コードを受け取る為に、電話番号の入力を求められるよ。
電話番号を入力して、中段の、

『SNSで受け取る』か、『電話で受け取る』のどちらかをクリックしよう。

受け取った認証コードを入力し、『登録する』をクリック。

WS000720
※ ちなみに、この電話番号を登録しても、Facebook内で、
  電話番号が公開されることは有りませんので、ご安心くださいね。

 

無事、Facebook開発者として登録されました。
『完了』をクリックしよう。

WS000722

 

プラットフォームの選択が表示されるので、右端の『WWW』をクリック。

WS000723

 

赤枠の部分に、コメント欄を設置するブログのURLを入力しよう。
入力したら、『新しいFacebookアプリIDを作成』をクリック。

WS000725

 

『連絡用のメールアドレス』の入力が求められるので、
メールアドレスを入力。

その下にある、『カテゴリ』も選択しよう。

入力が終わったら、右下の、『アプリIDを作成してください』をクリック

WS000726

 

セキュリティチェックが表示されるので、
画像のテキストを入力して、『送信』をクリックしよう。

WS000728

 

これで、ブログのURL追加は完了だよ。」

WS000731

 


チビ助
「ここまでは、OKだよ。」


チビ子
「わたちも、OKよ。すんなりいったわ。」


はまぞふ
「それじゃ、次は、

コメント欄のコードを取得して、
シリウスに貼り付けるよ。」

 

Facebookを使ってコメント欄を実現する方法~設置編~

 


はまぞふ
「今度は、コメント欄を設置するためのJavascriptのコードを取得するよ。

コメントプラグインのページに移動しよう。

コメントプラグイン

 

移動すると、こんな画面が表示されるよ。

WS000735

 

下にスクロールすると、『コメントプラグインのコードジェネレータ』と
出てくるよ。

この画面で、『コメントするURL』に、
コメント欄を設置したいブログのURLを入力しよう。

入力したら、一度、キーボードの『Tab』キーを押してね。

後は、好みに応じて、幅や投稿数を調整しよう。
デフォルトのままでも、問題はないよ。

入力が終わったら、下の『コードを取得』ボタンをクリックしてね。

WS000753

 

コメント欄を設置するためのコードが2種類表示されるので、
まずは、赤枠の部分の『Step 2』のコードをコピーしよう。

WS000739

 

コピーしたら、シリウスを起動して、

メニューのテンプレートから、
HTMLテンプレート編集を選択しよう。

161115-0402_thumb1

 

上のタブで、エントリーページを選択。

※今回はエントリーページにコメントを設置するよ。

161115-0405_thumb1

 

<body>の後に、コピーしたコードを貼り付けよう。

WS000754

貼り付けたら、保存して画面を閉じてね。

 

次に、『ステップ3』のコードをコピーして、

WS000739-2

 

シリウスのツールバーの『サイト全体設定』をクリックしよう。

161115-0410_thumb1

 

『フリースペースの設定』タブをクリックして、
位置選択を『メインカラム(下段)』を選択。

『内容』の部分に、先ほどコピーしたコードを貼り付けよう。
貼り付けたら、『OK』をクリックしてね。

WS000755

 

このコードを貼り付けた場所に、コメント欄が表示されるよ。

今回は、エントリーページの下段に表示されるように追加してみたので、
もし、別の場所に表示したい場合は、

Step2のコードと、ステップ3のコードをセットで、
好きな場所に貼り付けてみてね
。」

 


チビ助
「貼り付け完了だよ。

表示されるかな・・・・って、

 


表示されないよ!!

 


はまぞふ
「シリウスのプレビューだと、コメント欄は表示されないよ。

確認する場合は、
サーバーにアップロードしてから、確認してみてね。」


チビ子
「先週も同じ失敗、してなかったっけ?」


チビ助
出たー!


チビ子
「Facebookのコメント欄は、シンプルね。」


はまぞふ
「メールアドレスや名前を入力する必要は無いからね。
僕は、こういうシンプルな方が好きだね。」

 

実際に、どんな感じになるか、このサイトに設置していますので、
使用感など、確かめてみて下さいね。

テストがてら、「テストテストテストーっ!」
と残しても、全然大丈夫ですよ。

http://sample2.hamazof.com/category3/entry9.html


 

メリットとデメリット


チビ助
「メリットは、

Facebookに登録している人なら、
メールアドレスや、名前など入れるわずらわしさは無いよね。

それに、Gravatorに登録してなくても、
アバターも出るから、便利だよね

それにそれに、Facebookを使ったコメント機能なので、
スパムコメントが発生しにくいってところも、
いいよね!」


チビ子
「デメリットは、

Facebookに登録していない人は、
コメントできないってとこね。

ブログに来てくれた人、全員がFacebokに登録しているわけじゃないし、
ブログでは、本名を出すのが嫌っ!
って人は、コメント残してくれないかもしれないわね。」


はまぞふ
「まぁ、そうだね。

Facebookに登録している人も増えてきたから、
コメントを残してくれる人も、結構いると思うよ。

本名を出すのが嫌だって人は、
コメント用にFacebookのアカウントを新しく作って、
ハンドルネームで登録しておけば、本名を出さなくて済むけど、

まぁ、そこまでしてくれる人がいるのかってとこだね。

でも、コメントを残すのって、
このコンテンツにどうしてもコメントを残したい!』とか、
この運営者とぜひ、かかわりたい!』って、
思ってくれるかどうかだと、思うんだよね。

って事は結局、
コンテンツ次第運営者次第ってとこじゃないかな。

Facebookでコメントをもらうことで、
FacebookのSNS内で個別にやり取りすることもできるので、
交友関係を広めることも、出来るかもしれないよ。」


チビ子
「なるほど~。
そんなメリットもあるのね。

わたちも、設置してみようかちら。」


チビ助
「僕、設置してみるよー」

 

ここまで見ていただいて、ありがとうございます^^

うまく、シリウスに設置できましたでしょうか?

実際に設置しようか迷っている方がいましたら、
こちらのページに実際に設置していますので、
コメント欄の使用感など、試してみて下さいね。

テストがてら、「テストテストテストーっ!
と残しても、全然大丈夫ですよ。

http://sample2.hamazof.com/category3/entry9.html

「うまくシリウスに設置できない!」という方や、
「ここが分かりずらかった!」という方がいたら、

気軽にお問い合わせくださいね。

お問い合わせ


ということで、次回は、

「昔懐かしい、掲示板をシリウスに設置する方法」を
ご紹介しますね。



「シリウスにコメント機能を設置するシリーズ」
を参照する場合はこちらをクリックして下さいね。

第1回 Disqus編
第3回 掲示板編



「Facebookを使ってみよー!」と思った方、ぽちっとお願いします^^

20 Responses to “シリウスにコメント欄を設置したい~その2~Facebook編”

  1. はまぞふさん、
    こんにちは。
    小夏です^^

    SIRIUSでのコメント欄、
    困っていた方って
    多いと思います。

    でも、その「困った」を
    探してくれる
    はまぞふさんの記事は
    とっても重宝されると思います。

    記事ってなんでもそうですが、
    読者様の「困った」を
    読者様の代わりに探して来てあげる事が
    基本ですよね。

    今回はコメント欄設置の記事もさることながら
    記事を書く上で
    心掛けないといけないこと大変勉強になりました。

    応援OKです。

    小夏

    • 小夏さん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      > でも、その「困った」を
      > 探してくれる
      > はまぞふさんの記事は
      > とっても重宝されると思います。

      ありがとうございます^^

      自分自身、何か方法はないものかと、
      色々と探しているうちに、たどり着いたので、

      同じ悩みを抱えている人がいるだろうと思って、
      シェアさせていただきました^^

      > 記事ってなんでもそうですが、
      > 読者様の「困った」を
      > 読者様の代わりに探して来てあげる事が
      > 基本ですよね。

      たしかにそうですね。

      検索する人は、『何かがしたい』ので、
      それを解決する方法を探しているわけですからね。

      解決できる方法が載っている記事は、
      役立つ記事になりますね^^

      役立つような記事を書けるように、
      頑張っていきたいですね^^

      応援ありがとうございます^^

  2. はまぞふさん、こんにちは。
    アフィリエイト副業で稼ぐ@たいちです。

    フェイスブックを使ったコメント欄作成
    なんて出来るんですね。

    こちらの方が簡単かも知れませんよね。

    シリウスに関して、
    色んな可能性を見い出せる
    はまぞふさんのブログ記事は、
    いつ見ても新鮮で、独自性が高いですよね。

    以前、購入特典のリンク生成の時も、
    はまぞふさんの記事を見ながら
    やっていましたからね。(笑)

    いつもお世話になっています。

    これからも、何かあった時は、
    こちらにお伺いします。(笑)

    はまぞふさん、
    またお伺いさせて頂きますね。


    アフィリエイト副業で稼ぐ@たいちでした。

    • たいちさん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      > こちらの方が簡単かも知れませんよね。

      そうですね。

      facebook開発者の登録も、サイトの登録も、
      さほど難しくはなかったので、
      Disqusに比べれば難しくはないですね^^

      > シリウスに関して、
      > 色んな可能性を見い出せる
      > はまぞふさんのブログ記事は、
      > いつ見ても新鮮で、独自性が高いですよね。

      ありがとうございます^^

      ここ最近、かなりシリウスを使い込んでいるので、
      自分が気づいた点など、シェアさせてもらってます^^

      > 以前、購入特典のリンク生成の時も、
      > はまぞふさんの記事を見ながら
      > やっていましたからね。(笑)

      ありがとうございます^^
      お役に立てることが出来て、光栄です(^^)/

      またのお越しをお待ちしてますね^^

  3. まなぞふさん、こんにちは。
    さっちです

    コメントをいただくって大切ですね。集客の一歩ですから。
    とてもわかりやすかったです。
    ありがとうございます。

    • さっちさん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      > コメントをいただくって大切ですね。集客の一歩ですから。

      そうですね。

      シリウスでブログを運営するときは、
      コメント欄が無いことがネックですからね。

      これが解消できれば、
      シリウスの活用方法が広がりますね^^

      参考にしてみてくださいね^^

  4. はまぞふさんこんばんわ!

    はまぞふさんの記事はいつ見ても

    「あ、すげー丁寧
    しっかも細か!!」

    と思います。

    はまぞふさんの安定感を

    今日もぽちっと応援完了です!

    • ゆきリエイターさん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      > 「あ、すげー丁寧
      > しっかも細か!!」

      ありがとうございます^^

      多分・・・、

      会社でよくマニュアルを作成するので、
      その癖が出ているのかもしれません^^;

      応援ありがとうございます^^

  5. はまぞふさん
    シリウスにコメント欄ですか?
    考えたこともなかったです。
    最近ワードプレスばっかりで・・・

    なるほど。今度シリウスでサイトを作ったときには
    参考にさせていただきますね。
    応援して帰ります。

    • はるにれさん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      シリウスは基本的にサイトをつくる、
      ソフトですからね^^;

      ワードプレスでブログを構築している方には、
      あまり意味の無い情報かもしれませんね^^

      でも、シリウスで作ったサイトに、
      訪れた方の反応を知るには、
      手軽な方法かもしれません。

      今度シリウスでサイトを作った際には、
      ぜひ参考にしてみて下さいね^^

      応援ありがとうございます^^

  6. はまぞふさん

    こんにちは、きりとです。

    シリウスは、基本的にコメントが出来ませんが
    コメントを読者から貰う方法は
    僕は掲示板の設置以外は思いつきませんでした。

    まさか、フェイスブックという方法もあったなんて
    考えもつかないことで驚いています。

    確かに、シリウスっぽいサイトなのに
    コメントが出来るブログがあったりするので
    疑問を感じていたことがありました。

    なるほど、こういうことだったんですね。

    シリウスでコメントをするという方法を
    図で解説をしているので
    本当に分かりやすいですね。

    参考になる記事をありがとうございました。

    応援していきますね。

    • きりとさん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      > まさか、フェイスブックという方法もあったなんて
      > 考えもつかないことで驚いています。

      最近、よくフェイスブックのコメント欄を
      設置しているサイトをよく見かけたので、
      何か方法があるんじゃないかなと思って、
      探してみました^^

      > シリウスでコメントをするという方法を
      > 図で解説をしているので
      > 本当に分かりやすいですね。

      ありがとうございます^^

      シリウスを使う際は、
      参考にしてみて下さいね^^

      応援ありがとうございます^^

    • さぼてんさん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      > Facebookのコメント欄というのは、SNSでバズらせるのには大事ですよね。
      > まぁ、バズらせるのは難しですが・・・。

      そうですね^^
      バズらせるには、Facebookのコメント欄は、
      有益なツールですね^^

      まぁ、バズらせるのはむずかしいですけどね(-_-;)

      応援ありがとうございます^^

  7. はまぞふさん

    こんにちは、りつきです。

    この記事、実は、数日前に読ませて
    頂いてはいたのですが…

    私には、あまりにも高度な内容でした
    (汗)
    本当に勉強になります。
    はまぞふさん、
    いつもありがとうございます。
    応援していますね!

    • りつきさん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      > この記事、実は、数日前に読ませて
      > 頂いてはいたのですが…
      >
      > 私には、あまりにも高度な内容でした
      > (汗)

      あらら、そうでしたか^^;

      Facebookのコメント欄は、
      そんなに難しくはなかったので、

      Facebookをお使いなら、
      一度挑戦してみて下さいね^^

      応援ありがとうございます^^

  8. こんにちは。
    ブログランキングからお邪魔しました。
    なるほど~そうなんですね。
    とても勉強になります。

    ありがとうございます。
    応援していきます。

    • かめきちさん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      Facebookのコメント欄は、
      意外と便利なので、
      いろんなところで使えると思いますよ。

      ぜひ使ってみて下さいね^^

      応援ありがとうございます^^

  9. はまぞふさん、こんばんは!

    先日はご訪問頂きありがとうございました。

    SIRIUSは使いやすくていいのですが、
    コメント欄がないのが残念だなぁと思ってました。
    フェイスブックで出来るなんて初めて知りました。
    それから先の交流も出来るかもしれないですし、
    いいですね!

    はまぞふさんの記事の構成やネタ選びなど、
    とても参考になります。
    いつもありがとうございます(*^▽^*)

    応援して帰ります!
    またお邪魔させて下さい♪

    • ゆかりさん、こんにちは。
      はまぞふです。

      コメントありがとうございます^^

      > SIRIUSは使いやすくていいのですが、
      > コメント欄がないのが残念だなぁと思ってました。
      > フェイスブックで出来るなんて初めて知りました。
      > それから先の交流も出来るかもしれないですし、
      > いいですね!

      シリウスでも、コメント欄を付けることができれば、
      活躍の場が広がりますからね^^

      方法を探してみました。

      Facebookのコメント欄は
      コメントもできるし、SNSでも繋がることができるので、
      一石二鳥かもしれませんね^^

      応援ありがとうございます^^
      またのお越しをお待ちしておりますm(_ _)m

コメントを残す