WarungPress (LokalCommerce)

Starter Kit Toko Online Lokal Tanpa Ribet

WarungPress adalah ekstensi WooCommerce super ringan yang dirancang khusus untuk memfasilitasi kebiasaan belanja masyarakat Indonesia. Plugin ini mengubah alur checkout standar yang rumit menjadi sistem pemesanan via WhatsApp, ongkos kirim hyper-lokal (per kecamatan), dan sistem Pre-Order (PO) yang interaktif, tanpa membebani performa website.

---

1. Spesifikasi Hosting & Kebutuhan Sistem

Karena plugin ini dibangun dengan arsitektur Zero Bloat dan merender frontend secara dinamis, spesifikasi server yang dibutuhkan sangat ramah di kantong:

• Web Server: Nginx / LiteSpeed / Apache.
• PHP Version: PHP 7.4 atau 8.0+ (Direkomendasikan 8.2 untuk performa maksimal).
• WordPress & WooCommerce: Versi terbaru.
• HTTPS/SSL (Wajib): Diperlukan agar fitur keamanan modern di browser dan script tracking WooCommerce dapat berjalan tanpa memblokir fungsionalitas JavaScript (HTMX/Alpine).
• Kapasitas Hosting: Sangat kecil. Shared hosting standar Indonesia sudah lebih dari cukup karena file asset (CSS/JS) sudah dikompresi (minify) secara ekstrem.

---

2. Tujuan Plugin

Mengubah WordPress + WooCommerce menjadi katalog digital lokal yang lincah. WarungPress membuang ketergantungan pada API pengiriman pihak ketiga (seperti RajaOngkir) dan Payment Gateway yang mahal, menggantinya dengan alur komunikasi langsung ke WhatsApp Admin dan ongkos kirim kustom berbasis daerah terdekat.

---

3. Siapa yang Cocok Menggunakan Plugin Ini?

• UMKM & Industri Rumahan: Penjual makanan olahan (seperti Hong Shu Gan, kue kering, katering) yang membutuhkan sistem Pre-Order (PO) dan pengiriman kurir lokal.
• Penjual di Instagram/Facebook: Yang ingin beralih memiliki website katalog sendiri tapi pelanggannya masih terbiasa "Beli via WA".
• Web Developer Freelance: Yang ingin membuatkan toko online murah, cepat, dan mudah dikelola untuk klien lokal di kota/kabupatennya.
• Agensi Layanan Pernikahan (Fotographer, Videographer, MUA & WO): Yang ingin menampilkan paket jasa secara profesional dengan sistem booking yang langsung terhubung ke admin tanpa alur pembayaran yang rumit.

---

4. Tech Stack (Dapur Pacu)

WarungPress meninggalkan bloatware lama dan menggunakan tumpukan teknologi paling modern di ekosistem WordPress:

• PHP: Core logic dan integrasi WooCommerce API.
• Tailwind CSS v4.2: Styling utilitas yang super ringan dan langsung dikompilasi.
• Alpine.js: Manipulasi DOM (interaksi UI) sisi client tanpa jQuery.
• HTMX (v2.0.8): Sihir utama untuk melakukan request ke server dan memperbarui harga/ongkir secara instan (AJAX) tanpa perlu reload halaman.
• Vite (Node.js/npm): Bundler modern untuk mengkompilasi dan meminifikasi CSS & JS menjadi ukuran hitungan kilobyte.

---

5. Kelebihan & Kekurangan

✅ Kelebihan:

1. Performa Instan: Kecepatan loading tidak terpengaruh karena tidak ada API eksternal yang dipanggil saat pelanggan membuka halaman.
2. Bebas Biaya Bulanan: Tidak perlu membayar langganan API Ongkir atau potongan per transaksi dari Payment Gateway.
3. Anti-Typo Alamat: Kolom "Kota" bawaan diubah menjadi Dropdown Kecamatan yang pasti, sehingga ongkir langsung terhitung presisi menggunakan HTMX.
4. Alur Checkout Manusiawi: Pelanggan tetap bisa mengirim bukti transfer via WhatsApp dengan format pesan otomatis yang sangat rapi.

❌ Kekurangan:

1. Bukan Untuk Skala Nasional: Fitur ongkos kirim harus diketik manual oleh admin. Kurang cocok untuk toko yang mengirim barang ke seluruh pelosok Indonesia via JNE/J&T.
2. Konfirmasi Pembayaran Manual: Karena tidak memakai Payment Gateway, admin harus memverifikasi mutasi rekening secara manual sebelum mengubah status pesanan.

---

6. Dokumentasi & Panduan Penggunaan Lengkap

A. Instalasi Plugin

1. Unduh file .zip plugin WarungPress.
2. Masuk ke Dashboard WordPress > Plugins > Add New > Upload Plugin.
3. Aktifkan plugin. Pastikan WooCommerce sudah aktif sebelumnya.

B. Pengaturan Awal (Admin)

1. Pergi ke menu WarungPress di panel sebelah kiri.
2. Masukkan Nomor WhatsApp yang aktif (Gunakan format 628xxx, tanpa tanda + atau 0 di depan).
3. Isi Data Ongkir dengan format NamaKecamatan:Harga (Satu baris untuk satu kecamatan. Contoh: Dayeuhluhur:5000).
4. Klik Simpen Pangaturan.

C. Mengaktifkan Fitur Pre-Order (PO)

1. Masuk ke halaman edit produk (Products > Edit).
2. Lihat kotak 📦 Status Pre-Order (WarungPress) di sebelah kanan.
3. Centang opsi "Aktifkeun Mode Pre-Order" dan isi estimasi harinya (Contoh: "Jumat, 10 April" atau "Ready 3 Hari Lagi").
4. Tombol Add to Cart otomatis akan berubah menjadi warna oranye dan berstatus PO.

---

7. Alur Pembukuan: Cara Memproses Checkout (CO) via WhatsApp

Agar data pesanan tetap masuk ke laporan penjualan (Laba/Rugi) WooCommerce dan pembukuan tetap rapi, ikuti alur ini saat ada pesanan masuk:

1. Pesanan Masuk (Status: On Hold / Pending Payment) Saat pembeli menekan tombol "Place Order", pesanan otomatis terekam di sistem WooCommerce. Pembeli kemudian diarahkan ke WhatsApp untuk mengirimkan bukti transfer.
2. Verifikasi Admin di WhatsApp Admin menerima pesan WhatsApp yang berisi Order ID (Contoh: Order #1234) beserta foto bukti transfer. Cek mutasi rekening Anda.
3. Ubah Status Menjadi Lunas (Processing) Jika dana sudah masuk, buka Dashboard WordPress > WooCommerce > Orders. Klik pesanan dengan nomor #1234 tersebut.
   • Pada bagian Status, ubah dari On Hold/Pending menjadi Processing (Sedang Diproses).
   • Langkah ini menandakan pembayaran telah LUNAS.
4. Penyelesaian Pesanan (Completed) Jika barang (misal: Hong Shu Gan) sudah selesai diproduksi dan sudah diserahkan ke kurir/diambil pembeli, ubah status Order menjadi Completed (Selesai).
   • Catatan Penting: Hanya pesanan dengan status Processing dan Completed yang akan dihitung pemasukannya di dalam menu WooCommerce > Reports / Analytics.

---

8. Kompatibilitas Tema (Theme Compatibility)

WarungPress dirancang agar sangat kompatibel dengan hampir semua tema WordPress yang mendukung WooCommerce (seperti Storefront, Astra, GeneratePress, OceanWP, WoodMart, Flatsome, dan tema lokal lainnya).

Mengapa plugin ini bisa sangat fleksibel?

1. Menggunakan Standar Resmi (WooCommerce Hooks): Plugin ini tidak membongkar atau merusak struktur file template (PHP) bawaan tema Anda. Kami menempelkan fitur (seperti Badge PO, Notifikasi Ongkir, dan Tombol WhatsApp) murni menggunakan "kaitan" (hooks) resmi dari sistem inti WooCommerce. Selama tema yang Anda gunakan mematuhi standar coding WooCommerce, WarungPress akan berjalan mulus di atasnya.
2. Styling Independen (Isolasi CSS): Desain kotak notifikasi dan tombol dari WarungPress menggunakan Tailwind CSS yang sudah di-compile secara lokal (menjadi satu file kecil). Artinya, desain plugin ini tidak akan merusak tampilan tema asli Anda, dan sebaliknya, CSS dari tema Anda tidak akan membuat desain plugin ini menjadi berantakan.

⚠️ Catatan Penting untuk Pengguna Tema Modern (Gutenberg / Block Themes): Karena WarungPress memanipulasi form checkout secara interaktif menggunakan HTMX untuk menghitung ongkos kirim lokal, plugin ini memerlukan struktur form klasik.

• Jika halaman Checkout Anda saat ini menggunakan desain WooCommerce Checkout Blocks (biasanya menjadi standar di instalasi WooCommerce terbaru), Anda hanya perlu menghapus block tersebut di editor halaman, lalu menggantinya dengan menggunakan fitur Classic Shortcode: [woocommerce_checkout].

---

9. Penutup & Kontribusi

WarungPress dibangun dengan semangat Open-Source (GPL-v2) untuk membantu digitalisasi usaha mikro di daerah. Jika Anda adalah seorang developer, Anda sangat dipersilakan untuk melakukan Fork, Pull Request, atau memodifikasi source code ini.

Dibuat dengan ☕ dan dedikasi oleh team JasaNgoding.online dan JasaNgoding Blog Hatur Nuhun!