nobigawa.com

アラフォーフリーランサーの気のまま雑記ブログ

ブログ運営

AFFINGER4にFacebookコメント欄を入れてみた

投稿日:2017年4月20日 更新日:

コメント欄画像

こんにちは。プロ引きこもりののびがわです。
AFFINGER4を使うのはとても奥が深いです。

まだ全然使いこなせていない感があります。
設定しがいがあります。

最近消したコメント欄のことで新しい情報を得て復活させました。
今回は一度閉鎖したコメント欄を再開したので紹介します。

コメント欄をなくした経緯と復活まで

以前色々考えた上でコメント欄をなくしたことを記事にしました。

コメント欄閉鎖のアイキャッチ
ブログにコメントがつかないので閉鎖します

ワードプレスブログを運営している方が一度は考えたことがありそうな話題。 それはコメント欄をどうするかということです。 今回はコメント欄のあれこれを紹介します。 目次1 コメント欄を閉鎖しました2 ブロ ...

他のブログサービスよりも直接記事にコメントをもらえないと考えています。
でもそれは自分のブログに限っては記事数も少ないし、PVも少ないからですね。

記事のクオリティもまだ低いのでコメントを期待できないです。
海外からのスパムコメントもくる始末です。

そんなコメント欄を閉鎖している自分が他のブログを見ていて気になったものがありました。
それはFacebookアカウントでのコメント欄です。

Facebookアカウントを持っていないとコメントできません。
これは面白そうだと思いました。
そこでFacebookでのコメント欄を入れようと決めました。

コメント欄を復活させた目的

コメント欄を復活させる目的は以下の3つ。

  • コメントが実際くるか
  • まだスパムはくるのか
  • 勉強も兼ねて(実はこれが一番の目的)

コメントはこなくてもいいと思っています。
ただコメントがきたとしたらそれがどういう内容なのかも気になるところです。

スパムに関してはFacebookアカウントでわざわざくることはないと思っています。
ですが実際スパムがきたらどんな内容になるのかも気になりました。

そして今回の目的が初心者がこの設定をできるのかどうかということ。
簡単に設定できればいいと思っています。
AFFINGER4でやってみるとどうなるかというのも検証します。

Facebookコメント欄の設定方法

手順は次の通り。

  1. コメントのプラグインコードを取得する
  2. テンプレートにコードを埋め込む

今回Facebookコメント欄を設定するにあたり、次のサイトを参考にさせてもらいました。

WordPressにFacebookのコメント欄を実装する方法(プラグイン未使用)

コメントのプラグインコードを取得

コメントのプラグインコードは↓のサイトで入手できます。

コメントプラグイン

コメントプラグインのコードジェネレータの下にある「コードを取得」をクリックします。

コードジェネレータ画面

するとコードの画面が表示されます。

Facebookプラグインコード画面

上のコード1とコード2をそれぞれテンプレートに埋め込むために別にコピーしておきます。

コード1はそのまま。
コード2は「data-href=" "」のURL欄を「<?php the_permalink(); ?>」に書き換えます。

テンプレートにコードを埋め込み

コード1とコード2をそれぞれテンプレートに埋め込んでいきます。

コード1の埋め込み場所は「テーマヘッダー(header.php)」です。

外観 > テーマの編集 > AFFINGER4のテーマヘッダー(header.php)を選択
<body 〜 >の直下にコード1を埋め込み

コード1の埋め込み場所

忘れずに「ファイルを更新」をクリックしてください。

コード2の埋め込み場所は2つ。
「single-type1.php」と「single-type2.php」です。

「個別投稿(single.php)」は特に変更しません。

場所は以下の通り。

外観 > テーマの編集 > AFFINGER4のsingle-type1.phpまたはsingle-type2.phpを選択
「ページナビ」の上に埋め込み。

コード2埋め込み場所

それぞれファイルを更新してください。

これで記事の下部にFacebookコメント欄が表示されました。

コメント欄挿入後

終わりに

ワードプレスのコメント欄も表示される場合は以下の方法で非表示にしてください。

AFFINGER4管理 > 投稿・固定記事設定の
「コメント欄を非表示にする」にチェックを入れる。

AFFINGER4以外でのFacebookコメント欄を入れる記事はなかったので記事にしてみました。
これだけでも勉強になりますね。

-ブログ運営
-, ,

Copyright© nobigawa.com , 2019 All Rights Reserved.