レコメンドコンポーネント¶

機能説明¶

前提

レコメンド機能オプション の契約が必要です。
レコメンド機能オプションは 2024 年 12 月で新規受付を終了しました。

関連アイテムを表示します
このコンポーネントは商品詳細ページやクロールを行ったページに設置することができます。
識別子にグループ名が含まれます。
表示にはグループ名に対応したレコメンドリソースが必要です。
グループ識別子を指定しない場合、レコメンドリソースの先頭の定義が使用されます。
存在しないグループ名を指定した場合、警告が表示されます

See the Pen this by BST developer (@bsearchtech)on CodePen.

設定方法¶

必須設定¶

Htmlの修正

<div data-popwiz="popwiz-group1"></div>

リソースファイルの作成

レコメンド (popwiz) リソースファイル¶

レコメンド (popwiz) リソースファイルは、表示するレコメンドの解析手法や表示件数を定義し、レコメンド (popwiz) コンポーネントを用いて表示するためのファイルです。

前提

レコメンド機能オプション の契約が必要です。
レコメンド機能オプションは 2024 年 12 月で新規受付を終了しました。

レコメンド機能を使用しない場合、このファイルを作成、読み込みする必要はありません。

レコメンド設定タグを記述します。

// レコメンド設定タグ
var popfindConf = popfindConf || {};
popfindConf["data-popwiz"] = {
  uid: "[UID]",
  mode: "[モード]",
  popwizResource: [
    {
      group: { label: "レコメンド", name:"group1" },
      layoutOrder: ["thumbnail", "title"],
      type: "type1",
      count: 3,
      popwiz_id: "[対象とするコンテンツ URL]",
    }
  ]
};

設定パラメータ一覧¶

パラメータ名	データ型	デフォルト値	説明
asyncUpdate	真偽値	false	非同期モードを使うかどうか非同期モードでは状態変更時に画面の再読み込みが発生しません。すべての設定タグに同じ設定を行ってください。

popwizResource のエントリ一覧¶

親要素	子要素	型	デフォルト値	説明
group		ハッシュ		グループの単位
	label	文字列	おすすめ商品	表示されるレコメンドのラベル
	name	文字列		レコメンドコンポーネントを識別子付きで呼び出す際のコンポーネント識別子の一部
popwiz_id		文字列	必須	対象とするコンテンツ URL を指定する。空の場合、動作しない。
type		文字列	'type1'	表示のバリエーション type1: 縦型表示（縦にレコメンドアイテムが並ぶ） type2: 横型表示（横にレコメンドアイテムが並ぶ）
layoutOrder		配列	['image', 'title']	表示するレイアウト。指定可能なレイアウトは「layoutOrder で指定可能なレイアウト一覧」
count		数値	5	最大表示数

重要

popwiz_id に値を設定するには JavaScript などのプログラムを利用する必要があります。

以前の指定方法

モードが sitesearch の場合、以下の記述となります。

var sitesearchPopwiz = [
  {
      group:{label: "おすすめ商品", name: "group1"},
      popwiz_id: "[対象とするコンテンツ URL]",
      layoutOrder: ["image", "title"],
      type: "type1",
  }
];

任意設定¶

表示用メッセージの変更

sitesearchMessage という変数に次のような指定を行うことで、表示文字列を変更することができます。

var sitesearchMessage = {
    popwiz: {
        label: '関連ページ',
    },    
};

キー名	デフォルト値	説明
label	関連ページ	レコメンドコンポーネントのラベル

DOM 構造¶

Dom