Dokumentasi Lengkap Tag FsCode Digital Marketplace: Kustomisasi Template, Parameter & Variabel

T Tim Redaksi
• • 5 menit baca • 9 kali dibaca
Dokumentasi Lengkap Tag FsCode Digital Marketplace: Kustomisasi Template, Parameter & Variabel
Platform Wap.ai.id menyediakan modul Digital Marketplace bawaan yang memungkinkan setiap pemilik website langsung berjualan aneka produk digital (source code, lisensi software, akun game, ebook, preset, file unduhan, maupun voucher) secara instan dengan gateway pembayaran QRIS otomatis.

Semua fitur marketplace ini dapat Anda panggil dan kustomisasi sesuka hati pada menu Coding di dashboard website Anda menggunakan FsCode Tag Engine.

Berikut dokumentasi paling komprehensif seluruh tag digital marketplace, parameter kustomisasi, variabel template, hingga contoh skrip kodingnya:

1. Tag Katalog Produk: [market]...[/market]


Tag ini digunakan untuk merender daftar produk digital toko Anda ke halaman web.

Format Dasar:
[market][/market]


Daftar Parameter yang Didukung:

  • l=ANGKA atau limit=ANGKA : Membatasi jumlah produk yang ditampilkan (default: 8, maksimal: 50). Contoh: [market]l=12[/market].

  • cat=NAMA_KATEGORI : Memfilter produk khusus dari kategori tertentu. Contoh: [market]cat=Source Code[/market].

  • type=TIPE : Memfilter berdasarkan tipe pengiriman produk (misal: file, license, account, manual).

  • o=URUTAN : Menentukan urutan produk:

    • o=cheap : Urutkan dari harga paling murah.

    • o=expensive : Urutkan dari harga paling mahal.

    • o=sales : Urutkan produk paling laris (jumlah terjual tertinggi).

    • o=stock : Urutkan dari sisa stok terbanyak.

    • o=u : Urutkan dari produk terbaru diunggah (default).



  • no=PESAN_KOSONG : Mengatur tampilan kustom jika toko belum memiliki produk.



Variabel Kustomisasi Template Sendiri (Custom Card Template):

Jika Anda ingin mendesain tampilan kartu produk sendiri (bukan layout bawaan sistem), Anda bisa menyisipkan format HTML di antara tag [market]...[/market] menggunakan variabel-variabel berikut:

  • %id% : ID unik produk.

  • %name% : Nama judul produk.

  • %slug% : Slug URL produk.

  • %price% : Harga akhir produk dalam format Rupiah (contoh: Rp 25.000).

  • %normal_price% : Harga normal sebelum diskon flash sale.

  • %raw_price% : Nominal angka harga murni tanpa format (contoh: 25000).

  • %discount_pct% : Angka persentase diskon (contoh: 20 untuk diskon 20%).

  • %stock% : Sisa stok produk.

  • %sold% : Total jumlah produk yang sudah terjual.

  • %category% : Nama kategori produk.

  • %type% : Tipe produk.

  • %thumb% : URL foto cover/gambar produk.

  • %desc% : Ringkasan deskripsi produk.

  • %variant_count% : Jumlah varian yang dimiliki produk.

  • %variants% : Label varian produk (misal: 3 Varian atau Standar).

  • %buy_url% atau %url% : Tautan URL menuju halaman pembelian produk (page-item.xhtml?pid=ID).

  • %is_flashsale% : Bernilai 1 jika sedang flash sale, atau 0 jika harga normal.



Contoh Template Kustom:
[market]l=6,o=sales||
<div class="kotak-produk">
<img src="%thumb%" alt="%name%">
<h4>%name%</h4>
<div class="harga">%price%</div>
<div class="stok">Stok: %stock% | Terjual: %sold%</div>
<a href="%buy_url%" class="btn-beli">Beli Sekarang</a>
</div>
[/market]





2. Tag Promo Kilat: [flashsale]...[/flashsale]


Tag khusus untuk menyajikan produk-produk yang sedang dalam periode promo kilat berbatas waktu (Flash Sale).

  • [flashsale][/flashsale] : Menampilkan kartu promo kilat dengan badge persentase diskon dan harga normal yang dicoret.

  • [flashsale]l=4[/flashsale] : Menampilkan 4 produk promo kilat teratas untuk banner halaman beranda.

  • Mendukung seluruh parameter dan variabel template kustom yang sama persis seperti tag [market].






3. Tag Halaman Detail Produk: [market_item]


Tag ini dipasang pada halaman view detail produk (biasanya diatur pada page-item.xhtml atau halaman ID 4).

  • [market_item][/market_item] : Secara cerdas membaca ID produk dari parameter URL (misalnya page-item.xhtml?pid=7), lalu otomatis merender galeri gambar, deskripsi, seleksi varian harga fleksibel, status stok, tombol Beli Langsung, dan tombol Tambah ke Keranjang.

  • [market_item]id=5[/market_item] : Menampilkan satu produk spesifik secara permanen (misal produk ID 5) pada halaman promosi khusus (landing page).






4. Tag Judul Dinamis Halaman: [market_title] & :product_title:


Untuk menjaga kualitas SEO dan kerapian judul di tab browser ponsel:

  • [market_title][/market_title] atau :product_title: : Otomatis mendeteksi nama produk yang sedang dibuka pada halaman detail dan menjadikannya judul halaman di tab browser.






5. Tag Keranjang Belanja & Form Checkout: [market_cart]


Dipasang pada halaman keranjang belanja (biasanya diatur pada page-cart.xhtml atau halaman ID 3).

  • [market_cart][/market_cart] : Merender tabel item keranjang, pengubah kuantitas item interaktif, subtotal harga realtime, form input data pembeli (Nama, WhatsApp, Email), dan tombol bayar QRIS dinamis otomatis.






6. Tag Riwayat Transaksi Pelanggan: [pesanan_saya] / [market_orders]


Dipasang pada halaman akun pelanggan (biasanya diatur pada page-pesanan.xhtml atau halaman ID 5).

  • [pesanan_saya][/pesanan_saya] atau [market_orders][/market_orders] : Menampilkan daftar transaksi milik pembeli yang sedang masuk. Pelanggan dapat memantau invoice, status verifikasi pembayaran, serta langsung mengunduh link berkas atau menyalin serial number lisensi yang dibeli.

  • Jika pembeli belum login, sistem otomatis menampilkan form lacak pesanan cepat berdasarkan Nomor Referensi Transaksi (No. Invoice).






Panduan Struktur Halaman Toko Digital yang Ideal:


Untuk mengaktifkan seluruh fitur di atas secara otomatis di website Anda:

  1. Halaman 0 (Beranda) : Pasang [flashsale]l=4[/flashsale] diikuti [market]l=8[/market].

  2. Halaman 2 (Katalog Lengkap) : Pasang [market]l=24,o=sales[/market].

  3. Halaman 3 (Keranjang Belanja) : Pasang [market_cart][/market_cart].

  4. Halaman 4 (Detail Produk) : Pasang [market_title][/market_title] dan [market_item][/market_item].

  5. Halaman 5 (Pesanan Pelanggan) : Pasang [pesanan_saya][/pesanan_saya].



Dengan memanfaatkan dokumentasi tag FsCode Digital Marketplace ini, Anda memiliki kebebasan penuh merancang tampilan toko online mandiri yang elegan, cepat, dan otomatis di platform Wap.ai.id!
Tanggapan & Diskusi 0 komentar
Belum ada komentar pada artikel ini. Masuk dengan akun Wap.ai.id untuk memulai diskusi.
Ingin ikut berdiskusi?

Komentar pada artikel ini terhubung dengan akun platform utama Wap.ai.id.