NGltYlfpHgWiSSUCGik6kh8ZIoXqxuoYARA4nUWi
Bookmark

Template Toko Online berbasis WhatsApp (WA)

Bilalcoy
Bilalcoy
... menit baca
Dengarkan

Di era digital saat ini, berjualan secara online harus cepat, instan, dan efisien. Bagi Anda seorang Pebisnis Online yang menjual produk fisik, produk digital, maupun jasa, memiliki website toko online sendiri adalah sebuah keharusan untuk meningkatkan kepercayaan pelanggan.

Kabar baiknya, Anda tidak perlu menyewa hosting mahal! Cukup menggunakan platform gratis dari Blogger (Blogspot) yang dipadukan dengan Template Toko Online berbasis WhatsApp (WA) + Keranjang Pesanan. Setiap pesanan pelanggan akan otomatis direkap dan dikirimkan langsung ke nomor WhatsApp Anda. Sangat praktis!

🌟 Penasaran dengan hasil akhirnya?
Anda bisa melihat langsung simulasi nyata (Live Demo) dari template toko online ini melalui tautan berikut:

Lihat Contoh Tampilan Toko (Demo)
⚠️ Catatan Penting Lisensi Tema:
Template toko online ini bisa Anda gunakan secara 100% GRATIS selama Anda menggunakan subdomain bawaan Blogger (contoh: tokoanda.blogspot.com). Namun, jika Anda ingin menggunakan Domain Custom (contoh: tokoanda.com atau .co.id), Anda WAJIB membeli Lisensi Domain.

Spesial: Bagi Anda yang mengambil paket Berlangganan di layanan kami, lisensi penuh untuk tema ini akan kami berikan secara Cuma-cuma (Gratis)!
💎 Akses File Tema Blogger
Info Singkat: Panduan ini akan membahas langkah demi langkah mulai dari cara instalasi tema, mengatur nomor WhatsApp, hingga cara mempublikasikan produk menggunakan berbagai generator praktis yang telah disediakan. Pastikan Anda sudah mengekstrak (unzip) 1 File Paket Tema yang Anda unduh, karena semua file pendukung ada di dalamnya.
📌 Tampilkan Daftar Isi Panduan
🔥 Akses Cepat Generator Lengkap: Jika Anda sudah paham langkah-langkah di bawah, Anda bisa langsung mengakses seluruh daftar alat bantuan kami di Bagian 8 (Kumpulan Generator Lengkap).

1. Cara Instalasi Tema Blogger Toko Online

Buka folder paket tema yang sudah Anda ekstrak. Di dalamnya, cari file yang memiliki format .xml. Ada dua cara yang bisa Anda lakukan untuk memasang file ini ke dalam blog Anda.

Peringatan! Pastikan Anda sudah membackup (mencadangkan) template lama Anda sebelum melakukan instalasi tema baru untuk menghindari hilangnya data modifikasi sebelumnya.

Cara 1: Melalui Fitur Pulihkan (Restore)

  1. Login ke dashboard Blogger.
  2. Pilih menu Tema (Theme) di bilah navigasi kiri.
  3. Klik tombol panah bawah di sebelah tombol Sesuaikan.
  4. Pilih Pulihkan (Restore).
  5. Klik Upload dan cari file .xml template toko online dari folder paket tema Anda.
  6. Tunggu beberapa saat hingga muncul notifikasi "Tema berhasil dipulihkan".

Cara 2: Melalui Edit HTML (Salin & Tempel Kode)

Gunakan cara ini jika terjadi error saat menggunakan fitur "Pulihkan" di Cara 1.

  1. Buka file .xml template toko online menggunakan aplikasi Text Editor (seperti Notepad di Windows atau TextEdit di Mac).
  2. Salin (Copy) seluruh teks kode yang ada di dalam file tersebut (tekan Ctrl + A lalu Ctrl + C).
  3. Login ke dashboard Blogger dan masuk ke menu Tema.
  4. Klik tombol panah bawah di sebelah tombol Sesuaikan, lalu pilih Edit HTML.
  5. Klik di sembarang tempat di dalam kotak kode editor, lalu blok semua kode bawaan (tekan Ctrl + A) dan Hapus (Delete).
  6. Tempel (Paste) kode template baru yang sudah Anda salin sebelumnya ke area kosong tersebut (tekan Ctrl + V).
  7. Klik tombol Simpan (ikon disket/simpan) di pojok kanan atas layar editor.

2. Cara Mengatur Nomor WA, Pembayaran & Pengiriman

Agar sistem keranjang belanja berjalan lancar, Anda perlu mengatur nomor WhatsApp penerima pesanan, detail rekening pembayaran, dan opsi pengiriman. Kami sudah menyediakan alat khusus agar Anda tidak perlu mengedit kode rumit.

Tips Produk Digital/Jasa: Jika Anda hanya menjual produk digital (Top Up, E-Course, dll) atau Jasa yang tidak memerlukan kurir fisik, Anda bisa menonaktifkan fitur Pengiriman (di-off-kan) langsung melalui generator di bawah ini.
  1. Buka halaman Generator Pembayaran & Pengiriman melalui tautan ini:

    Buka Generator Pengaturan

  2. Ikuti panduan dan isi formulir yang ada di generator tersebut (Nomor WA, Bank/E-Wallet, Ongkir dll).
  3. Setelah selesai, Salin (Copy) kode yang dihasilkan.
  4. Masuk ke menu Tata Letak (Layout) di Blogger Anda.
  5. Cari widget bernama Pengaturan WA & Pembayaran (atau Metode Pengiriman).
  6. Edit widget tersebut, paste kodenya, lalu klik Simpan.

3. Cara Membuat Postingan Produk

Membuat postingan produk kini sangat mudah karena di dalam folder paket tema sudah disediakan file berisi kode HTML khusus siap pakai. Anda tidak perlu repot menyusun tata letak dari nol.

  1. Buka menu Postingan > Postingan Baru di Blogger.
  2. Di pojok kiri atas, ubah mode penulisan dari Tampilan Menulis (Compose view) menjadi Tampilan HTML (HTML view) ikon <>.
  3. Buka file format postingan produk (biasanya berformat .txt atau .html) yang ada di dalam folder paket tema Anda. Salin (Copy) semua isinya.
  4. Paste (Tempel) kode HTML tersebut ke dalam editor postingan Blogger.
  5. Setelah dipaste, kembalikan mode penulisan ke Tampilan Menulis (Compose view).
  6. Sekarang Anda akan melihat format/tabel produk yang sudah rapi. Silakan isi dan ganti bagian: Gambar, Judul, Harga, Spesifikasi, dan Deskripsi langsung dari editor visual tersebut.
  7. SANGAT PENTING: Di bagian kanan layar pada kolom Label, tambahkan label wajib seperti Produk atau Product agar sistem mengenali postingan tersebut sebagai barang dagangan.
  8. Klik Publikasikan.
Berhasil! Sekarang produk Anda sudah tampil di halaman depan lengkap dengan tombol keranjang belanja.

4. Cara Membuat Halaman (Pages) Pendukung

Sama seperti postingan produk, di dalam paket tema juga sudah disiapkan file format HTML khusus untuk Halaman Statis pendukung toko seperti Cara Pemesanan, Tentang Kami, atau Syarat & Ketentuan. Ikuti langkah praktis ini:

  1. Masuk ke menu Halaman (Pages) di dashboard Blogger.
  2. Klik Halaman Baru dan beri judul, misalnya "Cara Pemesanan".
  3. Ubah mode penulisan ke Tampilan HTML (<>).
  4. Buka file format Halaman (Pages) dari folder paket tema, salin seluruh isinya, lalu Paste ke editor Blogger.
  5. Kembalikan ke mode Tampilan Menulis (Compose).
  6. Isi panduan, teks, dan langkah pembelian toko Anda langsung di dalam tabel yang sudah muncul di layar.
  7. Klik Publikasikan.

Untuk menampilkan halaman tersebut di menu navigasi atas (Menu Header) toko Anda:

  1. Salin URL Halaman yang baru saja Anda buat.
  2. Masuk ke menu Tata Letak.
  3. Cari widget Menu Utama / Main Menu, lalu klik edit.
  4. Tambahkan nama menu dan tempel (paste) URL halaman tersebut. Simpan.

5. Cara Membuat Postingan Produk Digital (Top Up, dll)

Selain produk standar, template ini sangat istimewa karena mendukung format penjualan produk digital secara spesifik seperti Top Up Games, Voucher, dll. Anda tidak perlu menyusun tombol atau layarnya dari nol.

  1. Kunjungi halaman Generator Produk Top Up melalui tombol berikut:

    Buka Generator Top Up

  2. Ikuti instruksi dan panduan pengisian form yang ada di dalam halaman generator tersebut. (Jika ingin melihat hasil jadinya, silakan cek Contoh Halaman Top Up di sini).
  3. Setelah form diisi lengkap, Salin (Copy) kode HTML hasil generator.
  4. Kembali ke Dashboard Blogger, buat Postingan Baru.
  5. Pindah ke mode Tampilan HTML (<>), lalu Tempel (Paste) kode tersebut.
  6. Kembalikan ke Tampilan Menulis, sesuaikan sedikit jika perlu, lalu klik Publikasikan.

6. Fitur Advanced: Sistem Member Area & Panel Admin (Khusus Produk Digital)

Jika Anda berencana membangun bisnis produk digital yang lebih profesional (memiliki fitur login member, riwayat pesanan, dan manajemen toko), template ini memiliki fitur Advanced yang terintegrasi dengan database Firebase Google.

Syarat Wajib: Sebelum membuat Panel Admin atau Member Area, Anda WAJIB mendaftar dan menyeting Firebase terlebih dahulu.
  1. Setup Database: Buka panduan Generator Setting Firebase dan ikuti langkah demi langkah untuk menghubungkan template ini dengan database Firebase Anda.
  2. Buka File HTML dari Paket Tema: Anda tidak perlu mengunduh file lain lagi. Silakan buka folder paket tema yang sudah Anda ekstrak sebelumnya. Di dalamnya sudah kami sertakan file HTML khusus untuk membuat halaman Admin dan Member Area.
  3. Buat Halaman/Post: Buka file HTML Admin/Member tersebut di komputer Anda, lalu copy kodenya. Buat Halaman (Pages) atau Postingan baru di Blogger, lalu paste kode HTML tersebut di mode Tampilan HTML. Publikasikan.
  4. Buat Postingan Produk Digital: Untuk memposting produk digital yang terhubung dengan sistem canggih ini, Anda bisa menggunakan alat khusus berikut:

    Buka Generator Produk Digital

    Isi detail produk pada generator tersebut, salin kodenya, lalu paste di Tampilan HTML pada postingan Blogger baru Anda.

7. Kumpulan Generator Pelengkap Tata Letak (Layout)

Untuk mempermudah Anda mempercantik tampilan blog tanpa harus mengedit kode secara manual di dalam menu Tema, kami juga telah menyediakan serangkaian tool Generator Tata Letak. Cukup isi form di generator, salin kodenya, dan paste ke dalam widget di menu Tata Letak (Layout) Blogger Anda.

Panduan detail penggunaan bisa Anda lihat langsung di dalam halaman generator masing-masing.

8. Kumpulan Tool Generator Lengkap (Pusat Akses)

Untuk mempermudah alur kerja Anda, berikut adalah daftar lengkap semua tool generator yang telah kami siapkan khusus untuk template ini. Klik tautan di bawah ini sesuai kebutuhan Anda:

Siap Mulai Berjualan? 🚀

Dengan semua tool, file, dan generator yang sudah disediakan dalam satu paket, blog Blogger Anda kini jauh melampaui blog biasa. Website Anda sudah bertransformasi menjadi mesin penjual otomatis yang efisien untuk segala macam produk fisik maupun digital.


Masuk ke Dasbor Blogger Anda