# Shortcode untuk payment form HTML

> Shortcode yang memaparkan harga, stok dan butiran semasa payment form dalam payment form Custom HTML.
>
> Source: https://docs.bcl.my/ms/html-form-shortcodes/

Shortcode membolehkan HTML anda sendiri memaparkan butiran semasa dari payment form, seperti harga sesuatu item atau berapa unit yang masih ada dalam stok. BCL menggantikan setiap shortcode dengan nilai semasa setiap kali page dimuatkan, jadi anda tidak perlu edit HTML apabila harga atau stok berubah.

Shortcode berfungsi dalam payment form yang **Type of Form** ditetapkan kepada **Custom HTML**, dan dalam payment form **Donation** yang **Content Type** ditetapkan kepada **Custom HTML**.

## Tambah shortcode pada payment form anda

Taip shortcode dalam HTML editor payment form itu:

1. Pergi ke **Payments** → **Forms** dan klik **Edit** pada payment form anda.
2. Klik **Open HTML Editor**. BCL menyimpan payment form itu dahulu, kemudian membuka editor.

   *(Screenshot: Page Edit Payment Form dengan butang Open HTML Editor ditanda)*

3. Taip shortcode di tempat anda mahu nilai itu dipaparkan, kemudian klik **Save HTML**. Klik **Preview** untuk melihat reka bentuk anda; shortcode hanya diisi pada payment form yang live.

   *(Screenshot: HTML editor dengan shortcode dalam kod dan butang Save HTML ditanda)*

4. Klik **Back**, kemudian **View Form** untuk melihat nilai semasa.

   *(Screenshot: Payment form Custom HTML yang live memaparkan nama item, harga dan badge status daripada shortcode)*

## Cari ID item

Shortcode item memerlukan ID item itu, dan payment form mesti menggunakan **Multiple Items**. Untuk mencari ID:

1. Buka payment form itu dan scroll ke **List of Items**, di bawah tab.
2. Klik **More** pada item itu.

   *(Screenshot: List of Items dengan butang More pada item pertama ditanda)*

3. Baca nombor selepas `#` pada tajuk panel, contohnya **House Blend 250g Settings (#87)**.

   *(Screenshot: Tajuk panel item yang memaparkan ID item 87)*

## Senarai shortcode

Gantikan `123` dengan ID item anda. Setiap shortcode item menerima sama ada `product=` atau `id=`.

| Shortcode | Paparan | Contoh output |
| --- | --- | --- |
| `[stock product=123]` | Tahap stok | "25 available", "Out of Stock", atau "In Stock" jika stok tidak dijejak |
| `[price product=123]` | Harga item | "RM 28.00" |
| `[product_name id=123]` | Nama item | "House Blend 250g" |
| `[status product=123]` | Badge status | "Available", "Coming Soon" atau "Out of Stock" |
| `[form_title]` | Tajuk payment form | "Kopi Kampung Coffee Beans" |
| `[form_slug]` | Slug URL payment form | "kopi-kampung-coffee-beans" |
| `[total_products]` | Bilangan item dalam payment form | "12" |
| `[available_products]` | Item yang boleh dibeli sekarang (bukan akan datang, belum habis dijual) | "8" |

## Gayakan badge status

`[status]` mengeluarkan `<span>` dengan class `badge` serta `badge-success` (Available), `badge-warning` (Coming Soon) atau `badge-danger` (Out of Stock). Tambah CSS untuk class ini dalam HTML anda untuk mewarnakan badge itu.

## Isu biasa

### Kenapa shortcode saya dipaparkan sebagai teks biasa pada payment form?

Semak ejaan dan tanda kurungnya, contohnya [price product=123]. Shortcode yang tidak dikenali dibiarkan seperti asal. Shortcode yang dikenali tetapi dengan ID item yang salah tidak memaparkan apa-apa. Shortcode hanya berfungsi dalam HTML payment form Custom HTML.

### Kenapa shortcode price memaparkan harga lama, bukan harga sale saya?

[price] memaparkan Amount (RM) item itu. Ia tidak memaparkan Sale Price (Optional) yang ditetapkan di bawah More.