Mula Guna Sistem
Dokumentasi Sistem

Nota Penggunaan
Sistem Homestay

Panduan lengkap untuk owner homestay mengurus sistem tempahan, bayaran, WhatsApp automatik, dan dashboard admin.

Mula Guna Sistem

Sistem ini sudah sedia digunakan. Anda hanya perlu lengkapkan tetapan dalam admin panel. Tiada setup hosting atau Firebase diperlukan.

Masa setup anggaran 10–30 minit sahaja. Sistem terus boleh digunakan selepas maklumat diisi.
1

Buka Laman Homestay

Akses laman homestay anda melalui URL yang diberikan. Laman ini adalah laman utama yang dilihat oleh pelanggan.

2

Masuk Admin Panel

Klik ikon 🔒 di bahagian kanan atas atau tatal ke bawah laman. Masukkan kata laluan admin anda.

Kata laluan default: ayong2024
3

Lengkapkan Maklumat

Isi maklumat homestay, harga, mod bayaran, dan token Fonnte dalam tab yang berkaitan.

4

Mula Terima Tempahan

Sistem sudah sedia. Kongsikan pautan laman kepada pelanggan — mereka boleh terus membuat tempahan.

Tiada langkah tambahan diperlukan

Tetapan Akaun Penting

Dua perkhidmatan luar perlu disediakan sebelum sistem berfungsi sepenuhnya — Fonnte untuk WhatsApp automatik, dan ToyyibPay untuk terima bayaran online.

Penting: Fonnte adalah perkhidmatan unofficial WhatsApp API — ia menggunakan WhatsApp Web untuk automation. Gunakan nombor berasingan, bukan nombor peribadi atau nombor utama perniagaan anda.
1

Pergi ke fonnte.com/register

Buka laman web fonnte.com dan klik Register / Daftar.

2

Isi Maklumat Pendaftaran

Masukkan nama, alamat email, dan kata laluan untuk akaun Fonnte anda.

3

Verify Email

Semak inbox email dan klik pautan pengesahan yang dihantar oleh Fonnte. Semak folder Spam jika tidak jumpa.

Akaun Fonnte ada pelan percuma tanpa had masa — sesuai untuk ujian dan penggunaan homestay biasa.
1

Login ke Dashboard Fonnte

Pergi ke fonnte.com dan log masuk menggunakan email dan kata laluan yang didaftarkan.

2

Klik Menu "Device"

Di dashboard Fonnte, cari dan klik menu Device di sebelah kiri.

3

Klik "Add Device"

Klik butang Add Device atau Tambah Device baharu.

4

Namakan Device

Masukkan nama device (contoh: Homestay Raisya) dan simpan.

1

QR Code Akan Dipapar

Selepas buat device, QR Code akan dipaparkan dalam dashboard Fonnte.

2

Buka WhatsApp di Telefon

Buka aplikasi WhatsApp → Tetapan (⚙️) → Peranti Tertaut → Tautkan Peranti.

3

Imbas QR Code

Hala kamera telefon ke QR Code dalam dashboard Fonnte. Tunggu beberapa saat untuk sambungan selesai.

4

Status "Connected" ✅

Apabila status device bertukar kepada Connected (hijau), WhatsApp sudah berjaya disambungkan.

Telefon perlu sentiasa ada bateri dan sambungan internet agar Fonnte dapat menghantar mesej. Jika telefon mati atau tiada internet, mesej tidak akan dihantar.
1

Pergi Menu Device

Dalam dashboard Fonnte, klik menu Device.

2

Cari Token dalam Senarai Device

Token dipaparkan dalam senarai device anda. Ia kelihatan seperti kod panjang.

3

Klik Token untuk Salin

Klik pada token dan ia akan disalin ke clipboard secara automatik.

Token mesti disimpan dengan selamat. Sesiapa yang ada token boleh hantar mesej atas nama nombor WA anda.
Token kelihatan seperti: eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...
1

Buka Admin Panel Homestay

Klik ikon 🔒 di laman homestay dan log masuk.

2

Pergi Tab Maklumat

Dalam admin panel, klik tab Maklumat.

3

Tampal Token Fonnte

Cari medan Token Fonnte, tampal token yang disalin tadi. Klik ikon mata 👁 untuk semak token jika perlu.

4

Klik Simpan

Klik Simpan Semua Maklumat. Sistem akan terus guna token ini untuk semua mesej WA automatik.

Selepas token disimpan, ujikan dengan membuat tempahan demo — anda sepatutnya menerima mesej WhatsApp automatik.

MAKLUMAT PENTING FONNTE

PerkaraMaklumat
Jenis APIUnofficial — menggunakan WhatsApp Web (bukan Meta official API)
KosAda pelan percuma; pelan berbayar untuk penggunaan lebih tinggi
Nombor disyorkanGunakan nombor berasingan/nombor kedua, bukan nombor utama
Keperluan telefonTelefon perlu sentiasa aktif dan ada internet
Kod negara Malaysia60 — sudah ditetapkan dalam sistem
RisikoKecil risiko nombor diblok jika hantar mesej terlalu banyak/spam
Laman webfonnte.com
Dokumentasidocs.fonnte.com

Setup ToyyibPay

ToyyibPay adalah payment gateway Malaysia yang Shariah-compliant. Sistem menggunakannya untuk menerima bayaran FPX dari pelanggan secara automatik.

ToyyibPay memerlukan 2 kunci untuk integration: Secret Key dan Category Code. Kedua-duanya perlu dimasukkan dalam Admin Panel sistem ini.
1

Pergi ke toyyibpay.com

Buka laman web toyyibpay.com dan klik butang Daftar Sekarang atau Sign Up.

2

Isi Borang Pendaftaran

Masukkan username, email, dan maklumat perniagaan anda. Untuk pendaftaran individu, masukkan nombor Kad Pengenalan di ruangan Registration No (SSM).

3

Isi Maklumat Akaun Bank

Masukkan nama bank, nombor akaun, dan nama pemegang akaun. Gunakan akaun semasa/bisnes jika ada, untuk memudahkan urusan transaksi banyak.

4

Pilih Pakej

ToyyibPay ada 2 pakej: Standard (caj RM1 per transaksi FPX) dan Kad Kredit (caj 2%). Untuk homestay, pakej Standard sudah mencukupi.

5

Verify Email

Semak inbox email dan klik pautan pengesahan dari ToyyibPay. Selepas itu akaun anda aktif dan boleh digunakan.

Pendaftaran ToyyibPay adalah percuma. Caj RM1 hanya dikenakan apabila ada transaksi berjaya — tiada caj bulanan.
1

Login ke Dashboard ToyyibPay

Pergi ke toyyibpay.com dan log masuk.

2

Tatal ke Bawah — Bahagian Settings

Di dashboard utama, tatal ke bawah sehingga jumpa bahagian Settings.

3

Salin "Your Secret Key"

Anda akan lihat medan "Your Secret Key". Salin key tersebut dan simpan di tempat selamat.

Secret Key adalah seperti kata laluan — jangan kongsikan kepada orang lain.
Secret Key kelihatan seperti: w5x7srq7-rx5r-3t89-2ou2-k7361x2jewhn

Category adalah cara ToyyibPay mengasingkan bil mengikut tujuan. Sistem homestay memerlukan satu Category untuk bil tempahan.

1

Klik Menu "Category"

Di dashboard ToyyibPay, klik menu Category di sebelah kiri.

2

Klik "Add New Category"

Klik butang Add New Category (butang ungu/hijau).

3

Isi Nama & Penerangan

Masukkan nama category (contoh: Tempahan Homestay) dan penerangan ringkas. Klik Submit.

4

Salin Category Code

Selepas submit, anda akan nampak senarai category. Salin Category Code yang dipaparkan dalam kolum Category Code.

Category Code kelihatan seperti: Ajdiufd345f
1

Buka Admin Panel Homestay

Klik ikon 🔒 di laman homestay dan log masuk.

2

Pergi Tab Bayaran

Dalam admin panel, klik tab Bayaran.

3

Isi Secret Key & Category Code

Cari bahagian Toyyibpay dan masukkan kedua-dua nilai yang disalin tadi.

4

Klik Simpan

Klik Simpan Tetapan Bayaran. Sistem kini boleh menerima bayaran melalui ToyyibPay.

Uji dengan buat tempahan demo dan pilih Toyyibpay sebagai kaedah bayaran.

MAKLUMAT PENTING TOYYIBPAY

PerkaraMaklumat
Caj per transaksiRM1 untuk FPX / Online Banking (pakej Standard)
Caj kad kredit2% per transaksi (pakej Kad Kredit)
SettlementDuit masuk ke akaun bank anda keesokan hari (hari bekerja)
PendaftaranPercuma — tiada caj bulanan
Shariah-compliantYa — platform patuh syariah
Kunci diperlukanSecret Key + Category Code
Laman webtoyyibpay.com
API Referencetoyyibpay.com/apireference

Admin Panel

Admin panel mengandungi 8 tab untuk mengurus semua aspek sistem homestay anda.

📋
Tempahan
Lihat semua rekod tempahan, sahkan bayaran, hantar mesej WhatsApp
🚫
Blok Tarikh
Blok tarikh tertentu supaya tidak boleh ditempah pelanggan
💰
Harga
Tetapkan harga untuk weekday, weekend, cuti sekolah, dan perayaan
ℹ️
Maklumat
Nama homestay, no. telefon, alamat, check-in/out, kemudahan
💳
Bayaran
Tetapkan kaedah bayaran dan mod deposit
🖼️
Galeri
Tambah gambar homestay menggunakan pautan URL
📅
Tarikh
Tetapkan cuti sekolah dan cuti umum/perayaan
❓
FAQ
Urus soalan lazim yang dipapar di laman utama
Untuk tukar kata laluan admin, pergi ke Tab Maklumat → Kata Laluan Admin di bahagian bawah. Kata laluan disimpan selamat dalam Firestore.

Maklumat Homestay

Semua maklumat yang diisi di sini akan dipapar secara automatik di laman utama dan dalam mesej WhatsApp kepada pelanggan.

MedanPeneranganStatus
Nama HomestayNama yang dipapar di nav bar, footer, dan signature WAWajib
No. WhatsAppFormat: 60123456789 (tanpa +). Digunakan pada butang WA lamanWajib
E-melUntuk komunikasi rasmiPilihan
AlamatAlamat penuh homestayPilihan
Check-in / Check-outMasa masuk dan keluar (contoh: 3:00 petang)Wajib
Token FonnteToken API dari akaun Fonnte untuk hantar WA autoDiperlukan untuk WA
Google MapsLink share dari Google Maps untuk pautan lokasiPilihan
KemudahanSenarai kemudahan yang disediakan (WiFi, Aircond, dll)Pilihan

Cara Dapatkan Lokasi Google Maps

Sistem memerlukan 3 perkara untuk papar lokasi dengan betul — Longitud, Latitud, dan Link Share Google Maps.

1

Buka Google Maps

Pergi ke maps.google.com di browser atau buka aplikasi Google Maps di telefon.

2

Cari Lokasi Homestay

Taip nama atau alamat homestay anda dalam kotak carian dan tekan Enter.

3

Klik Kanan pada Lokasi (Desktop)

Klik kanan tepat pada pin/titik lokasi homestay anda. Satu menu pop-up akan muncul.

4

Salin Koordinat

Pada baris pertama menu pop-up, anda akan nampak 2 nombor seperti: 3.1390, 101.6869

Nombor pertama = Latitud
Nombor kedua = Longitud

Klik pada baris tersebut untuk salin ke clipboard.

Di telefon: tekan lama pada pin lokasi → koordinat akan dipapar di bawah skrin
5

Masukkan dalam Admin Panel

Admin Panel → Tab Maklumat → masukkan nilai Latitud dan Longitud dalam medan yang disediakan → Simpan.

Contoh koordinat KL Tower:
Latitud: 3.1528  |  Longitud: 101.7038
Cara lain: Lihat URL browser selepas pilih lokasi — ia mengandungi koordinat dalam format @latitud,longitud. Contoh: maps.google.com/.../@3.1390,101.6869,17z/...
1

Buka Google Maps & Cari Lokasi

Pergi ke maps.google.com, cari dan klik pada lokasi homestay anda supaya pin merah dipapar.

2

Klik Butang "Share" / Kongsi

Di Desktop: Klik ikon tiga garisan (☰) di sebelah kiri → pilih Kongsi atau benam peta.

Di Telefon: Tap pada nama lokasi di bahagian bawah → tap ikon Kongsi (→).

3

Pilih "Hantar Pautan"

Pastikan tab Hantar pautan dipilih (bukan "Benam peta"). Pautan pendek akan dipapar.

4

Salin Pautan

Klik Salin Pautan. Pautan akan kelihatan seperti: https://maps.app.goo.gl/xxxxxx

5

Masukkan dalam Admin Panel

Admin Panel → Tab Maklumat → medan Google Maps Share Link → tampal pautan → Simpan.

Pautan ini digunakan pada butang "Lihat di Google Maps" dalam laman homestay
Gunakan pautan dari Kongsi (share link), bukan salin terus dari address bar browser — pautan address bar mungkin tidak berfungsi di semua peranti.

Tetapan Harga

Sistem menggunakan 4 jenis harga berbeza mengikut hari dan musim. Harga dikira secara automatik berdasarkan tarikh yang dipilih pelanggan.

JenisHari/MusimKeutamaan
Festif/PerayaanTarikh dalam senarai Cuti UmumPaling tinggi
Cuti SekolahTarikh dalam julat Cuti SekolahKedua
WeekendJumaat, Sabtu, AhadKetiga
WeekdayIsnin hingga KhamisAsas
Jika tarikh jatuh pada cuti sekolah DAN perayaan, harga perayaan yang lebih tinggi akan digunakan.

Mod Bayaran

Terdapat 3 kaedah bayaran dan 3 pilihan mod deposit yang boleh dikonfigurasi.

KaedahCara KerjaMesej WA
ToyyibpayRedirect ke halaman bayaran Toyyibpay. Status auto dikemas kini.Dihantar semasa submit & selepas bayar
TNG eWalletPapar overlay QR code TNG. Pelanggan klik "Dah Bayar" selepas transfer.Dihantar selepas klik "Dah Bayar"
Bank TransferPapar overlay maklumat bank. Pelanggan klik "Dah Bayar" selepas transfer.Dihantar selepas klik "Dah Bayar"
%

Deposit 50%

Pelanggan bayar separuh daripada jumlah keseluruhan sebagai deposit. Baki dibayar semasa atau sebelum check-in.

RM

Deposit Nilai Tetap

Tetapkan amaun deposit tetap (contoh: RM100). Baki dikira sebagai jumlah tolak deposit tetap.

✓

Bayaran Penuh Sahaja

Pilihan deposit disembunyikan. Pelanggan mesti membayar jumlah penuh untuk mengesahkan tempahan.

Cuti Sekolah & Cuti Umum

Tetapkan tarikh cuti untuk sistem mengenakan harga yang betul secara automatik.

1

Klik Tab Tarikh

Pergi ke Admin Panel → Tab Tarikh.

2

Isi Julat Tarikh

Masukkan tarikh mula dan tarikh akhir cuti sekolah. Rujuk takwim rasmi Kementerian Pendidikan.

3

Klik Tambah

Julat ditambah dan dipapar dalam senarai. Boleh padam bila diperlukan.

Bahagian ini memerlukan rujukan luar untuk tarikh yang tepat. Sila semak takwim rasmi KPM sebelum isi.
1

Masukkan Tarikh

Pilih tarikh cuti umum (contoh: 31 Mac — Hari Raya).

2

Nama Perayaan

Isi nama cuti (contoh: Hari Raya Aidilfitri, Hari Merdeka).

3

Simpan

Tarikh ini akan dikenakan harga Festif/Perayaan secara automatik.

Galeri & FAQ

Urus gambar galeri dan soalan lazim terus dari dashboard admin.

Sistem menggunakan hosting gambar percuma. Kami mengesyorkan Postimages (postimages.org) kerana ia percuma, stabil, dan menyediakan Direct Link yang diperlukan.

Cara Guna Postimages.org
1

Buka Postimages

Pergi ke postimages.org di browser. Tiada perlu daftar akaun untuk upload gambar.

2

Tetapkan "No expiration"

Pastikan pilihan tempoh gambar ditetapkan kepada "No expiration" — supaya gambar kekal selamanya dan tidak padam secara automatik.

Jangan pilih tempoh masa seperti "1 hour" atau "1 day" — gambar galeri anda akan hilang!
3

Klik "Choose images" atau Drag & Drop

Klik butang Choose images dan pilih gambar dari telefon/komputer anda, atau seret dan lepas gambar terus ke halaman.

4

Klik "Upload"

Klik butang Upload dan tunggu sehingga proses selesai. Laman akan bertukar ke halaman hasil upload.

5

Salin "Direct link" — Baris Kedua ⭐

Selepas upload, anda akan nampak beberapa pilihan link. Pastikan anda salin yang betul:

Baris 1 — Shareable image link   https://postimages.org/image/xxxx
Baris 2 — Direct link ✓ GUNAKAN INI
https://i.postimg.cc/xxxxxxxx/nama-gambar.jpg
PILIH INI
Baris 3 — Thumbnail link   https://i.postimg.cc/xxxx/thumb_nama.jpg
Baris 4 — HTML code  
Direct link berakhir dengan .jpg atau .png — ia adalah URL terus ke fail gambar, bukan ke halaman web.
6

Tampal dalam Admin Panel

Admin Panel → Tab Galeri → tampal Direct Link dalam medan URL → klik Preview untuk semak → isi caption (pilihan) → klik Tambah.

Kenapa mesti Direct link (baris ke-2)?
Direct link adalah URL terus ke fail gambar itu sendiri (berakhir .jpg/.png). Sistem perlu URL jenis ini untuk muat dan papar gambar. Link lain seperti "Shareable link" akan menuju ke halaman web Postimages — bukan gambar itu sendiri — dan tidak akan berfungsi dalam galeri.
Saiz gambar disyorkan: 1024×768 piksel untuk kualiti terbaik. Format .jpg atau .png. Saiz fail maksimum percuma: 32MB per gambar.
1

Klik + Tambah FAQ

Butang di bawah senarai FAQ dalam admin panel.

2

Isi Soalan & Jawapan

Klik terus pada teks untuk mengedit. Perubahan disimpan secara automatik (auto-save on blur).

3

Papar Serta-Merta

FAQ baru terus dipapar di laman utama tanpa perlu reload.

Urus Tempahan

Semua tempahan yang dibuat oleh pelanggan direkodkan secara automatik dalam Firestore dan dipapar dalam dashboard admin.

ALIRAN TEMPAHAN

Pelanggan isi borang
→
Rekod dalam Firestore
→
WA auto dihantar
→
Pelanggan buat bayaran
→
Admin sahkan

TINDAKAN ADMIN

✓

Sahkan Deposit

Klik butang 50% dalam kolom Payment untuk sahkan deposit. Mesej WA pengesahan dihantar automatik.

✓

Sahkan Bayaran Penuh

Klik butang PAID untuk sahkan bayaran penuh. Status bertukar kepada Disahkan.

✉

Hantar Mesej WA

Klik nombor telefon pelanggan untuk buka modal template mesej. Pilih template, edit jika perlu, dan hantar.

✕

Batal Tempahan

Klik butang ✕ untuk batalkan tempahan. Tarikh akan dibebaskan dalam kalendar secara automatik.

Blok Tarikh Manual

Gunakan ciri ini untuk menutup tarikh yang anda tidak mahu menerima tempahan — contoh: tarikh untuk kegunaan peribadi, penyelenggaraan, atau cuti.

1

Pergi Tab Blok

Admin Panel → Tab Blok.

2

Pilih Tarikh

Klik pada tarikh dalam kalendar atau isi input tarikh secara manual.

3

Klik Blok

Tarikh akan ditanda merah dalam kalendar dan tidak boleh dipilih oleh pelanggan.

4

Nyah-Blok

Klik pada tarikh yang sudah diblok semula untuk nyah-blok, atau padam dari senarai.

Tarikh yang diblok manual tidak boleh ditempah walaupun check-out/check-in — ia berbeza dari tarikh yang sudah ditempah pelanggan.

WhatsApp Automatik

Sistem menghantar 5 jenis mesej automatik kepada pelanggan menggunakan API Fonnte.

BilaKaedahPenerima
Submit borang tempahanToyyibpay sahajaPelanggan
Klik "Dah Bayar"TNG / BankPelanggan
Bayaran Toyyibpay berjayaAuto redirectPelanggan
Bayaran Toyyibpay gagalAuto redirectPelanggan
Admin sahkan depositManual adminPelanggan
Admin sahkan bayaran penuhManual adminPelanggan
Admin hantar template7 template pilihanPelanggan

7 TEMPLATE ADMIN

✅
Tempahan Disahkan
🕐
Peringatan Check-in
🔑
Panduan Check-in
⭐
Minta Ulasan
⚠️
Peringatan Baki
🚫
Tempahan Dibatal
💬
Tanya Ketersediaan

Setup Fonnte

Fonnte adalah perkhidmatan pihak ketiga untuk menghantar mesej WhatsApp secara automatik. Kos berasingan dari sistem ini.

1

Daftar Akaun Fonnte

Pergi ke fonnte.com dan daftar akaun baharu.

2

Sambungkan WhatsApp

Dalam dashboard Fonnte, tambah nombor WhatsApp anda dan imbas QR code untuk sambung.

3

Salin Token API

Dalam bahagian API Token di Fonnte, salin token yang diberikan.

4

Masukkan dalam Sistem

Admin Panel → Tab Maklumat → Token Fonnte → tampal token → Simpan.

Token disorok — klik ikon mata untuk lihat
Tanpa token Fonnte, semua fungsi lain tetap berjalan. Hanya mesej WhatsApp automatik yang tidak akan dihantar.

Status Tempahan

Setiap tempahan mempunyai status yang menentukan warna dan tindakan yang boleh dilakukan.

StatusMaksudWarnaTindakan Boleh
MenungguTempahan baru, bayaran belum disahkanOren/KuningSahkan deposit, Sahkan penuh, Batal, Hantar WA
DisahkanBayaran telah disahkanHijauHantar WA, Batal
DibatalkanTempahan dibatal — tarikh dibebaskanMerahTiada (rekod kekal untuk rujukan)

ALIRAN STATUS TOYYIBPAY

Menunggu
→
Bayaran berjaya
→
Disahkan (auto)
Menunggu
→
Bayaran gagal
→
Dibatalkan (auto)

Soalan Lazim

Jawapan kepada soalan teknikal yang sering ditanya.