このブログは、concrete5 アドベントカレンダー 2016 に参加しています。前日の、take556さんのconcrete5 2016の総括 でした。
※2016-12-5追記
⑤複合検索にするために検索ブロックのカスタムテンプレートを作成 の コードを5.7推奨用に書き直しました。
このブログはconcrete5 バージョン5.7.9をベースに書いています。
concrete5 の検索ブロックをカスタムテンプレートという機能を使ってカスタマイズすると、ページ属性やブロックを使った複合検索が可能になります。また、ページ属性の選択を設定すると通常はセレクトメニューになりますが、それをラジオボタンに変更してみたいと思います。他のブログでも紹介されているのですが、ワークショップ形式で一から作っていきたいと思います。
・サイトの説明
このような、食事の種類と場所を検索できるようなサイトを作ります。

①concrete5のインストール
今回は空白のサイトでインストールします。
インストールに関してはconcrete5公式サイト等をご覧ください。
http://concrete5-japan.org/help/5-7/installation/
②ページタイプを作成する。
[管理画面(上部メニュー一番右のボタン)→ページとテーマ→ページタイプ]
[ページタイプの追加]をクリックし、下記の通り入力して、[新規]ボタンを押します。

③ページ属性を作成する
[管理画面→ページとテーマ→ページ属性]
最下部「属性を追加」のプルダウンメニューで「選択」を選択し[実行]ボタンを押します

④ページを作成する
今回作成するのは、下の6ページです。
ページタイトル |
食事のジャンル(ページ属性) |
地域(ページ属性) |
ハンバーグ |
洋食 |
東京 |
パスタ |
洋食 |
大阪 |
ラーメン |
中華 |
東京 |
餃子 |
中華 |
広島 |
寿司 |
和食 |
大阪 |
天ぷら |
和食 |
広島 |
1.上部メニューの[新規作成]ボタンを押し[食事詳細]をクリック

2.上部[ページ設定]ボタン(歯車のマーク)→[属性]をクリック
3.左側のメニューから、「食事のジャンル」と「地域」をクリック
4.下の画像のように入力し、[変更を保存]ボタンを押します。
5.[編集モード終了]ボタン(鉛筆マーク)を押し[変更の公開]ボタンを押す。
続いて1にもどり.2つ目のページ以降を作成します。画像のようにパスタ・洋食・大阪と入力されている項目を上記の表を参照し置き換えて6ページ作成してください。

⑤複合検索にするために検索ブロックのカスタムテンプレートを作成
標準の検索ブロックでは、キーワード検索のみが有効になっていますが、下記のコードのようにページ属性を追加することで、そのページ属性が設定されているページの検索も可能になります。
・concrete/blocks/search/view.php ->
application/blocks/search/templates/meal_search.php コピーし下記のコードを挿入してください。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
|
?><form action="<?php echo $view->url($resultTargetURL)?>" method="get" class="ccm-search-block-form"><?php if (isset($title) && ($title !== '')) { ?><h3><?php echo h($title)?></h3><?php }?> <!-- 追加した部分です ------------------------------------------------------------- --> <h4>食事ジャンル</h4> <div> <?php $ak = Concrete\Core\Attribute\Key\CollectionKey::getByHandle('meal_genre'); $ak->render('search'); ?> </div> <h4>場所</h4> <div> <?php $ak = Concrete\Core\Attribute\Key\CollectionKey::getByHandle('meal_area'); $ak->render('search'); ?> </div> <!-- 追加した部分ここまで ------------------------------------------------------------- --> <?php if ($query === '') { ?><input name="search_paths[]" type="hidden" value="<?php echo htmlentities($baseSearchPath, ENT_COMPAT, APP_CHARSET) ?>" /><?php } elseif (isset($_REQUEST['search_paths']) && is_array($_REQUEST['search_paths'])) { foreach ($_REQUEST['search_paths'] as $search_path) { ?><input name="search_paths[]" type="hidden" value="<?php echo htmlentities($search_path, ENT_COMPAT, APP_CHARSET) ?>" /><?php } } |
※上記は変更部分のみです。ファイルの全体のコードが必要な場合は下記よりダウンロードしてください
⑥トップページに検索ブロックを設置して、カスタムテンプレートを適用
1.[管理画面→サイトマップ]よりトップページに移動します。
2.[編集モード]ボタンを押してください。
3.メインエリア上で、左クリックし、出てきたエリアメニューのブロックを追加をクリックします。
4.左のブロックタイプメニューから、[検索]を選択します。
5.ブロック編集画面になりますので、タイトル欄にに”グルメ”・ボタンテキスト欄に”検索”・「ここ以下のページ」を選択して[新規]ボタンを押してください。これで、検索ブロックの設置が完了です。この時点では、キーワードのみの検索項目になります。
5.次に先ほど作成したカスタムテンプレートを適用します。設置した検索ブロックの上で左クリックし、ブロックメニューから、[デザイン&カスタムテンプレート]を選択し、出てきたメニューの歯車のマークを押し、下の画像のようにMeal Search を選択し、[保存]をクリックします。

6.[編集モード終了]ボタンを押し、検索をしてみてください。この時点では、各項目がセレクトメニューで表示されます。
⑦セレクトメニューをラジオボタンに変更
concrete/attributes/select/search.php -> application/attributes/select/search.php へコピー
application/attributes/select/search.phpの11行目から16行目を下記のコードに変更します。
|
<input type="radio" id="<?php echo $this->field('atSelectOptionID')?>0" name="<?php echo $this->field('atSelectOptionID')?>[]" value="" checked><label for="<?php echo $this->field('atSelectOptionID')?>0"><?php echo t('** All')?></label> <?php foreach($options as $opt) { ?> <input type="radio" id="<?php echo $this->field('atSelectOptionID') . $opt->ID ?>" name="<?php echo $this->field('atSelectOptionID')?>[]" value="<?php echo $opt->getSelectAttributeOptionID()?>" <?php if (in_array($opt->getSelectAttributeOptionID(), $selectedOptions)) { ?> checked <?php } ?>> <label for="<?php echo $this->field('atSelectOptionID') . $opt->ID ?>"><?php echo $opt->getSelectAttributeOptionDisplayValue()?></label> <?php } ?> |
※上記は変更部分のみです。ファイルの全体のコードが必要な場合は下記よりダウンロードしてください
⑧実際にボタンを選択して、検索をしてみてください。

以上です。concrete5の検索ブロックは4行程度のphpのコードを足せば簡単に複合検索が実現できます。また、ここでは紹介してないですが、ページ属性のIDを使用して特定のページ属性だけをラジオボタンにすることも可能です。ぜひ、参考にしていただきポータルサイトなどに役立てていただければと思います。ここ分かりにくい、ここ間違っているよなどのご意見もいただけたらと思います。
このブログは、concrete5 アドベントカレンダー 2016 に参加しています。翌日は、tao-sさんの Ver.8 から使えるExpressオブジェクトとは? です