> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/experience-cloud/experience-cloud-ja/experience-components/ax-bar-code.md).

# AX - バーコード

## 概要

**AX - バーコード** Salesforce のフィールド値に基づいて、Experience Site のページ上に読み取り可能なコード（QR コード、標準バーコード、その他の形式を含む）を生成する Experience Cloud コンポーネントです。

製品番号、注文 ID、追跡情報、イベント チケット、またはポータル ユーザーがモバイル デバイスでスキャンする必要のあるあらゆるデータのコードを表示するために使用します。ポータルのブランドに合わせて、Experience Builder でバーコードの種類、サイズ、スタイルを設定できます。

注文バーコードを表示する顧客ポータル、チケットの QR コードを含むイベント登録ページ、製品追跡機能のあるパートナーポータル、またはユーザーがスキャン可能なアクセスコードを必要とするセルフサービスサイトに最適です。

***

## バーコードの設定

### バーコード値のカスタマイズ <a href="#customizing-the-barcode-value" id="customizing-the-barcode-value"></a>

バーコードの値は 2 通りの方法で設定できます。まず、バーコードに必要な値を手動で入力できます。あるいは、既存のコレクションの 1 つから値を取得することもできます。コレクションの値を使用するには、'[マップ済み](https://docs.avonniflowcomponents.com/getting-started/learn-the-basics#what-are-mapped-values)'入力オプションを選択し、適切なコレクションをソースとして選択します。

![](https://docs.avonniflowcomponents.com/~gitbook/image?url=https:%2F%2F27923732-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252F1FUd4apB9YHgCEMUFbVb%252Fuploads%252FNtPc8kKJjE5Zjgb2vPDb%252F2022-11-29_10-58-14.png%3Falt=media%26token=1882446b-d6c9-432f-a648-61dbfd839c45\&width=768\&dpr=4\&quality=100\&sign=69e627c744a074a265f6977004fae447ff1c0cb987dbdaa6a062336d44834319)マップ済み入力フィールドに切り替えて、値のソースとしてコレクションを選択します。

### バーコードの種類の選択 <a href="#choosing-the-barcode-type" id="choosing-the-barcode-type"></a>

Barcode コンポーネントは 150 種類を超えるバーコードをレンダリングします。必要なものを選択してください。

<details>

<summary>サポートされている主なバーコードの種類</summary>

* *
  *
* *
  *
* *
  *
* *
  *
* *
  *
* *
  *
* *
  *
* *
  *
* *
  *
* *
  *
* *
  *
* *
  *
* *
  *
* *
  *

</details>

## 仕様

{% tabs %}
{% tab title="🎛️ プロパティ" %}

| 名前           | 説明                                            | 使用方法                                               |
| ------------ | --------------------------------------------- | -------------------------------------------------- |
| **タイプ**      | 生成するバーコードの種類を選択します。                           | ユースケースまたは業界標準に基づいて、適切なバーコード記号体系を選択してください。          |
| **値**        | バーコードにエンコードするデータ。                             | バーコード形式に変換する必要がある値を入力します。                          |
| **チェックサム**   | チェックサム桁の計算を有効または無効にする真偽値オプションです。              | オンにすると、バーコードにチェックサム桁を含め、データ整合性をさらに高めます。            |
| **幅**        | バーコードの幅を定義します。                                | Web ページのデザイン上の考慮事項や、印刷媒体の物理的制約に応じて幅を調整します。         |
| **高さ**       | バーコードの高さを定義します。                               | 割り当てられたスペースにバーコードが収まりやすく、簡単にスキャンできるように高さを調整します。    |
| **値を非表示**    | バーコードの下に表示されるエンコード済みの値を表示または非表示にする真偽値オプションです。 | オンにすると、バーコードが表す数値または英数字の値を非表示にして、よりすっきりした見た目にできます。 |
| {% endtab %} |                                               |                                                    |

{% tab title="🎨 外観" %}

| 名前            | 説明                          | 使用方法                                            |
| ------------- | --------------------------- | ----------------------------------------------- |
| **背景色**       | バーコードコンポーネントの背景色を設定します。     | バーコードの線や数字とのコントラストが十分で、読みやすくスキャンしやすい色を選択してください。 |
| **色**         | バーコードの線とテキストの色を設定します。       | 背景に対して目立ち、視認性を最適化する色を選択してください。                  |
| **テキストの配置**   | バーコードの下に表示されるテキストの配置を定義します。 | Web ページや印刷物全体のデザインとレイアウトに調和するよう、テキストの配置を調整します。  |
| **文字色**       | バーコードの下に表示されるテキストの色を設定します。  | 背景色に対して見やすく、エンコードされた値が視覚的に確認しやすい色を選択してください。     |
| {% endtab %}  |                             |                                                 |
| {% endtabs %} |                             |                                                 |


---

# 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:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-ja/experience-components/ax-bar-code.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
