商品検索一覧コンテンツを作成する方法
コンテンツタイプ：商品検索一覧
商品検索一覧の表示、絞り込みができる検索フォームが作成できます。
Attention
商品検索一覧、商品詳細コンテンツは、「定期・頒布会商品」は表示対象外になります。
コンテンツ作成
歯車マーク：コンテンツ管理 > コンテンツ作成
コンテンツタイプ「商品検索一覧」を選択し、コンテンツを新規作成します。
あらかじめ用意されたサンプルデザイン（コンテンツID：item_search）を複製・編集してコンテンツを作成することも可能です。変数の利用方法などもご確認ください。
コンテンツ情報 / コンテンツ設定 / 検索クエリ設定
次に、ページ全体の閲覧・表示制御などを行います。
| コンテンツタイプ | 作成するコンテンツタイプを表示 |
|---|---|
| コンテンツURL | https://システム設置先/contents.php?c=コンテンツID ※コンテンツIDを変更するとURLも変更されます。 |
| コンテンツID | コンテンツURLに使用されるID ※新規作成時に指定したID。省略時は自動で付与されます。 |
|---|---|
| カテゴリー名 | 管理用にカテゴリ分けする場合は設定。省略した場合は「未設定」に振り分け |
| コンテンツ名 | コンテンツの管理名称 |
| 一覧表示件数 | 検索結果の一覧表示件数を設定 |
| 公開範囲 | 作成したコンテンツの公開範囲を設定 ※「会員」に指定した場合、未ログイン（一般）には公開されません。 |
| 閲覧権限外の転送URL | 「公開範囲」に設定していない権限でアクセスした場合の転送先URL |
| 対象デバイス | 閲覧が可能な端末を設定 ※レスポンシブの場合、「PC」「スマートフォン」両方にチェックを入れてください。 |
| 対象外デバイスの転送URL | 「対象デバイス」で設定していない端末からアクセスした場合の転送先URL |
| BASIC認証 | コンテンツ閲覧時にBasic認証をかける場合に設定 |
| 公開設定 | 公開状態を設定。公開 / 非公開 |
| 絞り込み条件 | 条件を指定することで、特定の条件を満たした情報のみ表示 複数条件を指定した場合は「And条件」 ・式左辺：絞り込み条件を設定 ・式右辺：絞り込み条件の値 例1：商品タイプ「物販」のみ表示 商品タイプ ＝ 物販 例2：商品在庫「10」より多い商品を表示 商品在庫 > 10 |
|---|---|
| 並び替え条件 | 左辺で選択した項目で並び替え条件を設定 |
テンプレートHTML
各編集エリアでHTMLの編集や変数を挿入します。
基本HTML
【基本HTML】では、コンテンツのベースとなるHTMLを記述します。
まず、検索フォームを作成します。フリーワード検索のほか、商品ID、商品名、販売価格、在庫数、登録日時の並べ替え変数【ソートURL】が用意されています。
▼商品検索：フロント側表示とコンテンツ変数の記述例
- Attention
-
フォームを作成する場合、必ずフォームスタートの変数：
[form_start]とフォームエンドの変数：[form_end]を配置します。
次に、商品情報を出力するHTMLを入力します。
検索結果の一覧を表示する[list]変数のほか、ページャー変数[pager_li]などが用意されています。
▼商品検索：フロント側表示とコンテンツ変数の記述例
| 変数名 | 変数 |
|---|---|
| 【検索｜引数対応（$1）】 フリーワード（テキスト） 【検索条件】フリーワード |
[search_keyword] [search_content_keyword] |
| 検索ボタン フォーム開始タグ フォーム終了タグ |
[form_search_button] 出力例：<input type="submit" value="検索する" /> [form_start] 出力例：<form action="./contents.php" metdod="get" name="form_search"> [form_end] 出力例：</form> |
| 【ソートURL】商品ID 【ソートURL】商品名 【ソートURL】販売価格 【ソートURL】在庫数 【ソートURL】登録日時 |
[sort_item_id] [sort_name] [sort_price] [sort_stock_row] [sort_regist_unix] |
| 検索結果数 検索範囲（前） 検索範囲（後） ページャー（<li></li>） |
[item_text] [search_limit_s] [search_limit_e] [pager_li] |
| 検索条件パラメータ（URL） | [search_param] |
| 検索リスト（一覧挿入HTML） | [list] |
| 【ソートURL】の変数 |
|---|
| 特定のキーワードで商品の並び順を変更させたい場合、ソートURL変数を使用します。 任意のテキストなどにアンカーリンク（aタグ）で設置します。 デフォルトは昇順（ASC）でソート、再度リンク押下で降順（DESC）ソートになります。 記述例：<p><a href="[sort_price]">価格</a></p> 出力例：<p><a href="./contents.php?c=コンテンツID&order_key=price&order=ASC">価格</a></p> |
一覧挿入HTML
【一覧挿入HTML】の編集エリアでは、【基本HTML】[list]変数に出力する内容を記述します。
商品詳細コンテンツを作成すると、「商品詳細URL変数」が生成されます。任意の商品表示変数にリンクすることで、指定の詳細ページへ商品IDを付与して遷移します。
- コンテンツ作成順序について
- 「商品詳細URL変数」を利用するため、詳細コンテンツの作成が後になる場合は、コンテンツIDのみ決定し、空コンテンツを先に生成しておくとよいでしょう。
▼商品一覧のフロント側表示とコンテンツ変数の記述例
| 変数名 | 変数 |
|---|---|
| 商品ID | [item_id] |
| 商品名 | [name] |
| 商品タイプ | [item_type] 出力例：物販 / DLコンテンツ |
| 販売価格（桁区切りなし） 販売価格（桁区切りあり） |
[price] 出力例：1000 [price_format] 出力例：1,000 |
| 在庫数【引数対応（$1:$2）】 | [item_stock_row]（※1 引数指定は半角スペース不可） |
| 商品在庫有無【引数対応（$1:$2）】 | [item_stock_value]（※2 引数指定は半角スペース不可） |
| 商品URL | [item_url] |
| キャッチコピー | [item_title] |
| 商品説明 | [item_text] |
| 商品画像1～10（URL） 商品画像1～10（imgタグ） |
[item_image1]～[item_image10] 出力例：./file/item/商品システムID/画像ファイル名 [item_image1_img]～[item_image10_img] 出力例：<img src="./file/item/商品システムID/画像ファイル名"> |
| 商品詳細URL（商品詳細コンテンツ名） | [item_info_商品詳細コンテンツID] |
引数指定は以下のとおりです。
| 在庫数【引数対応（$1:$2）】⇔ [item_stock_row]（※1） |
|---|
| $1（第1引数）：単位を示す情報、未指定時「空文字」 $2（第2引数）：在庫0以下の場合の表記、未指定時「-」、第1引数の内容を無視して表示 例：[item_stock_row:個:在庫なし]と指定した場合、 商品在庫「10」の場合は「10個」、在庫「0」の場合は「在庫なし」と表示 |
| 商品在庫有無【引数対応（$1:$2）】⇔ [item_stock_value]（※2） |
| $1（第1引数）：在庫があるときの表示情報、未指定時「1」 $2（第2引数）：在庫がないときの表示情報、未指定時「0」 例：[item_stock_value:在庫あり:在庫なし]と指定した場合、 「商品在庫あり」の場合は「在庫あり」、「商品在庫なし」の場合は「在庫なし」と表示 |
結果なしHTML
検索結果が「0件」だった場合のHTMLを記述します。
