Siapkan alamat CMS, username, dan password yang diberikan administrator. Sebaiknya siapkan juga logo, ikon website, gambar berbagi, alamat bisnis, email, nomor telepon, serta materi konten.
Menu dapat berbeda.
Menu yang terlihat mengikuti hak akses akun dan mode website. Menu toko seperti Orders, Customers, Payment, dan Shipping hanya tampil pada mode Ecommerce.
Contoh tampilan dashboard CMS Exwebs setelah login.
Mulai di sini/Login ke CMS
Akses akun
Login ke CMS
Masuk menggunakan akun yang diberikan administrator untuk mulai mengelola website.
1
Buka halaman admin
Ketik alamat CMS pada browser. Simpan alamat tersebut sebagai bookmark agar mudah ditemukan kembali.
2
Masukkan username
Isi kolom Username sesuai akun Anda. Pastikan tidak ada spasi tambahan.
3
Masukkan password
Isi kolom Password. Gunakan tombol bergambar mata untuk memeriksa password sebelum login.
4
Klik Masuk ke admin
Jika data benar, Anda akan diarahkan ke Dashboard. Jika gagal, periksa kembali username dan password.
Kolom Username, Password, tombol lihat password, dan tombol Masuk ke admin.
Jaga keamanan akun.
Jangan membagikan password melalui grup publik. Setelah selesai menggunakan komputer bersama, selalu logout dari CMS.
Mulai di sini/Mengenal dashboard
Orientasi
Mengenal dashboard
Dashboard adalah titik awal untuk melihat ringkasan website dan membuka setiap area pengelolaan.
Bagian utama dashboard
1
Sidebar
Daftar menu sesuai izin akun dan mode website.
2
Header halaman
Menampilkan judul area aktif, profil, bahasa admin, dan aksi akun.
3
Ringkasan
Statistik kunjungan atau aktivitas yang tersedia untuk akun Anda.
4
Area kerja
Tempat form, tabel data, editor konten, dan tombol simpan ditampilkan.
Pengaturan awal/Identitas & pengaturan
Langkah awal penting
Atur identitas website
Lengkapi informasi dasar agar website tampil profesional dan mudah ditemukan di mesin pencarian.
1
Buka menu Settings
Masuk ke Control → Settings. Menu ini berisi pengaturan yang aman dikelola pengguna.
2
Isi identitas situs
Lengkapi Judul Website, Meta Description, Meta Keywords, dan Copyright Footer. Gunakan deskripsi singkat yang menjelaskan bisnis Anda.
3
Lengkapi kontak dan lokasi
Pilih negara, isi email, nomor telepon, dan alamat. Untuk Indonesia, cari lokasi minimal empat karakter lalu pilih hasil yang sesuai.
4
Unggah media brand
Pilih Logo, Icon, dan Share Image dari media library. Gunakan file tajam dengan latar yang sesuai.
5
Sesuaikan warna
Atur warna latar, teks, navigasi, dan footer agar sesuai identitas brand.
6
Simpan perubahan
Periksa seluruh isian lalu klik tombol simpan. Buka website pada tab baru untuk memeriksa hasilnya.
Form Judul Website, meta, kontak, media, dan warna.
Pengaturan awal/Bahasa & mata uang
Localization
Atur bahasa dan mata uang
Tentukan bahasa storefront, teks umum, mata uang dasar, dan format harga yang tampil kepada pengunjung.
Bahasa storefront
Buka Localization → Languages.
Aktifkan bahasa yang digunakan dan pilih bahasa default.
Edit teks umum storefront pada bahasa yang dipilih.
Klik simpan lalu periksa website publik.
Mata uang
Buka Localization → Currencies.
Periksa kode mata uang, rate, simbol kiri/kanan, dan format desimal.
Tentukan mata uang basis toko dan mata uang tampilan awal pengunjung.
Simpan lalu periksa harga pada halaman produk.
Perhatikan rate.
Rate yang keliru dapat membuat harga tampil salah. Mintalah konfirmasi administrator sebelum mengganti mata uang basis toko.
Pengaturan bahasa storefront.Pengaturan mata uang storefront.
Pengaturan awal/Header & footer
Navigasi website
Kelola header dan footer
Header adalah navigasi utama di bagian atas website, sedangkan footer berisi informasi dan tautan pendukung di bagian bawah website.
Konfigurasi header
Buka menu Header. Bagian Konfigurasi header dipakai untuk menentukan perilaku navigasi utama sebelum mengatur daftar item menu.
Pilih Layout untuk menentukan posisi logo terhadap menu.
Pilih Posisi untuk menentukan cara header menempel pada halaman.
Pilih Mode untuk menentukan hubungan header dengan konten hero atau banner.
Isi Transparansi dan Tinggi Logo sesuai kebutuhan desain.
Klik Simpan header setelah konfigurasi selesai.
Halaman Header berisi konfigurasi tampilan dan daftar item navigasi.
Layout header
Layout menentukan posisi logo. Gunakan Logo kiri untuk tampilan umum, Logo tengah saat brand ingin ditonjolkan di tengah navigasi, atau Logo split bila menu dibagi di sisi kiri dan kanan logo.
Pilihan layout: Logo kiri, Logo tengah, dan Logo split.
Posisi header
Relative membuat header mengikuti alur halaman normal. Absolute menaruh header di atas area konten awal, biasanya untuk header yang menyatu dengan banner. Fixed membuat header tetap terlihat saat halaman di-scroll.
Pilihan posisi: Relative, Absolute, dan Fixed.
Mode, transparansi, dan tinggi logo
Overlay membuat header tampil menyatu di atas konten awal, cocok untuk halaman dengan hero image. Stack membuat header berdiri sebagai bar navigasi biasa sebelum konten. Nilai Transparansi mengatur tingkat tembus pandang header, sedangkan Tinggi Logo mengatur ukuran logo di header.
Pilihan mode: Overlay dan Stack.Kolom Transparansi untuk mengatur tingkat tembus pandang header.Kolom Tinggi Logo untuk mengatur ukuran logo pada header.
Item header
Bagian Item header dipakai untuk menambah, mengubah, mengurutkan, mengaktifkan, atau menghapus menu navigasi. Gunakan tombol panah atas dan bawah untuk mengatur urutan menu.
Klik Tambah item untuk membuat menu baru.
Klik Edit untuk mengubah judul, URL, parent, atau status.
Gunakan Parent jika item ingin dijadikan submenu dari menu lain.
Simpan item, lalu klik Simpan header pada konfigurasi utama.
Daftar item header menampilkan judul, URL, status aktif, urutan, tombol edit, dan hapus.Form item header berisi Judul, URL, Parent, dan tombol simpan.
Kelola footer
Buka menu Footer. Footer disusun dari section dan blok. Section menentukan jumlah kolom dalam satu baris footer, sedangkan blok adalah isi yang ditempatkan di dalam kolom tersebut.
Klik Tambah section jika membutuhkan baris footer baru.
Pilih angka 1-6 pada section untuk menentukan jumlah kolom.
Klik Tambah blok untuk menambahkan konten ke dalam section.
Atur Lebar blok sebagai span, lalu isi konten sesuai tipe blok.
Klik Simpan blok, kemudian klik Simpan footer.
Halaman Footer menampilkan section, jumlah kolom, blok footer, dan tombol simpan.
Section dan kolom
Angka pada section adalah jumlah kolom grid. Jika angka 4 dipilih, section tersebut memiliki 4 slot kolom. Tombol panah atas dan bawah digunakan untuk mengubah urutan section.
Contoh dua section footer: section pertama berisi blok, section kedua masih kosong.
Lebar blok sebagai span
Lebar pada blok berarti berapa slot kolom yang dipakai oleh blok tersebut. Pada section 4 kolom, blok About Us dengan lebar 2 kolom akan memakai setengah baris, lalu dua blok lain dengan lebar 1 kolom dapat mengisi sisa kolom.
Blok
Tipe
Lebar
Hasil pada section 4 kolom
About Us
Paragraf
2 kolom
Mengambil 2 dari 4 slot.
Follow Us
Ikon daftar
1 kolom
Mengambil 1 slot.
Our News
Blog
1 kolom
Mengambil 1 slot.
Pilihan Lebar menentukan span blok: 1 kolom atau 2 kolom.
Tipe blok footer
Pilih tipe blok sesuai isi yang ingin ditampilkan. Field di bawahnya akan berubah mengikuti tipe blok yang dipilih.
Tipe blok
Kegunaan
Field utama
Judul
Menampilkan heading singkat.
Judul, Konten.
Paragraf
Mengisi teks seperti About Us.
Judul, Konten.
HTML
Menaruh markup khusus bila dibutuhkan.
Judul, HTML.
Tombol
Menampilkan tombol aksi.
Judul, Teks tombol, URL.
Menu
Menampilkan daftar tautan manual.
Judul, Perataan, Label, URL.
Ikon daftar
Menampilkan tautan dengan ikon, seperti sosial media.
Judul, Class ikon, Teks, URL.
Grid logo
Menampilkan kumpulan logo partner, marketplace, atau brand.
Judul, Grid per baris, Gambar, URL.
Blog
Menampilkan daftar artikel otomatis.
Judul, Batas item, Kategori artikel.
Pilihan tipe blok footer menentukan field konten yang tersedia.
Blok paragraf
Gunakan tipe Paragraf untuk teks deskripsi singkat seperti About Us. Jika teks perlu tampil lebih lebar, pilih Lebar 2 kolom.
Blok Paragraf berisi Tipe Blok, Lebar, Judul, dan Konten.
Blok blog
Gunakan tipe Blog untuk menampilkan artikel otomatis. Isi Batas item untuk menentukan jumlah artikel, lalu pilih Artikel terbaru atau kategori artikel tertentu.
Blok Blog dapat mengambil artikel terbaru atau artikel dari kategori tertentu.
Blok ikon daftar
Gunakan tipe Ikon daftar untuk tautan sosial media atau kontak cepat. Setiap item memiliki ikon, teks, dan URL. Tombol Pilih ikon membuka daftar ikon FontAwesome.
Blok Ikon daftar mendukung beberapa item, masing-masing dengan ikon, teks, dan URL.
Blok grid logo
Gunakan tipe Grid logo untuk menampilkan kumpulan logo. Lebar tetap mengatur span blok pada section, sedangkan Grid per baris mengatur jumlah logo yang tampil dalam satu baris di dalam blok tersebut.
Grid logo memiliki pengaturan Grid per baris, gambar logo, judul, URL, dan tombol Tambah logo.
Pengaturan awal/Pengguna & role
Akses tim
Kelola pengguna dan hak akses
Buat akun terpisah untuk setiap anggota tim dan berikan akses sesuai tanggung jawabnya.
1
Buat role
Buka System → Roles, buat role seperti Editor, Admin Toko, atau Penulis.
2
Pilih permission
Aktifkan hanya menu yang diperlukan. Penulis artikel tidak harus memiliki akses pembayaran atau pengaturan website.
3
Tambahkan pengguna
Buka System → Users, isi data akun, lalu pilih role yang sesuai.
4
Uji akun
Login menggunakan akun baru dan pastikan hanya menu yang diizinkan yang tampil.
Halaman Permissions dipakai untuk mengatur akses role. Aktifkan hanya area yang memang dibutuhkan oleh role tersebut, lalu klik Simpan permission.
Prinsip akses minimum.
Berikan hak akses secukupnya. Ini mengurangi risiko perubahan atau penghapusan data yang tidak disengaja.
Kelola konten/Homepage
Halaman depan
Kelola homepage
Menu Homepage dipakai untuk mengatur halaman depan website, membuka editor layar penuh, melihat preview frontend, dan menyimpan perubahan.
1
Buka Homepage
Pilih menu Content → Homepage untuk mengelola halaman depan website.
2
Gunakan layar penuh bila perlu
Klik Fullscreen untuk membuka editor dalam tampilan halaman penuh agar area kerja lebih luas.
3
Preview halaman
Klik Preview untuk membuka homepage di sisi frontend dan melihat hasil yang akan dilihat pengunjung.
4
Simpan perubahan
Klik Simpan Perubahan setelah selesai mengatur homepage.
Halaman Homepage memiliki tombol Fullscreen, Preview, dan Simpan Perubahan.
Kelola konten/Builder
Editor blok
Susun konten dengan builder
Builder dipakai untuk menambahkan, mengurutkan, menduplikasi, dan mengatur blok konten. Karena pilihannya banyak, bagian detail paling cocok dijelaskan lewat video.
1
Tambah blok
Pilih jenis blok yang dibutuhkan, misalnya slideshow, banner, produk, blog, paragraf, atau tombol.
2
Edit isi blok
Lengkapi konten, gambar, tautan, dan pengaturan tampilan sesuai tipe blok.
3
Atur urutan
Gunakan tombol naik/turun, duplikasi, atau hapus untuk merapikan susunan halaman.
4
Simpan hasil
Setelah blok selesai disusun, kembali ke halaman terkait dan simpan perubahan.
Builder digunakan untuk menyusun blok konten halaman.
Tips menyusun homepage.
Mulai dari pesan utama, manfaat, produk/layanan unggulan, bukti kepercayaan, lalu ajakan bertindak. Hindari terlalu banyak blok yang mengulang informasi.
Kelola konten/Halaman utama
Main Page
Buat halaman utama
Gunakan Main Page untuk halaman penting seperti Tentang Kami, Layanan, Portofolio, atau Kontak.
Buka Content → Main Page dan pilih tambah halaman.
Isi judul, slug, status, cover, serta informasi SEO.
Susun isi menggunakan builder seperti pada Homepage.
Simpan halaman dan tambahkan tautannya ke Header jika diperlukan.
Periksa URL serta tampilan halaman di website publik.
Form pengaturan halaman dan area builder.
Kelola konten/Artikel
Blog & berita
Tulis dan terbitkan artikel
Artikel dapat digunakan untuk berita, tips, edukasi pelanggan, serta konten pendukung SEO.
1
Tambah artikel
Buka Content → Articles lalu klik tombol tambah.
2
Isi judul dan ringkasan
Tulis judul yang jelas dan deskripsi singkat. Jika tersedia beberapa bahasa, pilih tab bahasa yang sedang diedit.
3
Tulis isi artikel
Gunakan editor untuk paragraf, heading, daftar, tautan, dan gambar. Pecah teks panjang agar mudah dibaca.
4
Tambahkan gambar dan SEO
Pilih cover, isi Meta Description, dan tambahkan keyword yang relevan.
5
Terbitkan
Pilih status aktif, simpan, lalu periksa halaman artikel pada website.
Judul, tab bahasa, editor konten, gambar, dan pengaturan SEO.
Kelola konten/Galeri
Koleksi visual
Kelola galeri
Tambahkan foto kegiatan, portofolio, proyek, atau koleksi visual lainnya.
Buka Content → Gallery dan klik tambah item.
Isi judul, deskripsi, klasifikasi, dan status.
Pilih gambar dari media library atau unggah gambar baru.
Simpan lalu periksa galeri pada website publik.
Kualitas gambar.
Gunakan rasio dan gaya visual yang konsisten. Kompres gambar sebelum unggah agar halaman tetap cepat.
Daftar galeri menampilkan pencarian, filter status, thumbnail, status, dan aksi item.Form galeri berisi judul, deskripsi, gambar, status, kategori, dan tombol simpan.Modal gambar galeri dipakai untuk mencari, mengunggah, memilih, dan memakai gambar.
Kelola konten/Type & klasifikasi
Struktur konten
Atur type dan klasifikasi
Type menentukan kelompok klasifikasi, sedangkan klasifikasi mengelompokkan produk, artikel, halaman, atau galeri.
01
Buat Type
Buka Structure → Type. Buat jenis klasifikasi dan tentukan area penggunaannya, misalnya Kategori Produk atau Kategori Artikel.
02
Isi Klasifikasi
Buka Structure → Classification. Tambahkan item, isi nama dan slug, lalu susun parent-child jika membutuhkan kategori bertingkat.
Rencanakan sebelum mengisi konten.
Struktur klasifikasi yang rapi memudahkan filter, navigasi, dan pengelolaan konten dalam jangka panjang.
Toko online/Produk & varian
Katalog
Tambah produk dan varian
Kelola identitas produk, galeri, klasifikasi, SKU, harga, stok, dan varian dari editor produk.
1
Buka Products
Pilih Catalog → Products, lalu klik tambah produk.
2
Isi identitas produk
Lengkapi nama, slug, deskripsi, Meta Description, dan keyword. Gunakan tab bahasa bila tersedia.
3
Tambahkan galeri
Pilih gambar cover dan gambar tambahan. Urutkan gambar dengan gambar utama di posisi pertama.
4
Pilih klasifikasi
Pilih kategori atau klasifikasi yang sesuai agar produk mudah ditemukan.
5
Atur SKU, harga, dan stok
Untuk produk sederhana, isi Default SKU. Untuk produk bervarian, buat grup seperti Warna dan Ukuran lalu lengkapi SKU matrix.
6
Atur visibilitas
Aktifkan harga, email, WhatsApp, status produk, dan pelacakan stok sesuai kebutuhan.
7
Simpan dan uji
Buka halaman detail produk, pilih setiap varian, periksa harga, stok, gambar, dan tombol pembelian.
Daftar produk menampilkan pencarian, filter kategori, urutan, harga, stok, jumlah view, status, dan tombol lihat, edit, atau hapus.Form utama dipakai untuk mengisi nama, tipe produk, deskripsi, SEO, status aktif, tampilan online, harga, WhatsApp, email, dan tombol simpan.Bagian galeri dipakai untuk menentukan cover dan gambar produk tambahan. Gambar utama tetap terpisah dari gambar per SKU.Klasifikasi menghubungkan produk ke brand, category, atau taxonomy lain agar produk bisa difilter dan dikelompokkan di website.Grup varian membentuk kombinasi SKU, misalnya Warna dan Ukuran. Setiap opsi di dalam grup akan digabung menjadi baris SKU.Untuk opsi warna, pilih warna visual melalui color picker agar pilihan varian lebih mudah dikenali di frontend.SKU matrix dipakai untuk mengatur harga, harga coret, stok, berat, gambar, dan status aktif untuk setiap kombinasi varian.Relasi produk tambahan dipakai untuk memilih produk lain yang disarankan muncul bersama produk utama di website.
Periksa stok setiap varian.
Jika Track Stock aktif, isi stok per SKU dengan benar. Produk atau varian dengan stok nol dapat tidak tersedia untuk dibeli.
Toko online/Pesanan & pelanggan
Operasional toko
Kelola pesanan dan pelanggan
Tinjau antrean pesanan, buka detail transaksi, perbarui status, dan kelola data pelanggan.
Alur pesanan
Buka Sales → Orders dan cari nomor order atau pelanggan.
Buka detail untuk memeriksa item, jumlah, alamat, pembayaran, dan pengiriman.
Perbarui status sesuai proses operasional yang benar.
Simpan perubahan dan komunikasikan status kepada pelanggan bila diperlukan.
Data pelanggan
Buka Sales → Customers untuk melihat direktori pelanggan, menambah data, atau memperbarui informasi yang diizinkan.
Queue order menampilkan pencarian invoice, penerima, atau telepon, filter status, pagination, total order, channel pembayaran, tanggal update, dan status pesanan.Detail order dipakai untuk memeriksa invoice, penerima, kontak, pembayaran, alamat tujuan, item pesanan, tombol WhatsApp, email, print, dan download PDF.Status order dapat diubah dari detail order. Pilih status yang sesuai proses fulfillment, lalu klik Simpan status.
Toko online/Pembayaran & pengiriman
Checkout
Atur pembayaran dan pengiriman
Aktifkan metode yang digunakan bisnis dan lakukan pengujian sebelum menerima pesanan publik.
01
Payment
Buka Sales → Payment. Atur transfer bank atau gateway yang tersedia. Periksa rekening, mode sandbox/production, dan kredensial.
02
Shipping
Buka Sales → Shipping. Atur pickup atau kurir, lokasi asal, layanan, dan pengaturan ongkir yang tersedia.
Payment mengatur apakah checkout menerima pembayaran, pilihan channel seperti Bank Transfer, Midtrans, Xendit, PayPal, Stripe, QR Code, status channel, judul, deskripsi, dan tombol simpan.Shipping mengatur gateway pengiriman, metode Courier, Pickup, atau Free Shipping, batas minimum order, subsidi maksimal, kurir, kota berlaku, dan tombol simpan.
Jangan menebak kredensial.
API key, secret key, dan data rekening harus berasal dari akun bisnis resmi. Lakukan satu transaksi uji setelah perubahan.
Toko online/Kupon
Promosi
Buat kupon promosi
Gunakan kupon untuk diskon dengan periode, nilai, dan syarat yang terkontrol.
Buka Sales → Coupons lalu tambah kupon.
Tentukan kode yang mudah diketik tetapi tidak mudah ditebak.
Isi jenis dan nilai diskon, masa berlaku, serta batas penggunaan.
Aktifkan kupon, simpan, lalu uji pada halaman checkout.
Daftar kupon menampilkan kode, judul, nilai diskon, periode aktif, pemakaian, status, serta tombol edit dan hapus.Form kupon dipakai untuk mengisi title, code, deskripsi, tipe diskon, nilai diskon, diskon maksimal, minimal belanja, batas pemakaian, visibility, tanggal mulai, tanggal selesai, dan status.
Publikasi & bantuan/Gambar & media
Media library
Siapkan gambar yang baik
Gambar yang konsisten membuat website lebih profesional sekaligus menjaga kecepatan halaman.
Kebutuhan
Format
Saran ukuran
Catatan
Logo
PNG / WebP
600 × 200 px
Latar transparan bila diperlukan.
Icon/Favicon
PNG
512 × 512 px
Gunakan bentuk sederhana.
Share image
JPG / WebP
1200 × 630 px
Untuk WhatsApp dan media sosial.
Cover artikel
WebP / JPG
1600 × 900 px
Gunakan rasio konsisten.
Produk
WebP / JPG
1200 × 1200 px
Latar dan pencahayaan seragam.
Nama file juga penting.
Gunakan nama singkat dan deskriptif, misalnya produk-kopi-arabika.webp. Hindari nama seperti IMG_001-final-baru.jpg.
Publikasi & bantuan/Video tutorial
Belajar lewat video
Video tutorial CMS Exwebs
Area ini disiapkan untuk video tutorial. Video dapat berupa file MP4 lokal atau embed dari YouTube/Vimeo.
Placeholder video siap diganti.
Lihat README di folder DOCS untuk contoh mengganti kartu ini dengan video MP4 atau embed YouTube.
Publikasi & bantuan/Pemecahan masalah
Bantuan cepat
Pemecahan masalah umum
Coba pemeriksaan berikut sebelum menghubungi administrator.
Tidak bisa login
Periksa ejaan username, pastikan Caps Lock tidak aktif, lalu coba tampilkan password. Jika tetap gagal, minta administrator mereset akun.
Menu yang dicari tidak terlihat
Menu mengikuti permission dan mode website. Minta administrator memeriksa role akun Anda. Menu toko hanya tampil pada mode Ecommerce.
Perubahan belum tampil di website
Pastikan data sudah disimpan, lalu refresh halaman website atau periksa dengan mode incognito. Jika perubahan tetap belum tampil, hubungi administrator.
Gambar tidak tampil
Periksa format file, ukuran, dan apakah unggahan selesai. Coba pilih ulang melalui media library dan simpan kembali konten.
Harga atau stok varian salah
Buka editor produk, periksa setiap baris SKU matrix, harga, compare-at price, Track Stock, dan jumlah stok.
Masih terkendala?
Siapkan informasi untuk tim support
Sertakan alamat halaman, nama menu, waktu kejadian, langkah sebelum error, serta screenshot pesan error.
