画像付きサジェスト機能（旧ポップリンク）の表示レイアウトを変更する

画像付きサジェスト機能の表示をカスタマイズ

今回は、「GENIEE SEARCH for EC」の画像付き検索サジェスト機能のカスタマイズについてご紹介します。
画像付きサジェスト機能は、Webページに埋め込むパラメータの設定によって、様々なカスタマイズができます。

【2025年最新】サイト内検索ツールおすすめ9選を徹底比較！成功事例から学ぶ選び方

サイト内検索とは？3つのやり方・導入方法から活用事例までを解説

GENIEE SEARCHについてのお問い合わせ・資料請求はこちら

画像付きサジェスト機能の基本構造

下記は、もっとも基本的な画像付きサジェスト機能のscriptタグです。ご利用開始時にお知らせしているものとほぼ同じものです。

  <script>
    var poplink3 = {
      uid: "f7ca52f2c20a75622a642cb4a5386917m",
      target: "#keyword",
      deviceType: "pc022"
    };
    (function() {
      // 中略
    })();
  </script>

この var poplink3 = { … } の部分を、画像付きサジェスト機能では「タグパラメータ」と呼びます。
このパラメータを書き換えたり、追加することとで、画像付きサジェスト機能の動作を変えることができます。

候補語と商品情報の表示位置を変更

デバイスタイプを変更してみる

デバイスタイプとは、表示される画像付きサジェスト機能のレイアウトの種類のことです。デスクトップ用、モバイル用に複数種類のデバイスタイプを提供しています。（各デバイスタイプについて詳しくは、ご契約時にご案内しているサービス仕様書のテクニカルリファレンスをご覧ください。）

上記の例では、デバイスタイプ”pc022″が指定されていますが、このデバイスタイプはデスクトップ用のもので、左側に候補語のリスト、右側に商品情報が表示されます。

これを、縦方向に表示する”pc011″に変更してみます。
タグパラメータを次のように変更してみましょう。

    var poplink3 = {
      uid: "f7ca52f2c20a75622a642cb4a5386917m",
      target: "#keyword",
      deviceType: "pc011"
    };

画像付きサジェスト機能を埋め込んだWebページを、ブラウザで表示してみてください。候補語リストと商品情報が縦方向に並んで表示されるようになるはずです。
※すでに表示済みであれば、リロードしてください。
※表示が変わらない場合はブラウザのキャッシュをクリアしてください。

このほかにも、画像付きサジェスト機能ではWebサイトのイメージや画面構成に応じた表示のカスタマイズが可能です。ぜひ、自社サイトに合ったカスタマイズを試してみてください。
（カスタマイズについて詳しくは、ご契約時にご案内しているサービス仕様書のテクニカルリファレンスをご覧ください。）

今回は、画像付きサジェスト機能のカスタマイズの基本についてご紹介しました。

【2025年最新】サイト内検索ツールおすすめ9選を徹底比較！成功事例から学ぶ選び方

サイト内検索とは？3つのやり方・導入方法から活用事例までを解説

GENIEE SEARCHについてのお問い合わせ・資料請求はこちら

「導線改善ツール」を導入して
ユーザビリティの改善を実現した事例集

---

資料ダウンロード

会社名*

姓*

名*

メールアドレス*

電話番号*

資料のご利用目的*

自社利用他社利用

検討中のサイト種別*

企業サイトECサイトその他

導入検討のご状況

会社的に導入検討個人的には検討したい情報収集

個人情報の取扱いに同意する

GENIEE SEARCH編集部
（X：@BST_hoshiko）

ECサイトや企業サイトにおける快適なユーザ体験を実現するための導線改善方法から、ECマーケティングの手法まで幅広く情報を発信しています。

監修者：森本 葉月

企業サイトやECサイトにおけるブランディング向上やUX改善につながる情報を発信。主にセミナー・SNS・メルマガ・プレスリリース等の企画運営を担当。