> ## Documentation Index
> Fetch the complete documentation index at: https://docs.xanhcard.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Tạo thẻ tích điểm

> Hướng dẫn từng bước tạo thẻ tích điểm với XanhCard: tạo mẫu thẻ Store/Loyalty, thêm trường điểm tích lũy, cấu hình máy quét ghi điểm và phân phối thẻ cho khách hàng.

## Tổng quan

Thẻ tích điểm cho phép khách hàng tích lũy điểm mỗi lần quét tại cửa hàng.
Luồng hoàn chỉnh gồm 5 bước: tạo mẫu thẻ kiểu **Thẻ tích điểm**, thêm trường điểm, thiết kế thẻ, cấu hình máy quét ghi điểm và phân phối thẻ.

## 1. Tạo mẫu thẻ kiểu Thẻ tích điểm

Đăng nhập vào dashboard theo đường dẫn: [https://app.xanhcard.com/dashboard](https://app.xanhcard.com/dashboard)

<Steps>
  <Step title="Vào Mẫu thẻ">
    Chọn **Mẫu** từ thanh điều hướng bên trái, sau đó nhấn **Tạo mới**.
  </Step>

  <Step title="Chọn kiểu Thẻ tích điểm">
    <Columns cols={2}>
      <Column>
        <p style={{ marginTop: "5em" }}>
          Trong mục **Kiểu**, chọn **Thẻ tích điểm** — kiểu thẻ dành cho chương trình tích điểm và khách hàng thân thiết.
        </p>
      </Column>

      <Column>
        <img src="https://mintcdn.com/xanhcard/QP4Dz1ypi_W5shpm/images/guides/select-loyalty-template.png?fit=max&auto=format&n=QP4Dz1ypi_W5shpm&q=85&s=e926f102f697a080d2219278842a2ef2" alt="Template Thẻ thành viên" width="1370" height="1732" data-path="images/guides/select-loyalty-template.png" />
      </Column>
    </Columns>
  </Step>

  <Step title="Đặt tên mẫu thẻ">
    Nhập **Tên mẫu** và mô tả, sau đó nhấn **Tạo**.
  </Step>
</Steps>

Xem chi tiết tại [Tổng quan về mẫu thẻ](/templates/overview).

## 2. Thêm trường điểm tích lũy

Tạo trường dữ liệu để lưu trữ điểm tích luỹ mỗi khi quét thẻ thành viên.
<Note>Trong trường hợp project của bạn đã có sẵn trường dữ liệu để lưu lại điểm khi quét thẻ của khách thì bỏ qua bước này.</Note>

<Steps>
  <Step title="Mở Data Model">
    <Columns cols={2}>
      <Column>
        <p style={{ marginTop: "5em" }}>
          Nhấn **Mô hình dữ liệu** ở phía dưới thanh điều hướng bên trái.
        </p>
      </Column>

      <Column>
        <img src="https://mintcdn.com/xanhcard/QP4Dz1ypi_W5shpm/images/guides/chon-mo-hinh-du-lieu.png?fit=max&auto=format&n=QP4Dz1ypi_W5shpm&q=85&s=df365b7db0b782857dfe76213da7b19a" alt="Mô hình dữ liệu" width="604" height="392" data-path="images/guides/chon-mo-hinh-du-lieu.png" />
      </Column>
    </Columns>
  </Step>

  <Step title="Thêm trường mới">
    <Columns cols={2}>
      <Column>
        <p style={{ marginTop: "5em" }}>
          Nhấn **Thêm trường mới** và tạo trường `points` với kiểu **Số nguyên**.
        </p>
      </Column>

      <Column>
        <img src="https://mintcdn.com/xanhcard/QP4Dz1ypi_W5shpm/images/guides/tao-truong-points.png?fit=max&auto=format&n=QP4Dz1ypi_W5shpm&q=85&s=29c4f1653a1845193dc90f4d96071bec" alt="Trường dữ liệu tích điểm" width="1808" height="1750" data-path="images/guides/tao-truong-points.png" />
      </Column>
    </Columns>
  </Step>

  <Step title="Lưu">
    Nhấn **Lưu**.
  </Step>
</Steps>

Xem chi tiết tại [Mô hình dữ liệu](/project/data-model).

## 3. Thiết kế thẻ

Cấu hình giao diện thẻ và hiển thị trường `points` trên thẻ.

<Steps>
  <Step title="Thêm trường hiển thị QRCODE vào mẫu thẻ">
    <Columns cols={2}>
      <Column>
        <p style={{ marginTop: "3em" }}>
          Việc này giúp máy quét xác định được thẻ thành viên của khách hàng nào, sau đó sẽ thực hiện các hành động được gán với máy quét.

          Copy chuỗi này `{{QRCODE}}` và dán vào phần **Tin nhắn**, mục cài đặt của **Mã vạch**
        </p>
      </Column>

      <Column>
        <Frame>
          <img src="https://mintcdn.com/xanhcard/inWZO5Wa7XbbB8Yo/images/guides/QRCODE-settings.png?fit=max&auto=format&n=inWZO5Wa7XbbB8Yo&q=85&s=ad28ccf46a0a25c3b4cdb1e63970126e" width="600" height="444" data-path="images/guides/QRCODE-settings.png" />
        </Frame>
      </Column>
    </Columns>
  </Step>

  <Step title="Thêm trường hiển thị số điểm đã tích được vào mẫu thẻ">
    Việc này giúp hiển thị điểm của khách hàng ngay trên thẻ.

    Copy chuỗi này `{{$data.points}}` và dán vào phần **Value** của bất kì vị trí nào bạn muốn hiển thị điểm hiện tại. Xem 2 ví dụ bên dưới:

    <Columns cols={2}>
      <Column>
        <Frame caption="Hiển thị trường `points` trên Google Wallet">
          <img src="https://mintcdn.com/xanhcard/inWZO5Wa7XbbB8Yo/images/guides/points-google-wallet.png?fit=max&auto=format&n=inWZO5Wa7XbbB8Yo&q=85&s=197c2242d5586cca25c716e31bb59d3d" width="1176" height="334" data-path="images/guides/points-google-wallet.png" />
        </Frame>
      </Column>

      <Column>
        <Frame caption="Hiển thị trường `points` trên Apple Wallet">
          <img src="https://mintcdn.com/xanhcard/inWZO5Wa7XbbB8Yo/images/guides/points-apple-wallet.png?fit=max&auto=format&n=inWZO5Wa7XbbB8Yo&q=85&s=9a30dc4e2ae4cb1b4f95666cf48e2994" width="1192" height="314" data-path="images/guides/points-apple-wallet.png" />
        </Frame>
      </Column>
    </Columns>
  </Step>
</Steps>

Tham khảo thêm thiết kế chi tiết cho từng loại thiết bị:

* [Thiết kế cho Apple Wallet](/templates/apple-wallet)
* [Thiết kế cho Google Wallet](/templates/google-wallet)

## 4. Cấu hình máy quét ghi điểm

Máy quét là một phần mềm chạy trên trình duyệt, nó hỗ trợ bạn hoặc nhân viên của bạn thực hiện những thao tác với thẻ của khách hàng như: tích điểm đổi quà, check-in, ...

<Steps>
  <Step title="Tạo máy quét">
    Tạo máy quét mới theo [Tổng quan về máy quét](/scanners/overview).
  </Step>

  <Step title="Thêm hành động Increment">
    <Columns cols={2}>
      <Column>
        <p style={{ marginTop: "5em" }}>
          Trong mục **Actions**, thêm hành động **Increment** và chọn trường `points` ở **Field Name**.
        </p>
      </Column>

      <Column>
        <img src="https://mintcdn.com/xanhcard/QP4Dz1ypi_W5shpm/images/guides/scanner-action-increment.png?fit=max&auto=format&n=QP4Dz1ypi_W5shpm&q=85&s=462fcd12232a76a654209c27b41b8896" alt="Hành động Increment" width="1810" height="1818" data-path="images/guides/scanner-action-increment.png" />
      </Column>
    </Columns>
  </Step>

  <Step title="Lưu máy quét">
    Lưu cấu hình. Mỗi lần quét thẻ, điểm của khách hàng sẽ tăng theo giá trị bạn đặt ở **Value**.
  </Step>
</Steps>

* Xem chi tiết tại [Hành động quét](/scanners/actions).
* Hướng dẫn sử dụng máy quét [Xem chi tiết](/guides/scanner-usage)

<Tip>
  Kết hợp thêm hành động **Notify** trong máy quét để gửi thông báo cho khách hàng mỗi lần tích điểm.
</Tip>

## 5. Phân phối thẻ

* Nhập danh sách khách hàng từ CSV: [Nhập thẻ từ CSV](/distribution/import-csv)
* Thu thập thông tin khách hàng qua biểu mẫu và phát hành thẻ cho người dùng: [Tạo form download pass](/guides/download-form)