Membuat Website Toko Online Dengan WordPress dan Woocommerce

membuat-website-toko-online-dengan-wordpress-dan-woocommerce

Daftar Isi

[ratings]
[SSB counter="true"]

Zaman sekarang bukan hal sulit untuk membangun toko online impian. Apalagi bagi orang-orang yang kurang paham bahasa pemrogaman, sangat diuntungkan dengan perkembangan website yang semakin canggih dan user friendly.

Oleh karena itu, kami ingin berbagi informasi terkait cara membuat toko online WordPress menggunakan WooCommerce yang bisa digunakan untuk berjualan online dengan fitur lengkap serta tampilan situs yang profesional.

Apa Itu WooCommerce?

WooCommerce secara teknis adalah sebuah plugin (alat bantu WordPress) yang secara khusus didedikasikan untuk memungkinkan WordPress berubah menjadi sebuah toko online.

WooCommerce ini termasuk dalam daftar platform online builder terbagus di dunia. WooCommerce sebenarnya juga bersifat open-source sehingga ada banyak orang dari khalayak umum yang berkontribusi dalam pengembangan WooCommerce. Platform satu ini dapat Anda kustomisasi dengan bebas sesuai keperluan bisnis Anda.

WooCommerce memungkinkan Anda untuk mengubah blog WordPress biasa menjadi sebuah toko online canggih. Tentu saja dengan bantuan berbagai plugin tambahan lain.

Kombinasi antara WordPress dan WooCommerce, siapapun termasuk Anda kini dapat membuat toko online dengan mudah.

Yang Perlu Dipersiapkan sebelum Membuat Toko Online dengan WordPress dan WooCommerce

Sebelum mulai, Anda harus mempersiapkan berbagai hal berikut:

1. Produk yang Mau Dijual

Persiapkan produk yang akan Anda jual nantinya karena jenis produk yang dijual akan mempengaruhi konsep toko online Anda, dari segi desain sampai segi fungsionalnya. Melalui WordPress dan WooCommerce, Anda dapat menjual jasa, produk fisik, produk digital. Semua bergantung pada preferensi Anda.

2. Hosting dan Domain

Saat ini banyak penyedia layanan hosting dan domain yang harganya terjangkau dan mudah untuk menginstal WordPress.

3. Theme Toko Online WordPress

Theme toko online WordPress merupakan salah satu aspek terpenting ketika akan membuat toko online WordPress. Pilihlah theme WordPress yang bagus tampilannya dan fitur yang lengkap sehingga memberikan tampilan yang menarik dan profesional. Ada bisa menggunakan themes Storefront untuk memulai pembuatan toko online. Themes ini adalah themes resmi dari woocommerce yang bisa anda download disini atau melalui dashboard wordpress anda.

Fitur-fitur WooCommerce

 Selanjutnya, Anda perlu mengenali fitur-fitur yang ditawarkan WooCommerce agar Anda segera mendapatkan gambaran tentang WooCommerce. Berikut ini fitur-fitur yang ada di WooCommerce:

  • Manajemen Produk

Anda dapat membuat berbagai jenis produk, baik berupa barang nyata atau barang virtual. Anda dapat melakukan kustomisasi dengan leluasa terkait produk dengan menambahkan atribut tertentu seperti ukuran, warna, harga, dan lain-lain. Anda pun dapat memberikan harga khusus (promo) jika Anda ingin menurunkan harga serta inventory.

  • Jalur Pembayaran

WooCommerce menyediakan jalur pembayaran melalui PayPal, Stripe, Transfer Bank, Cash On Delivery. Anda pun dapat mengintegrasikan dengan payment gateway lain.

  • Manajemen Pesanan

Anda dapat mengawasi order yang dikirimkan pelanggan Anda dengan sangat mudah. Anda pun dapat membuat offline order secara manual.

  • Perjalanan Berbelanja

Perjalanan transaksi pelanggan di WooCommerce dimulai dari keranjang belanja (Cart) kemudian melakukan Checkout. Pelanggan bisa membuat akun sendiri agar dapat mengawasi orderan mereka. Jadi, pada dasarnya perjalanan berbelanjanya bukan hal baru bagi yang terbiasa berbelanja di toko e-commerce raksasa, seperti Bukalapak, Tokopedia, dan sebagainya.

  • Laporan Penjualan

Anda dapat melihat laporan penjualan dengan mudah. Apabila laporan penjualan bawaan terlalu sederhana, Anda bisa menambah extension laporan tertentu sehingga Anda bisa melakukan ekspor laporan ke dalam bentuk dokumen excel maupun CSV. Anda pun dapat melihat laba rugi dengan WooCommerce cost of good.

  • Pengiriman

Anda dapat memasukkan harga ongkir barang secara manual maupun bisa mengintegrasikan dengan aplikasi lain, seperti raja ongkir. Selain itu, tersedia banyak extension alternatif untuk memudahkan Anda dalam melakukan kalkulasi shipping dari kurir pengiriman Indonesia, seperti Woo Ongkir yang merupakan extension WooCommerce yang berfungsi untuk menghitung ongkis kirim seluruh Indonesia (JNE, POS, Tiki, dll). Anda juga bisa mencoba https://pluginongkoskirim.com/ yang merupakan plugin WooCommerce yang berfungsi untuk menghitung ongkos kirim seluruh Indonesia (JNE, POS, Tiki, J&T, dll). Anda pun dapat mengeksplorasi pilihan pengembangan website terkait dengan shipping.

  • Rule Potongan Harga

Anda bisa menawarkan diskon dengan menggunakan kupon. Anda pun dapat menginstal plugin extension sehingga bisa membuat discount rule dan sebagainya sehingga menarik bagi calon customer Anda.

  • SMTP Email

WooCommerce menggunakan API (application programming interface) untuk mengkoneksikan SMTP (Simple Mail Transfer Protocol) email yang sudah Anda konfigurasikan di WordPress Anda. SMTP Email digunakan untuk memberitahu pembeli dan admin terkait aktivitas online shop Anda dari waktu ke waktu. 

  • Integrase API

WooCommerce tergolong sangat mudah untuk diintegrasikan ke berbagai API, seperti Facebook login. Sederhananya API merupakan penguhubung antaraplikasi yang akan dibuat dengan aplikasi lain. Tujuannya adalah agar memungkinkan aplikasi yang berbeda dapat berkomunikasi dan saling berbagi data. 

  • Membangun Marketplace

Anda dapat mengubah online shop Anda menjadi marketplace dengan menggunakan plugin pendukung yang terintegrasi dengan WooCommerce, seperti WCvendors.

Mengapa Menggunakan WooCommerce?

1.  Dirancang Compatible untuk WordPress

Menggabungkan WordPress dan WooCommerce tidak akan mengalami kendala karena integrasinya sudah bagus sehingga dengan WooCommerce saja, Anda bisa terhubung dengan jutaan pengguna WordPress

2. Dapat Disesuaikan dengan Kebutuhan Anda

WooCommerce tergolong ramah bagi development personal lanjutan karena dapat diatur sesuai keperluan Anda.

3. Keamanan Terjamin

WooCommerce diklaim mampu melindungi keamanan data Anda sehingga tidak akan jatuh ke platform pihak ketiga mana pun, yang bisa saja mengambil data Anda tanpa sepengetahuan Anda. WooCommerce pun mengklaim keamanan terkait transaksi jual beli Anda dengan calon konsumen.

4. Sudah Diaudit oleh Sucuri

WooCommerce dikatakan sudah bagus karena berpegang pada standar coding dan performa terbaik WordPress. Sucuri menjadi salah satu plugin keamanan yang terbaik dan layak untuk dipertimbangkan. Plugin keamanan WordPress ini mampu mendeteksi dan melihat berbagai virus. Lebih lengkapnya bisa kunjungi website resmi Sucuri di sini 

5. Komunitas Global yang Sudah Besar dan Berkembang Pesat

Apabila terkendala atau butuh panduan teknis, Anda dapat saling membantu satu dengan yang lain antarsesama anggota komunitas WooCommerce karena contributor dan jumlah instalasi WooCommerce sangat banyak.

6. Dokumentasinya Baik

WooCommerce memiliki dokumentasi dan petunjuk yang komprehensif karena sudah meliputi setup, SSL, snippert, theming, dan sebagainya.

7. Memiliki Banyak Extension Gratis dan Berbayar

Banyaknya extension gratis dan berbayar dapat mempermudah pekerjaan developer karena Anda dapat melakukan kustomisasi WooCommerce menggunakan berbagai macam fitur dan integrasi.

Langkah-langkah Memulai WooCommerce

Memilih Hosting

Anda perlu memilih jasa provider hosting karena Anda hanya bisa menjalankan WooCommerce di WordPress site yang self-hosted. Anda harus memilih yang aman, cepat, dan handal serta memiliki jaminan customer support 24 jam agar kendala pada website e-commerce Anda dapat segera teratasi tanpa merugikan aspek bisnis Anda. Anda dapat mempercayakan jasa provider hosting Anda ke Jetorbit sebagai penyedia hosting. Jetorbit telah berdiri sejak 2012, menyediakan berbagai macam paket hosting yang bisa Anda gunakan dengan harga terjangkau.

Menginstal WordPress

Untuk menginstal WordPress, Anda bisa mengikuti panduan kami disini cara install wordpress di cpanel. Mengapa WordPress? Karena berbagai provider hosting telah mengintegrasikan diri secara baik dengan WordPress dan tentunya bisa diintegrasikan dengan sangat baik bersama WooCommerce.

Melakukan Aktivasi WooCommerce

Lakukan langkah-langkah di bawah ini untuk melakukan instalasi WooCommerce:

  • Login ke admin dashboard WordPress Anda dengan akses ke https://domainnya.com/wp-admin. Selanjutnya masuk ke Plugins => Add New
  • Bagi Anda yang ingin mengetahui lebih detail terkait pengertian plugin, fungsi serta cara kerja plugin, bisa klik di sini

  • Ketik WooCommerce pada form pencarian (search plugins), lalu tekan Enter. Klik Install Now

  • Apabila proses install telah berhasil maka akan diarahkan ke halaman berikutnya. Selanjutnya, klik Activate

  • Anda akan menerima notifikasi di bawah ini apabila plugin telah aktif.
  • Apabila  ingin mengetahui instruksi mengenai cara install plugin WP, Anda bisa melihat di sini

  • Setelah menginstall dan mengaktifkan WooCommerce, dapat dilanjutkan ke klik Run the Setup Wizard atau panduan penginstallan.

Di bagian Store Setup, WooCommerce akan secara otomatis membuat halaman-halaman penting seperti lokasi negara, alamat, kota, kode pos, currency, tipe produk yang akan dijual. Setelah Anda isi semua, klik Let’s go!

  • Di bagian Payment, silakan Anda atur apakah Anda ingin proses pembayaran melalui bank transfer, COD, atau yang lain. Setelah itu klik Continue

  • Di bagian Shipping, Anda dapat mengatur Shipping Zones, Shipping Method. Pilih kilograms sebagai satuan berat dan pilih centimeters sebagai satuan dimensi. Setelah itu klik Continue.

  • Di bagian Recommended, klik Continue

  • Di bagian Activate, klik Continue with Jetpack

  • Anda isi username dan password, lalu klik Create your account

Your Store is Ready 😊..!

Bila bagian di bawah ini sudah tampil maka artinya Anda sudah berhasil membuat toko online dengan WordPress dan WooCommerce.

Anda klik Review Settings. Di sini, pertama Anda setting General lalu akan mengisi informasi untuk toko online Anda, seperti alamat, negara, pajak, dan lain-lain. Perhatikan gambar di bawah untuk settingnya dan silakan ikuti contoh lalu Save Changes.   

Selanjutnya adalah setting Products. Tahap ini Anda akan melakukan setting untuk informasi produk, seperti weight, dimensi, dan sebagainya. Silakan ikuti contoh lalu Save Changes.   

Selanjutnya, Anda akan ke setting Tax. Masuk ke Tax => Tax Options. Di sini, Anda akan melakukan setting pada Tax (Pajak) yang berlaku (apabila Anda terapkan di toko online Anda). Namun apabila tidak maka silakan abaikan saja. Silakan ikuti contoh lalu Save Changes.   

Selanjutnya, ke bagian Shipping. Di sini Anda dapat mengatur Shipping Zones termasuk add shipping method. Silakan ikuti contoh lalu Save Changes.

Selanjutnya, Anda lakukan setting untuk pembayaran. Untuk bagian Payment methods, silakan pilih sesuai dengan kebutuhan, misal Transfer Via Bank. Lalu klik Save Changes.

Selanjutnya, Anda lakukan setting untuk Accounts and Privacy. Jika sudah selesai lalu klik Save Changes.

Selanjutnya di bagian Emails, di sini Anda dapat mengganti desain email sendernya. Jadi, ketika si pembeli berhasil melakukan Checkout maka email invoicenya akan terkirim otomatis ke email si pembeli. Itulah fungsi desain ini.

Cara Menambah Produk Baru di WooCommerce

Cara menambah produk baru setelah menginstal plugin WooCommerce sangat mudah. Yuk, ikuti cara di bawah ini:

  • Di bagian Products pilih Add New

  • Selanjutnya, silakan isi Product name

  • Anda dapat membuat kategori produk Anda di bagian Product categories. Misal, di sini kami mencontohkan kategori Abaya. Lalu di Product image, Anda klik dan pilih gambar yang akan Anda jual.

Setelah memilih gambar di bagian Upload Files, Anda isi di kolom bagian kanan gambar sesuai kebutuhan, seperti Title (nama file & harus diubah menjadi judul yang deskriptif dari gambar), Caption (teks yang secara sederhana ditampilkan di bawah gambar), Description (deskripsi atau penjelasan detail serta lebih panjang terkait gambar yang ditampilkan). Setelah itu Anda klik Set product image

  • Langkah selanjutnya adalah bagian Product data. Anda akan mengisi informasi produk yang ingin Anda jual. Di bagian ini, Anda bisa mengklasifikasikan setiap produk, baik itu produk Virtual (tipe produk yang tidak perlu pengiriman) atau Downloadable (produk digital yang bisa di-download, seperti ebook). Centang masing-masing opsi jika produk Anda memang virtual maupun downloadable.

Kemudian di bagian dropdown, Anda dapat memilih tipe produk

  • Simple Product: jika Anda menjual satu jenis produk saja. Produk ini biasanya apapun yang berbentuk fisik dan bisa dikirim ke alamat, contohnya adalah Abaya
  • Grouped Product: kumpulan dari beberapa produk yang bisa dibeli secara terpisah/satuan, misalnya satu set piring
  • External/Affiliate Product: produk afiliasi, seperti Amazon yang dijual di toko online Anda dan apabila nanti pengunjung membelinya, mereka akan diarahkan ke website eksternal tersebut untuk melanjutkan pesanan.
  • Variable Product: Satu produk memiliki banyak variasi, entah itu warna dan ukuran yang variatif.
  • Selanjutnya adalah di bagian General. Anda masukkan juga regular price dan sale price di masing-masing kotak yang tersedia. Regular price mengindikasikan harga normal produk tersebut sementara sale price merupakan harga jual ketika ada diskon (bila ada). Anda bisa membuat jadwal sale price dengan tombol yang tersedia (diskon dari kapan hingga kapan). Anda juga bisa mengisi Tax status dan Tax class.
  • Kemudian ke bagian Inventory. Bagian ini secara khusus mengatur tentang inventori produk tersebut. Silakan isi Stock Keep Unit (SKU) produk Anda jika ada, centang opsi Manage Stock jika Anda ingin mengelola stok .

Centang opsi Sold individually jika Anda hanya ingin menjual 1 barang perproduk tersebut. Mencentang opsi ini artinya Anda hanya memperbolehkan pembeli untuk membeli satu barang dalam sekali pembelian atau pemesanan.

  • Selanjutnya ke bagian Shipping. Anda perlu memperhatikan detailnya sebagai berikut:
  • Weight: isi dengan berat produk tersebut (dalam satuan yang tadi sudah ditentukan)
  • Dimensi: dimensi produk tersebut yakni panjang x lebar x tinggi
  • Shipping Class: digunakan untuk mengelompokkan metode pengiriman barang untuk koleksi produk tertentu
  • Kemudian kita ke bagian Linked products. Anda dapat sekaligus mempromosikan produk lain ketika seorang pelanggan melihat produk ini. Anda dapat menjual produk serupa dengan harga yang lebih mahal atau menghubungkannya dengan produk setipe lainnya. Anda dapat mencari produk tersebut di bagian Upsells dan Cross-sells. Berikut ini adalah detailnya:
  • Upsells:Produk yang ditentukan di bagian ini akan tampil di halaman produk dan umumnya digunakan untuk mendorong pelanggan agar membeli produk tersebut (biasanya lebih mahal). Misal, Anda menjual Abaya A seharga Rp 180.000 dan produk yang Anda pilih di Upsells merupakan Abaya B yang dijual seharga Rp 200.000. Ketika halaman Abaya A dibuka maka Abaya B juga akan tampil sehingga pelanggan kemungkinan akan membeli produk yang harganya lebih mahal sekaligus dengan produk yang ia lihat.
  • Cross-sells: Produk yang ditentukan sebagai Cross-sells umumnya akan terlihat di halaman Cart atau keranjang belanjaan. Misal, pelanggan memasukkan produk handphone ke keranjang belanjaan mereka. Produk yang biasanya dikategorikan dalam Cross-sells adalah produk terkait seperti screenguard, power bank, batre, dan sebagainya.
  • Selanjutnya kita ke bagian Attributes. Di bagian ini Anda dapat memberikan detail lebih lengkap tentang produk Anda. Bahkan bisa dijadikan sebagai bagian dari variasi produk (Variable product di bagian Product data).

Misal, di bagian Custom product attribute, silahkan Anda klik tombol Add. Silakan isi kotak Name dengan jenis atribut yang ingin Anda gunakan sebagai variasi produk. Dan di bagian Value(s), isi dengan detailnya dan pisahkan dengan tanda “|” (tanpa tanda kutip).

Misal, saya menggunakan atribut Warna. Di bagian Value(s) saya mengisi warna apa saja yang terdapat pada produk saya. Pisahkan dengan tanda “|” tanpa tanda kutip bila Anda memiliki lebih dari satu value.

Kemudian kita ke bagian Advanced. Berikut ini penjelasan detailnya:

Purchase note: isi dengan catatan khusus (opsional), yang akan dikirimkan kepada pembeli setelah mereka membeli produk tersebut.

Menu order: kustomisasikan urutannya.

Enable Reviews: centang apabila Anda membolehkan pembeli untuk memberikan review terhadap produk tersebut.

Lalu kita menuju ke Product short description. Berbeda dengan deskripsi panjang di bagian awal. Di bagian ini, Anda hanya perlu mengisi detail tentang produk Anda secara ringkas.

Setelah itu, Anda dapat klik Preview untuk melihat hasil dari data-data yang Anda isikan.

  • Selanjutnya, Anda dapat langsung klik Publish (jika Anda sudah yakin) untuk melihat tampilan produk Anda  atau Save Draft (jika sekiranya masih ada yang ingin Anda tambahkan).

Cara Mengganti Themes di WooCommerce

Kali ini kami akan menggunakan tema Storefront. Tema tersebut merupakan tema gratis dan sekaligus tema perdana dari plugin WooCommerce. Sebaiknya Anda mencoba menggunakan tema ini sebelum Anda mencoba tema lain.

Sebelum Anda mencoba tutorial berikut ini, pastikan tema Storefront telah terinstal pada WordPress Anda. Apabila belum maka Anda dapat mendownload tema Storefront lalu mengaktifkannya. Anda dapat mendownload tema Storefront melalui https://id.wordpress.org/themes/storefront/.

Cara mengganti themes WooCommerce sangatlah mudah. Yuk, ikuti cara di bawah ini:

  • Aktifkan Tema Storefront yang telah Anda download dengan klik Appearance => Themes => Add New => Upload Theme

  • Setelah klik Upload Theme, Anda klik Choose File dan cari di folder mana Anda menyimpan hasil Anda mendownload Storefront. File Storefront yang didownload berbentuk .zip. Lalu klik Install Now.

  • Setelah proses penginstalan selesai, akan muncul suatu notifikasi seperti terlihat pada gambar di bawah ini. Lalu Anda klik Activate.

  • Kemudian akan muncul notifikasi untuk meload file demo tema storefront seperti gambar di bawah ini. Centang opsi yang ditawarkan lalu klik Let’s go! 

  • Untuk memperindah design toko online, Anda pun dapat menyesuaikan tema dengan kustomisasi selera Anda.

  • Selamat mencoba Tema Storefront WooCommerce.

 

Eits, jangan salah. Selain menggunakan tema Storefront yang sudah Anda download, Anda pun bisa mengganti tema atau themes dari WooCommerce dengan cara search.

Langkah-langkahnya dengan cara berikut ini:

  • Login WordPress

          Anda login ke WordPress dengan buka https://domainnya.com/wp-admin. Lalu masukkan username dan password.

  • Setelah masuk ke dashboard WordPress, silakan pilih menu Appearance => Themes => Add Themes. Untuk mengganti tema WordPress, silahkan Anda ketik tema yang Anda inginkan di kotak search.

  • Setelah menemukan tema yang cocok, Anda klik saja Install lalu klik Activate.

  • Selanjutnya Anda akan mendapatkan notifikasi bahwa tema WooCommerce sudah aktif dan dapat digunakan.

Cara Install Plugin Hitung Ongkos Kirim di WooCommerce

Tentunya Anda ingin proses hitung onkos kirim secepat kilat agar tidak memperlambat kinerja toko online Anda. Betul? Nah, di sini kami akan memandu Anda untuk install plugin untuk menghitung ongkis kirim melalui search saja. Kali ini kami akan menggunakan plugin ongkoskirim.id.

Langkah-langkahnya dengan cara berikut ini:           

  • Login WordPress

          Anda login ke WordPress dengan buka https://domainnya.com/wp-admin. Lalu masukkan username dan password.

  • Setelah masuk ke dashboard WordPress, silakan pilih menu Plugins => Add New.

  • Ketik ongkoskirim.id di kotak search plugins. Lalu Anda klik Install Now.

  • Selanjutnya Anda klik Activate.

  • Jika proses install berhasil maka Anda akan mendapatkan notifikasi bahwa plugin berhasil diinstall.

  • Selanjutnya, Anda klik menu WooCommerce lalu Settings kemudian klik bagian submenu Shipping.

  • Setelah Anda klik Shipping, selanjutnya klik id untuk melakukan pengaturan selanjutnya.

  • Untuk pilihan Enable, harus anda centang agar dapat digunakan. Selanjutnya untuk pilihan Choose Expedition, Anda dapat memilih sesuai yang tersedia di kota Anda atau sesuai dengan keinginan Anda untuk menggunakan ekspedisi mana.

  • Untuk pilihan Store Location, Anda isi sesuai dengan lokasi pengiriman produk Anda. Untuk pilihan-pilihan di bawahnya merupakan optional. Setelah semua Anda isi lalu selanjutnya klik Save changes.

Jika Anda sudah berhasil melakukan pengaturan sampai langkah terakhir maka Anda sudah bisa melihat hasil penghitungan ongkos kirim saat ada transaksi pembelian dari konsumen Anda.

Bagi Anda yang membutuhkan aplikasi POS (Point of Sale), Anda pun dapat menginstal di WordPress dengan plugin WooCommerce POS. Lihat cara instal di sini.

 

Semoga bermanfaat dan jangan lupa bagikan ke teman-teman Anda 😊

Yuk isi komentar dibawah ini dengan saran dan kritik kamu, agar kami bisa menambah dan atau menyesuaikan tutorial Membuat Website Toko Online Dengan WordPress dan Woocommerce ini dengan lebih baik lagi

6 Responses

  1. WAAAHHHHH MANTAP

    Tutorial mudah dimengerti mudah diterapkan. Adminnya smart dan baik hati mau nunjukin sampai detail, semoga suksess !!

Leave a Reply

Your email address will not be published. Required fields are marked *

whatsapp jetorbit