2つのプラグイン+αでフロントエンドから投稿できる「ゲストブック」を簡単に作る方法

ゲストブックと言えばbbpressなどの掲示板プラグインを使ったり、標準のコメントをカスタマイズする方法などがありますが、今回はちょっと工夫を凝らして2つのプラグインでゲストブックを作る方法を紹介します。コメントはコメントとして残したい方に特におすすめの方法です。
私が管理している

ご訪問ありがとうございます。このサイトは名古屋のとある場所でたくさんの方々に見守られながら暮らす地域猫ちゃんの様子を綴った日記中心のサイトです。ここに定住する猫ちゃんたちは全員不妊処置済み。繁殖してしまう懸念がない一方で、この代限りの命にな

のサイトで実際に使っている方法です。

スポンサーリンク

ゲストブックの作成に必要なアクション

 この仕組みができれば、不特定の方から、もしくは会員(メンバー)の方から記事コンテンツを書いてもらうという点では「ゲストブック」「掲示板」「ニュース」「フリマ」「里親さがし」などいろいろなことに転用できると思います。この仕組みで必要なアクションとしては

  1. 管理画面(バックエンド)からではなく、閲覧画面(フロントエンド)から投稿できるようにする
  2. 管理画面(バックエンド)からではなく、閲覧画面(フロントエンド)から編集できるようにする
  3. 管理画面(バックエンド)からではなく、閲覧画面(フロントエンド)から削除できるようにする
  4. 投稿された記事は承認後に公開される/承認不要で公開されるのいずれかが選べるようにする
  5. 投稿された記事は自由に内容を書くのではなくフォーム形式で入力してもらう
  6. フォームには必須項目を設け、スパム防止をする
  7. フォームに入力した情報が決まったテンプレートで表示されるようにする
  8. テンプレートはゲストブックにのみ適用し、その他の記事は通常のテンプレートで表示する
  9. 投稿者と投稿を見た人がメールなどでコミュニケーションを取れるようにする
  10. 内容別や用途別で複数設置できるようにする
  11. 管理画面(バックエンド)からではなく、閲覧画面(フロントエンド)からメンバー登録できるようにする
  12. 管理画面(バックエンド)からではなく、閲覧画面(フロントエンド)からメンバー編集できるようにする
  13. 管理画面(バックエンド)からではなく、閲覧画面(フロントエンド)からメンバー削除できるようにする

といったところでしょうか。今回は誰でも足跡を残せるようにするゲストブックなのでメンバー登録や管理、投稿者と閲覧者とのコミュニケーションについては後々考えるとして、その上の項目については網羅できるようにしたいと思います。

この仕組みを一からプログラムを書いて作るのは知識もいるし大変なのですが、Wordpressならたった2つのプラグインとテンプレートの編集で実現することができます。

今回作る「ゲストブック」のいいところ

フォームを使う

このゲストブックが掲示板と違うところは「フォーム」を使って入力してもらうということです。「フォーム」を使う利点は

  1. 入力項目を補助したり限定したりできる
  2. 入力する人が何をどこに入力するのかが分かる
  3. 管理者としては必要な情報を集めやすい

ことですね。自由に書くことができる掲示板やコメントは文字を自由に入力する欄しかないのでテーマから外れた書き込みなどで管理者側が苦労することが多いのですが、フォームを使えばある程度軽減されます。

いくつでも作れる

単純な足跡的なゲストブックだけでなく、記事の評価に使ったり、口コミ情報を書き込んでもらったりとこの方法を1つ知っておけばアイデア次第でいろいろな使い方ができます。それぞれの機能を持ったプラグインはたくさん出ていますが動作の基本は今回の仕組みと同じことなのでプラグインの数も削減できますし、デザインも統一できます。

どこにでも表示できる

入力フォーム、投稿された記事のリストなどをどこにでも表示することができるようになります。

投稿後の反響や意見などは通常のコメントを使う

 投稿する場所(投稿タイプ)が違うだけで通常の記事と何ら変わりない扱いになりますから、当然コメント機能もそのまま使えます。会員制関連のプラグインをつかったりすれば、投稿者がコメントをモデレートしたり返信したりすることもできるようにはなりますが、その機能を追加しようとすると結構な大作業になるため今回はパスします。

プラグインの概要とインストール方法

今回は簡単にがテーマなのでこれから紹介する「Custom Post Type UI」「WP User Frontend」というプラグインを使い、それぞれの設定を行うことでゲストブックを設置します。

Custom Post Type UI

「投稿」とは別の「記事の集まり」を作るプラグインです。

WP User Frontend

フロントエンド(訪問者が見ているページ)に独自のフォームを設置して投稿してもらうプラグインです。

この2つを使って「WP User Frontend」で入力された内容を「Custom Post Type UI」で作ったカスタム投稿タイプに保存していくというシステムを作ります。

「Custom Post Type UI」のインストールと設定

プラグインの概要と説明は

Wordpressでは通常の投稿とは別に「投稿の集まり」を作るカスタム投稿タイプという機能があります。また、通常のカテゴリーとは別に「カテゴリーの集まり」を作るカスタムタクソノミーという機能があります。「Custom Post Type UI」は「カスタム投稿タイプ」や「カスタムタクソノミー」を簡単にいくつでも作成することができるプラグインです。
ワードプレスで通常の投稿とは別に「投稿の集まり」を作れる機能であるカスタム投稿タイプ。カスタム投稿タイプ用にテンプレートを作ってカスタムフィールドの入力のみで記事を作成できたり、カスタムタクソノミーといってカスタム投稿タイプごとに独自のタグやカテゴリーを設けられたりと、Wordpressでこれを覚えたらやりたい放題になる機能ですが、そもそも機能を使うのにもちょっと知識が必要だし、カスタム投稿タイプは導入しただけでは通常の記事のように動作しないし、いろいろと設定をしないと検索エンジンクローラーが来てくれない(インデックスされない)など忘れてはいけない設定がたくさんあるので、忘れないように手順を書いておこうと思います。これだけやればカスタム投稿タイプを100%活用できる手順です。
で紹介していますので参照ください。

リンク先の記事ではカスタム投稿タイプを通常の投稿と極限まで同一に使うための設定を紹介していますが、今回はゲストブックなので、pingの送信、RSSフィード、カテゴリーの統合、新着記事への参入などは好みに応じて設定してください。

「WP User Frontend」のインストールと設定

プラグインの概要と説明は

「WP User Frontend」は日本語化してしまえば使い方は一目瞭然なので、一度使ってみてほしいプラグインです。もう一度書きますが、入力項目を指定できる(通常の何でも入力できる本文なしでフォームの作成ができる)のはおそらくこのプラグインだけだと思います。
で紹介していますので参照ください。日本語化してしまえば内容は一目瞭然のプラグインなので設定は簡単だと思います。
おおまかな流れは

  1. プラグインを日本語化する
  2. フォームを作る
  3. 投稿できる権限などを設定する
  4. 固定ページなどにフォームのショートコードを追加する

です。試行錯誤しながら目的に合った設定をしてください。
※2点だけ必ず設定しなければならないのはフォームの設定で

  1. 「投稿設定」タブの中の「投稿タイプ」をフォームから投稿された記事を保存するカスタム投稿タイプに変更することです。何も指定しないと通常の投稿と同じ扱いになってしまいますので注意してください。
  2. フォーム作成時に「メタキー」欄に分かりやすい半角英数字を入力しておいてください(後ほどの表示カスタマイズ部分で使用します)

ゲストブックに投稿された内容を表示する方法

今回のテーマ「ゲストブック」作成の中ではここがいちばん難解で大変な作業だと思いますが、まあ慣れてしまえば何てことはありませんし、いったんカスタマイズ方法さえ分かってしまえば通常の投稿用テンプレートであったり、他のカスタム投稿タイプであっても思いのままに投稿テンプレートをカスタマイズできるようになりますから是非覚えていただきたいです。

サンプルとしてゲストブックを作ったサイトではSimplicityの1.9というバージョンのテーマを使っていますので以前に行ったテンプレートの作成手順に従って設定していきます。

今使っている「Simplicity」でカスタム投稿タイプ向けの投稿テンプレートを作ってみたときの備忘録です。 せっかくカスタム投稿を作るのですから、それを表示するためのテンプレートをオリジナルで作りたいですよね。特にカスタムフィールドなどを使ってフロントエンドから入力した内容を表示させるにはカスタム投稿用のテンプレートを使う必要性が出てきます。

Simplicityはカスタマイズしやすいようにすごく分かりやすくファイルやコードが書かれているのですが、他のテーマでは複雑なものがあったりして大変かもしれません。

基本的にはテーマのsingle.phpを探してコピーを取り、「single-カスタム投稿タイプ名.php」というファイル名を付け、その中のループになっている場所に表示したい内容をphpやhtmlでコードを書いていくことでカスタム投稿タイプに対する独自のテンプレートは完成します。

※テンプレートを使わなくても、「WP User Frontend」に表示用テンプレートが存在するのですが、入力項目の羅列になってしまいますのであまりおすすめしません。

役に立つ情報でしたらぜひSNSやメールでシェアしてください
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  

メニューを表示できません

ページ先頭へ