[baserCMS]お客様の声プラグインの使い方

ダウンロード

・baserマーケット

このプラグインの機能

このプラグインは、コーポレートサイトでよく作られる「お客様の声」ページを簡単に実装するためのbaserCMS専用プラグインです。

現行バージョン「Ver.0.9.5」の主な機能は以下の通りです。(2015/07/06現在)

• ユーザーが管理画面で「お客様の声」を登録・編集できる
• 登録項目は「お客様名」「タイトル」「本文」「購入時期」に加え、画像を最大４枚登録できる
• 利用項目設定により、不要項目を登録画面から非表示にできる
• 利用項目設定により、「本文」入力欄にCKEditorを設定できる
• 利用項目設定により、アップロード画像の最大サイズを設定できる
• 登録された画像から自動でギャラリーページ（ex.事例画像集）が作れる（おまけ的な機能です）
• カテゴリ毎に「お客様の声」を分類できる
• カテゴリ毎に画像ギャラリーページを表示できる（おまけ的な機能です）
• カテゴリ毎に画像ギャラリーページに表示する画像の最大枚数を変更できる
• カテゴリ毎に「コンテンツテンプレート」を変更できる

このプラグインを使うことで、固定ページで作られることの多かった「お客様の声」ページに管理機能を持たせることができ、ユーザーが更新しやすい環境を作ることが出来ます。また性能は高くありませんがギャラリー機能があるので、「お客様の声」で登録した画像をそのまま使った「事例画像集」なども、比較的容易に作成できます。

インストールと利用項目の設定

インストール

インストールの方法は通常のプラグインと変わりませんが、webrootの「img」フォルダ内に「voice_plugin」フォルダを自動で生成しますので、予め「img」フォルダのパーミッション等をご確認ください（このフォルダはアップロードされた画像を保存しておくためのフォルダです）。結果的に以下のようになります。

  /app/webroot/img/voice_plugin/

プラグインのインストールについては、公式Wikiに掲載されていますので、そちらをご覧ください。

利用項目の設定

本プラグインでは、利用項目を設定することで、必須項目以外の項目を非表示にする事ができます。お客様の声を登録する際に入力できる項目は以下の通りですが、そのうち※印がついたものは「利用項目の設定」で非表示にできます。

• カテゴリ選択
• お客様名
• タイトル
• 本文
• 画像１（※）
• 画像２（※）
• 画像３（※）
• 画像４（※）
• 購入時期（※）
• 公開設定

また「利用項目の設定」では「本文」入力欄でCKEditorを利用するかどうかが選択できるほか、画像１〜画像４でアップロードされる画像のサイズ（最大値）を決めることが出来ます（なお、システム管理でCKEditorを使わない設定になっている場合、ここでCKeditorを選択したとしても、通常のテキストエリアにが表示されます）。

カテゴリの作成と管理

利用項目の設定が終わったらカテゴリを作成します。もちろん、カテゴリ無しでも使用できますが、カテゴリを作成しておくとコンテンツテンプレートを選択したり、カテゴリ毎に一覧表示させたり出来るため何かと便利です。

カテゴリの登録画面では以下の内容を入力・設定できます。

• カテゴリ名
• コンテンツテンプレート
• ギャラリー表示設定（1ページの表示枚数）

各項目の詳細は以下の通りです。

カテゴリ名

このカテゴリの名称です。日本語で設定できます。

コンテンツテンプレート

このカテゴリのデータを表示する際に使用されるテンプレートです。設置場所等は後述します。

1ページの表示枚数

このカテゴリのデータから画像を抜き出してギャラリー表示する際、１ページ内に表示する画像の枚数を指定できます。

お客様の声の登録・編集・削除

ここまでの設定が終わったら、いよいよ「お客様の声」を登録していくことになります。「お客様の声 メニュー」の「新規登録」から登録画面を開いて下さい。

この登録画面で表示される項目は、先の「利用項目の設定」で行った設定に応じて変化しているはずです。必要事項を順番に記入して「保存」ボタンをクリックしてください。登録が完了します。

なお、登録された情報は「編集」「削除」を行う事ができます。一覧表示画面の左側にある操作アイコンから行うのが良いと思います。

コンテンツテンプレートについて

ここからは登録したデータを表示する方法をご案内します。

コンテンツテンプレートの概要

本プラグインではコンテンツテンプレートによって、View側（表示側）の処理を行います。まずはプラグインに同封されている「default」テンプレートをご覧ください。以下の場所に入っています。

  /app/Plugin/Voice/View/Voices/default/

本プラグインのコンテンツテンプレートは３つのファイルから構成されます。すなわち「index.php」「view.php」「gallary.php」です。

index.php

一覧表示を行うためのテンプレートです。

view.php

個別の表示を行うためのテンプレートです。

gallary.php

ギャラリー表示を行う際のテンプレートです。

これらの３つが１セットになって、本プラグインの「コンテンツテンプレート」となります。 オリジナルのコンテンツテンプレートを用意したい場合は、以下のどちらかに３つのファイルをいれたフォルダを設置します。

  /app/Plugin/Voice/View/Voices/

  /app/webroot/theme/（お使いのテーマ）/Voices/

最初に示した場所はプラグイン内部、後に示した場所はテーマ内部になります（テーマ内部でご利用の場合、テンプレートを入れるフォルダが「Voices」と複数形になっている事にご注意ください。「Blog」や「Mail」など他のプラグインは、ここが単数形になっている事があります）。例えば「test」という名前のコンテンツテンプレートを作成する場合は、以下のようになります。

  /app/webroot/theme/（お使いのテーマ）/Voices/test/

index.php

まず最初に一覧表示を担うテンプレート「index.php」についてご案内します。このテンプレート内部は次のような格好になっています。

  <h2><?php $this->BcBaser->contentsTitle() ?></h2>
<p>
  お客様の声を一覧で表示しています。
</p>

<?php if(!empty($voices)): ?>
  <?php foreach($voices as $voice): ?>

    <h3><?php $this->Voice->title($voice, true) ?></h3>
    <p><?php $this->Voice->content($voice) ?></p>
    <p>お客様：<?php $this->Voice->customerName($voice) ?></p>
    <p>購入時期：<?php $this->Voice->buyTime($voice) ?></p>
    <p>
      <?php $this->Voice->image($voice, 1) ?>
      <?php $this->Voice->image($voice, 2) ?>
      <?php $this->Voice->image($voice, 3) ?>
      <?php $this->Voice->image($voice, 4) ?>
    </p>

  <?php endforeach; ?>
<?php else: ?>
  <p>データがありません。</p>
<?php endif; ?>

このテンプレートでは変数「$voices」の中に格納されたデータを表示するようになっています（残念ながら、現在のところ表示するのに便利な専用ヘルパーが未実装ですver.0.9.5以降はヘルパーを実装しています。ヘルパーについては後述。）。ループしながら表示させます。

view.php

この「view.php」は個別表示を担います。先ほどの「index.php」では簡易な情報を出力するにとどめ、この「view.php」で詳細な情報を表示する、などの使い方を想定しています。

このテンプレートは以下のようになっています。

  <h2><?php $this->BcBaser->contentsTitle() ?></h2>

<?php if(!empty($voice)): ?>

  <h3><?php $this->Voice->title($voice, false) ?></h3>
  <p><?php $this->Voice->content($voice) ?></p>
  <p>お客様：<?php $this->Voice->customerName($voice) ?></p>
  <p>購入時期：<?php $this->Voice->buyTime($voice) ?></p>
  <p>
    <?php $this->Voice->image($voice, 1) ?>
    <?php $this->Voice->image($voice, 2) ?>
    <?php $this->Voice->image($voice, 3) ?>
    <?php $this->Voice->image($voice, 4) ?>
  </p>

<?php else: ?>
  <p>データを表示できません。</p>
<?php endif; ?>

このテンプレートでは変数「$voice」に入っているデータを表示させています。こちらも専用ヘルパーが未実装ですので、上のような処理で出力を行っています。ver.0.9.5以降はヘルパーを実装しています。

gallary.php

このテンプレートは、登録されたデータから画像だけを抜き出してギャラリー表示する際に使用されます。

  <?php $this->BcBaser->css(array('Voice.voice'), array('inline' => true)); ?>

<div class="gallaryBox gallaryClearfix">
<?php if (!empty($images)) : ?>
  <?php
  foreach($images as $image){
   if(!empty($image['image'])){
    //画像を出力しつつ、リンクを設定する。
    $this->BcBaser->link($this->BcBaser->getImg('voice_plugin/'.$image['image'], array('class' => 'gallaryImage')),
      array(
        'plugin' => 'voice',
        'controller' => 'voices',
        'action' => 'view',
        $image['id']
      ), array('class' => 'gallaryImageLink'), false);
    }
  }
  ?>
<?php else : ?>
  <p>表示できるデータがありません。</p>
<?php endif; ?>
</div>

<div class="gallaryNaviLink gallaryClearfix">
  <div class="gallaryNextPage">
  <?php $this->BcBaser->nextGallary($currentPage) ?>
  </div>
  <div class="gallaryPrevPage">
  <?php $this->BcBaser->prevGallary($currentPage) ?>
  </div>
</div>
  

デフォルトのテンプレートでは使い方の一例として、画像をクリックすると、その画像が登録されている「お客様の声」データを表示（リンク）するようにしてあります。この「gallary.php」のカスタマイズ次第で、colorboxなどでポップアップするような事も可能ですので、興味のある方はぜひお試しください。

なお、この「gallary.php」では、ページ間の移動を行うために２つのヘルパーが用意されています。

$this->BcBaser->nextGallary($currentPage)

次のページがある場合に「次のページへ」というリンクを表示します。引数には「$currentPage」を入れておけば、現在のページに適したリンクを出力するようになっています。

$this->BcBaser->prevGallary($currentPage)

前のページがある場合に「前のページへ」というリンクを表示します。引数には「$currentPage」を入れておけば、現在のページに適したリンクを出力するようになっています。

表示用URLとパラメータ

上述のコンテンツテンプレートのカスタマイズが終わったら、実際にフロント側（ユーザーがみる側）にアクセスしてみてください。各URLと使用できるパラメータは以下の通りです。

一覧表示ページ

「お客様の声」の一覧表示は、以下のURLに設定されています（スマートURLはオンの場合でご説明しています）。

  http://（baserCMSのドメイン）/voice/voices/index

もしも、カテゴリ毎で一覧を表示したい場合は、パラメータにカテゴリNO（id）を与えてください。例えばカテゴリNOが「1」のカテゴリに含まれるデータだけを一覧表示するには、

  http://（baserCMSのドメイン）/voice/voices/index/1

としてください。

個別表示ページ

登録された「お客様の声」を一覧ではなく、個別に表示するには以下のURLにパラメータをつけてアクセスします。パラメータは、登録されたデータのNO（id）です。例えば、NO「2」にアクセスするには、

  http://（baserCMSのドメイン）/voice/voices/view/2

としてください。なお一般的には、一覧表示のリンクを辿っていけば個別のページが表示される、というようにしたいと思います。デフォルトのコンテンツテンプレート「default」に入っている「index.php」で、そのような処理をしていますので参考にしてみてください（データの「タイトル」部分がリンクとなっており、クリックすると個別表示ページヘ遷移する）。

ギャラリーページ

画像ギャラリーを表示するには、以下のURLにアクセスしてください。

  http://（baserCMSのドメイン）/voice/gallary

画像ギャラリーはカテゴリ毎に表示することが出来ます。そうしたい場合はパラメータにカテゴリNO（id）を渡してください。例えばNO「3」のカテゴリに含まれる画像だけを取り出してギャラリー表示する場合は、

  http://（baserCMSのドメイン）/voice/gallary/3

というようにしてください。なお、ギャラリー表示は本プラグインにとって「おまけ」的な機能です。登録されている画像が多かったりすると、処理が遅くなる可能性がありますので、予めご了承ください。

ヘルパーについて

本プラグインはコンテンツテンプレート内で使えるヘルパーを実装しています。

コンテンツテンプレート内で使用するもの

$voice

データ本体です。index.phpではループ内で、view.phpではどこででも「$voice」と入れれば動作します。

$link

初期値はfalse。出力するタイトルにリンクをつけるかどうかを指定できます。

$options

配列でリンク用のオプション指定が可能です。詳しくはlink()関数についてご覧ください。

$voice

データ本体です。index.phpではループ内で、view.phpではどこででも「$voice」と入れれば動作します。

$voice

データ本体です。index.phpではループ内で、view.phpではどこででも「$voice」と入れれば動作します。

$voice

データ本体です。index.phpではループ内で、view.phpではどこででも「$voice」と入れれば動作します。

$voice

データ本体です。index.phpではループ内で、view.phpではどこででも「$voice」と入れれば動作します。

$voice

データ本体です。index.phpではループ内で、view.phpではどこででも「$voice」と入れれば動作します。

$number

画像１〜４のどれを表示するか、整数型で指定します。

どこからでも呼び出せるもの

$limit

初期値は5。取得したい件数を指定します。

$options

配列でオプションの指定が可能です。
・categoryId：初期値はnull。カテゴリIDを入れれば、そのカテゴリ内のデータだけを取得する（整数型）。

このプラグインの今後

本プラグインには、テンプレートで使うヘルパーやカテゴリの一覧表示機能が無いこと、そられをウィジェット化する機能が足りていないなど、現在の段階では不十分な点がございますが、もしも、その他「こんな機能が欲しい」「これがあったら良いのに」といったご意見やご感想がございましたら、弊社の問い合わせフォームよりご連絡下さいませ。

それでは今後とも株式会社ヒニアラタを何卒よろしくお願い致します。