Cara Membuat Halaman WooCommerce: 2 Metode

Apakah Anda ingin menambahkan halaman ke toko Anda tetapi Anda tidak yakin bagaimana melakukannya? Dalam panduan ini, kami akan menunjukkan kepada Anda berbagai cara untuk membuat halaman WooCommerce langkah demi langkah (tidak perlu pengkodean).

WooCommerce memberi Anda fleksibilitas untuk menambahkan halaman untuk menyesuaikan toko online Anda. Anda dapat membuat semua halaman WooCommerce default atau halaman kustom. Sebelum kami menunjukkan cara melakukannya, mari kita lebih memahami manfaat membuat atau menginstal ulang halaman.

Mengapa Membuat atau Menginstal Ulang Halaman WooCommerce?

Salah satu alasan paling umum mengapa pengguna membuat halaman WooCommerce adalah karena mereka kehilangan beberapa halaman. Saat Anda mengatur WooCommerce, sebagian besar halaman default dibuat secara otomatis. Namun, jika Anda melewatkan beberapa langkah, Anda dapat mencegah WooCommerce membuat semua halaman yang dibutuhkan toko online Anda. Jika itu kasus Anda, kabar baiknya adalah Anda dapat dengan mudah menambahkan halaman tersebut.

Beberapa halaman WooCommerce yang harus Anda buat jika tidak ada di toko Anda adalah:

• Halaman Toko: Halaman Toko adalah tempat Anda menampilkan semua produk toko online Anda. Seperti yang dapat Anda bayangkan, ini dapat berdampak besar pada bisnis Anda sehingga harus dimiliki oleh toko online mana pun. Jika Anda mencari cara untuk menyesuaikan halaman toko Anda, Anda dapat melihat panduan ini.

• Halaman Keranjang: Ketika seorang pelanggan ingin membeli produk dari halaman toko, mereka disimpan di halaman keranjang. Di sinilah pembeli dapat meninjau pesanan mereka sebelum membayar. Beberapa plugin menyertakan halaman keranjang langsung di kasir untuk menyederhanakan proses pembayaran dan meningkatkan konversi.

• Halaman Checkout: Ini adalah tempat pengguna membayar produk mereka dan Anda menutup penjualan. Setelah memilih produk dari halaman toko dan meninjau pesanan di halaman keranjang, pelanggan membayar melalui gateway pembayaran di halaman checkout. Kemudian, pesanan ditempatkan dan proses pengiriman dimulai (jika itu produk fisik). Seperti disebutkan di atas, plugin seperti Direct Checkout menyertakan halaman cart di halaman checkout untuk mempercepat proses pembelian.

• Halaman Akun Saya: Halaman Akun Saya adalah tempat Anda menyimpan semua informasi pribadi pelanggan, tagihan, dan alamat pengiriman. Dari sini pembeli dapat mengelola pesanan dan pengaturan mereka.

Cara Membuat Halaman WooCommerce

Ada beberapa cara berbeda untuk membuat halaman WooCommerce:

1. Dari dasbor WordPress
2. Dengan kode pendek

Kedua metode memungkinkan Anda untuk menambahkan halaman dengan mudah. Dalam panduan ini, kita akan melihat keduanya sehingga Anda dapat memilih opsi terbaik untuk Anda.

1. Cara Membuat Halaman WooCommerce dari dasbor WordPress

Dari dasbor WordPress, Anda dapat membuat semua halaman WooCommerce default atau halaman Toko. Kami akan menjelaskan kedua skenario di bawah ini.

1. Buat Semua Halaman WooCommerce Default

Membuat dan menginstal halaman WooCommerce default dari dashboard WordPress sangat mudah dan hanya membutuhkan beberapa klik.

Pertama, buka WooCommerce > Status . Kemudian, di bawah tab Alat , Anda akan melihat opsi untuk membuat halaman WooCommerce default. Cukup klik tombol Buat Halaman untuk menambahkan halaman yang hilang ke toko Anda.

CATATAN: Perlu diingat bahwa Anda hanya akan membuat halaman yang hilang dan Anda tidak akan mengganti halaman default yang sudah ada di toko Anda.

Misalnya, Anda memiliki toko online dengan halaman Toko, Keranjang, dan Checkout tetapi halaman Akun Saya tidak ada. Jika Anda menekan Buat halaman , itu hanya akan menambahkan halaman Akun Saya tanpa menyentuh semua halaman lainnya. Itu dia! Anda baru saja membuat halaman WooCommerce yang hilang dari toko Anda .

2. Buat Halaman Toko dari Dasbor WordPress

Membuat halaman Toko dari dashboard WordPress juga cukup mudah.

Yang perlu Anda lakukan adalah pergi ke Pages > Add New di dashboard Anda. Kemudian, tambahkan judul Toko ke halaman dan tekan Terbitkan .

Lalu, buka WooCommerce > Pengaturan dan arahkan ke tab Produk . Klik pada opsi halaman Toko, pilih halaman Toko yang baru saja Anda buat dari menu tarik-turun dan simpan perubahannya.

Itu dia! Anda akan melihat halaman Toko default setelah Anda melihat pratinjau halaman tersebut. Halaman tersebut akan secara otomatis menampilkan semua produk yang Anda daftarkan untuk toko online Anda.

2. Cara Membuat Halaman WooCommerce dengan Shortcode

Membuat halaman WooCommerce dari dasbor WordPress itu mudah tetapi ada cara lain yang nyaman untuk menambahkan halaman ke toko Anda. Metode ini melibatkan penggunaan kode pendek. Kode pendek adalah cuplikan kecil yang membantu Anda menampilkan konten atau menambahkan fungsionalitas tanpa menulis skrip kode yang panjang. Jika Anda tidak terbiasa dengan kode pendek, kami sarankan Anda melihat panduan lengkap ini untuk pemula.

WooCommerce menyertakan kode pendek default yang memberi Anda lebih banyak fleksibilitas untuk menambahkan halaman ke toko Anda dibandingkan dengan metode sebelumnya.

Untuk membuat halaman WooCommerce menggunakan shortcode, yang perlu Anda lakukan adalah pergi ke Pages > Add New, tambahkan judul halaman yang ingin Anda buat, dan gunakan shortcode yang sesuai. Mari kita lihat beberapa contoh.

1. Halaman Keranjang

Untuk menambahkan halaman keranjang, buat halaman baru, beri nama “Keranjang”, tambahkan kode pendek berikut, dan publikasikan

 [ woocommerce_cart ] 

Setelah itu, buka WooCommerce > Pengaturan dan buka tab Lanjutan . Kemudian, pilih halaman Cart yang baru saja Anda buat untuk opsi halaman Cart dan simpan.

Itu saja, sekarang Anda akan menampilkan produk yang ada di keranjang pembeli Anda di halaman Keranjang yang baru saja Anda buat.

2. Halaman Checkout

Demikian pula, jika Anda ingin membuat halaman checkout WooCommerce default, cukup buat halaman baru dan beri nama "Checkout". Kemudian, tambahkan kode pendek berikut dan publikasikan halaman.

 [ woocommerce_checkout ] 

Sekali lagi, buka WooCommerce > Settings dan buka tab Advanced . Setelah itu, pilih halaman checkout yang baru saja Anda buat sebagai opsi untuk halaman Checkout dan simpan perubahannya.

Halaman checkout default tidak apa-apa, tetapi jika Anda ingin menonjol dan meningkatkan tingkat konversi Anda, Anda harus menyesuaikannya. Jika itu kasus Anda, lihat panduan kami tentang cara mengedit halaman checkout WooCommerce.

3. Halaman Akun Saya

Untuk membuat halaman Akun Saya WooCommerce, yang perlu Anda lakukan hanyalah membuat halaman baru, beri nama “Akun Saya”, lalu tambahkan kode pendek berikut.

 [ woocommerce_my_account ] 

Setelah itu, buka WooCommerce > Pengaturan dan buka tab Lanjutan . Terakhir, pilih halaman Akun Saya yang baru saja Anda buat sebagai opsi untuk halaman Akun Saya dan simpan perubahannya.

Jika Anda ingin membumbui halaman Akun Saya, lihat panduan langkah demi langkah kami tentang cara menyesuaikannya.

Ini dia, begitulah cara Anda membuat halaman WooCommerce menggunakan kode pendek . Pendek dan manis, bukan?

Sejauh ini, kami telah menunjukkan kepada Anda berbagai cara tentang cara menambahkan halaman ke toko Anda. Tapi, itu baru langkah pertama. Untuk membawa toko Anda ke tingkat berikutnya, Anda perlu menyesuaikan halaman Anda dan memanfaatkannya sebaik mungkin. Mari kita lihat bagaimana melakukannya.

Cara Menyesuaikan Halaman WooCommerce

Fitur WooCommerce default memiliki opsi yang sangat terbatas dalam hal menyesuaikan halaman. Mereka tidak memiliki opsi tambahan untuk beberapa elemen penting seperti tombol dan opsi bidang. Jadi untuk memaksimalkan toko Anda, Anda harus membuat beberapa perubahan pada halaman Anda.

Berita baiknya adalah menyesuaikan halaman WooCommerce semudah membuatnya. Dalam posting ini, kami akan menunjukkan cara mengedit halaman menggunakan plugin.

Untuk tutorial ini, kita akan menggunakan StoreCustomzier. Ini adalah alat freemium yang sangat mudah digunakan untuk mengedit halaman WooCommerce Anda. Plugin ini menggunakan antarmuka seret dan lepas yang ramah pengguna yang membantu Anda mengedit halaman dengan nyaman.

1. Instal Plugin

Pertama, Anda perlu menginstal dan mengaktifkan StoreCustomizer. Di dasbor WordPress Anda, buka Plugin > Add new dan cari StoreCustomizer. Kemudian, klik Instal Sekarang dan aktifkan plugin.

2. Buka Penyesuai Tema

Sekarang Anda dapat menyesuaikan halaman apa pun. Buka penyesuai dari Appearance > Customize dan Anda akan diarahkan ke penyesuai tema. Untuk demonstrasi ini, kami akan menggunakan Storefront tetapi perlu diingat bahwa opsi tema dapat bervariasi dari satu tema ke tema lainnya. Sekarang, tekan StoreCustomizer untuk menyesuaikan halaman WooCommerce.

Di sini, Anda dapat mengedit semua halaman utama toko online Anda:

• Toko
• Produk
• Akun saya
• Keranjang
• Periksa

Sekarang saatnya untuk mulai mengedit halaman Anda.

3. Sesuaikan Halaman WooCommerce

Anda dapat membuat perubahan apa pun pada sejumlah halaman WooCommerce bersama dengan banyak opsi yang dapat disesuaikan.

Saya. Halaman Toko

Di sini, Anda dapat mengedit jumlah produk per baris atau halaman. Selain itu, Anda dapat mengedit arsip toko dan elemen desain, serta menyesuaikan teks tombol halaman. Selain itu, Anda dapat menambahkan spanduk, lencana, dan mengedit judul produk, harga, tombol, dan banyak lagi.

ii. Halaman Produk

Anda dapat menghapus berbagai elemen seperti zoom gambar, lightbox, dan penggeser gambar untuk halaman produk. Selanjutnya, Anda juga dapat mengatur jumlah thumbnail gambar produk per baris bersama dengan opsi tambahan untuk mengedit tab halaman produk dan elemen desain. Misalnya, Anda dapat mengedit atau menghapus tab Halaman Produk, menambah atau mengedit tombol, menyertakan spanduk, dan lainnya.

aku aku aku. Halaman Akun

Untuk halaman Akun, Anda dapat mengubah beberapa tab akun. Ini termasuk dasbor, unduhan, pesanan, alamat, detail, dan keluar. Anda juga dapat memilih desain tab akun dengan tab samping dan gaya horizontal.

iv. Halaman Keranjang

Ada beberapa opsi yang dapat disesuaikan untuk halaman keranjang juga. Anda dapat menambahkan tombol 'Kembali ke toko', menampilkan diskon, menambahkan informasi produk tambahan, dan menghapus tautan produk. Selain itu, Anda juga mendapatkan beberapa opsi tambahan untuk cross-sell dan alat keranjang, halaman keranjang kosong, dan elemen desain.

v. Halaman Checkout

StoreCustomizer juga memungkinkan Anda untuk menyesuaikan halaman checkout. Anda dapat menambahkan gambar khusus, mengedit atau menghapus bidang checkout dan menyesuaikan elemen desain. Jika Anda ingin melangkah lebih jauh, Anda dapat menggunakan plugin khusus untuk menyesuaikan halaman checkout seperti Manajer Checkout untuk WooCommerce dan Direct Checkout.

Ini hanya beberapa hal yang dapat Anda lakukan di halaman WooCommerce Anda dengan plugin ini. Namun, jika Anda ingin lebih menyesuaikan toko Anda dan membawanya ke tingkat berikutnya, kami sarankan Anda melihat beberapa panduan kami tentang cara mengedit setiap halaman tertentu:

• Cara menyesuaikan Halaman Toko WooCommerce
• Edit halaman checkout di WooCommerce
• Cara menyesuaikan Halaman Akun Saya WooCommerce
• Kustomisasi Halaman Produk WooCommerce

Kesimpulan

Secara keseluruhan, kami telah menunjukkan kepada Anda berbagai cara untuk membuat dan menginstal ulang beberapa halaman WooCommerce. Jika ada halaman Anda yang hilang, Anda dapat menambahkan atau memasangnya kembali.

Dalam panduan ini, kami telah menjelaskan dua metode untuk melakukannya:

• Dari dasbor WordPress
• Menggunakan kode pendek

Kedua metode ini sangat efektif dan mudah digunakan bahkan untuk pemula. Membuat halaman dari dasbor adalah opsi tercepat, tetapi jika Anda menginginkan lebih banyak fleksibilitas, Anda dapat menggunakan kode pendek.

Selain itu, karena WooCommerce memiliki opsi penyesuaian terbatas untuk halaman default, kami telah melihat salah satu cara termudah untuk menyesuaikan halaman Anda menggunakan StoreCustomizer. Plugin ini adalah aplikasi serba bisa yang memungkinkan Anda mengedit halaman apa pun. Namun, jika Anda ingin melakukan penyesuaian yang lebih kompleks pada halaman tertentu, kami sarankan Anda melihat beberapa panduan kami.

Terakhir, jika Anda ingin menyesuaikan halaman WooCommerce menggunakan Divi dan Elementor, lihat postingan berikut:

• Cara menyesuaikan halaman produk dengan Divi
• Sesuaikan halaman produk dengan Elementor

Apakah menurut Anda panduan ini berguna? Metode mana yang Anda gunakan untuk membuat halaman untuk toko Anda? Apakah Anda tahu cara lain? Beri tahu kami di bagian komentar di bawah.