> For the complete documentation index, see [llms.txt](https://docs.opusbooster.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.opusbooster.com/platform/widgets/store-widget.md).

# ストアウィジェット

ストアウィジェットは、どのページにも、あるいはブログの記事内にも、ショップの商品を表示するための素晴らしいウィジェットです。

ストアウィジェットを追加するには、ウィジェット一覧からページ内の任意の位置にドロップするだけです：

<figure><img src="/files/DJCsJSezkIzLpSNJ9qSt" alt=""><figcaption></figcaption></figure>

まず最初に、表示したい商品を追加します。下図のように、「商品の編集」タブを選択します。すると、新しいウィンドウが開き、商品を追加することができます。

* 最新商品
* 選択したカテゴリの全商品
* 選択した商品
* 表示する商品の数

### 商品レイアウト

この設定のオプションの多くは、より視覚的な設定です。それでは、重要な設定をより詳しく見ていきましょう。

* ストアのプロセス

ストアプロセスタブでは、 「カートに追加」「今すぐ購入」の2つの選択肢があります。

**カートに追加**： ショッピングカートに複数のアイテムを追加したい場合、このオプションが便利です。カートに入れるをクリックすると、そのアイテムは自動的にカートに保存され、次のアクションを待つことができます。

**今すぐ購入**： 今すぐ購入ボタンを選択することで、訪問者が今すぐ購入ボタンをクリックすると、自動的に決済用の「チェックアウト」ページが表示され、購入の準備ができます。

### 商品フィードの外観

商品フィードの外観は、ストア商品ウィジェットのスタイルとデザインを選択することによって、ユーザーが選択することができます。それでは、詳しく見ていきましょう

<figure><img src="/files/38FKDbfYDmYq7TIvIp2r" alt=""><figcaption></figcaption></figure>

商品をページ上に表示する際のレイアウトは、上の画像のように3種類あります。また、コンテンツの配置は、テキストを左揃え、中央揃え、または右揃えに設定します。

割引商品バッジのタイプ： 特定の製品に割引が割り当てられている場合、アイテム自体に直接視覚的に表示することができます。4つのオプションから選ぶことができます。

* なし：情報を表示しません。
* セール品： セール品である場合に表示されます
* 割引額： アイテムが値段で割引されている場合
* 割引率：アイテムが一定の値（%）で割引されている場合


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.opusbooster.com/platform/widgets/store-widget.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
