Tutorial & Panduan WooCommerce untuk Pengguna Tema Flatsome

Tema toko Anda adalah salah satu elemen paling penting yang membantu mempertahankan minat pengunjung. Ketika datang ke tema untuk toko WooCommerce Anda, ribuan opsi tersedia. Tapi, Anda harus memilih tema multiguna dengan kemampuan kustomisasi tinggi. Salah satu tema WordPress WooCommerce tersebut adalah Flatsome.

Lebih lanjut tentang tema Flatsome

Flatsome adalah salah satu tema WordPress WooCommerce paling populer dan berperingkat teratas di repositori tema ThemeForest. Ini dirancang dan dikembangkan oleh UX Themes. Tujuannya adalah untuk merancang tema khusus yang mudah digunakan dan sempurna untuk pemula dan non-coders.

Meskipun Flatsome adalah tema multi-tujuan yang berfokus pada WooCommerce, ini dapat digunakan untuk membangun situs web apa pun. Dengan menggunakan tema ini, Anda dapat membuat situs blog, situs portofolio pribadi, situs perusahaan, dan banyak lagi.

Statistik di BuiltWith menunjukkan lebih dari 500 ribu situs web langsung dikembangkan menggunakan Flatsome. Alasan di balik popularitas yang begitu besar tidak lain adalah kedahsyatan fitur tema dan pengalaman pengguna yang fantastis. Cepat, ringan, mudah digunakan, dan dibuat khusus untuk pengguna non-teknis.

Tema ini hadir dengan demo yang dirancang dengan indah untuk membuat situs web dengan cepat. Jadi, memilih tema Flatsome untuk toko situs web WooCommerce Anda adalah ide yang bagus.

Tim WPCred telah lama menulis tutorial yang berfokus pada Flatsome. Kami telah membahas 40+ tutorial penting tentang berbagai topik Flatsome. Beberapa dari mereka sepenuhnya menggunakan tema Flatsome, dan yang lainnya menggunakan plugin atau alat pihak ketiga. Mari masuk ke tutorial tema Flatsome WooCommerce.

Beli Tema Flatsome

1. Apakah Flatsome Tema WooCommerce Terbaik?

Flatsome adalah tema WooCommerce multiguna yang dipercaya oleh lebih dari 200.000 pemilik situs. Ini adalah tema yang sangat cepat dengan pengalaman pengguna yang luar biasa. Selain itu, ia menawarkan desain yang indah, mendukung perangkat apa pun, dan telah memperkenalkan fitur unik.

Selain itu, Flatsome telah mengurangi file JavaScript intinya menjadi 56kb, yang membuatnya sangat dioptimalkan. Anda dapat mempelajari seluk beluknya dengan membaca analisis mendalam kami tentang ulasan Flatsome .

2. Hosting WooCommerce Berkualitas

Situs Anda tidak akan menjadi lebih cepat jika dihosting di server yang buruk. Kinerjanya tergantung pada kualitas hosting. Ada ratusan penyedia hosting WooCommerce untuk dipilih. Memilih hosting terbaik untuk WooCommerce akan membuat pengaturan dan pengelolaan toko Anda menjadi lebih mudah.

3. Instalasi tema datar

Memasang tema Flatsome WooCommerce sangat mudah. Kunjungi ThemeForest dan beli tema Flatsome (jika Anda belum membelinya). Setelah itu, unduh file dan unggah ke dashboard WordPress Anda. Kemudian instal dan aktifkan dengan menggunakan kunci lisensi. Kunjungi tautan cara menginstal Flatsome di WordPress seperti demo Flatsome resmi .

4. Buat Tema Anak

Dengan tema anak, Anda dapat mengubah tampilan situs web Anda tanpa mengedit file tema Anda secara langsung. Itu berarti Anda dapat mengetahui cara memperbarui tema WordPress tanpa kehilangan penyesuaian apa pun . Saat Anda mengaktifkan tema Flatsome untuk pertama kalinya, akan ada opsi untuk membuat tema anak dan Anda juga dapat mengetahui cara membuat tema anak Flatsome di WordPress dengan mudah, dan menggunakannya untuk membuat tema anak baru.

5. Pengaturan Penyesuai Tema Induk ke Tema Anak

Saat menggunakan tema anak di Flatsome, Anda mungkin perlu menyalin pengaturan penyesuai dari tema induk ke tema anak . Ini adalah proses langsung yang membutuhkan beberapa langkah. WordPress melihat tema anak Anda sebagai tema baru. Jadi, tanpa melakukannya, Anda mungkin kehilangan penyesuaian tema induk saat beralih ke tema anak.

6. Buat Website Satu Halaman Menggunakan Flatsome

Seperti yang telah kita bahas, Flatsome adalah tema multiguna yang dapat Anda gunakan untuk membuat toko online di hampir semua niche. Saat ini, situs web satu halaman sedang tren karena berbagai alasan. Flatsome juga menawarkan fitur khusus bernama “Flatsome Studio” untuk membantu Anda mengetahui cara membuat situs web satu halaman secara gratis.

7. Gunakan Flatsome Studio Untuk Membuat Toko Online

Flatsome Studio adalah perpustakaan digital ekstensif gratis dengan gambar, bagian yang telah dirancang sebelumnya, dan tata letak. Anda cukup mengimpor dan menggunakannya hanya dalam beberapa klik. Mengimpor elemen baru, Anda dapat menggunakan studio Flatsome di WordPress dan memilih dari lebih dari 100+ elemen.

8. Unggah Logo Anda

Logo adalah dasar dari identitas merek Anda. Tapi begitu tema diaktifkan, Anda akan melihat logo Flatsome di situs Anda secara default. Namun, Anda dapat dengan mudah menunjukkan branding perusahaan Anda dan mengunggah logo Flatsome di situs web WooCommerce.

9. Buat Menu Mega di Flatsome

Setelah memilih logo, saatnya untuk mengatur menu. Pengunjung situs Anda akan selalu ingin memiliki akses mudah ke setiap halaman di toko Anda. Anda perlu membantu mereka dengan cepat menemukan apa yang mereka inginkan, itu sebabnya Anda mungkin memerlukan menu mega. Anda dapat membuat menu mega Flatsome dalam beberapa langkah.

10. Tambahkan Latar Belakang Video

Anda hanya mendapatkan beberapa detik untuk menarik perhatian pengunjung Anda. Latar belakang yang bergerak dapat langsung menarik pengunjung Anda. Flatsome memiliki fungsi bawaan yang memungkinkan Anda menambahkan latar belakang video untuk WordPress di spanduk video Flatsome .

11. Aktifkan Pengguliran Tak Terbatas di Halaman Toko

Gulir tanpa batas memastikan bahwa Anda dapat menggulir selama yang Anda inginkan. Lebih mudah untuk menelusuri lebih banyak produk hanya dengan menggulir ke bawah. Jadi, menambahkan gulir tak terbatas untuk WordPress di halaman toko Flatsome memberi Anda lebih banyak peluang bagi toko online Anda untuk mengoptimalkan pagination WooCommerce.

12. Tambahkan Lightbox ke Flatsome

Lightbox sering kali menyertakan ajakan bertindak (CTA) untuk meminta pengunjung mengambil tindakan. Ini cukup efektif untuk pemilik situs web dan pemasar karena beberapa alasan. Kode pendek lightbox memungkinkan Anda membuka konten apa pun di dalam lightbox dengan mengklik tombol atau item navigasi. Langkah-langkah menambahkan popup lightbox Flatsome ke WordPress sangatlah mudah.

13. Buat Pop-up Buletin Otomatis

Pop-up adalah cara yang bagus untuk berkomunikasi dengan pengunjung. Anda dapat menggunakannya untuk terhubung dengan lebih banyak pengunjung dan menjadikan mereka pelanggan potensial Anda. Selain itu, ini dapat membantu Anda dengan kampanye pemasaran email dan meningkatkan pengguna terdaftar di situs Anda. Flatsome memiliki fitur untuk membuat popup pendaftaran lightbox buletin otomatis dan Anda dapat mempelajari cara membuat sembulan buletin Flatsome dengan mengikuti beberapa langkah mudah . Ini akan menyoroti promosi Anda dan mendapatkan lebih banyak pelanggan ke buletin Anda.

14. Tetapkan Produk Unggulan

Produk Fitur membantu pengunjung Anda untuk melihat produk paling menarik dari toko WooCommerce Anda. Dengan menggunakan ini, Anda dapat menampilkan produk khusus Anda kepada pelanggan Anda. Ini bisa berupa produk Anda yang sedang tren atau populer, produk baru, atau beberapa produk sponsor yang ingin Anda tampilkan. Ada beberapa cara untuk mengatur produk unggulan dalam tema Flatsome WooCommerce. Anda dapat mengetahui cara mengatur produk unggulan di WooCommerce dari artikel ini.

15. Terapkan Pengiriman Gratis untuk Produk Tertentu

Pemilik toko WooCommerce menjalankan berbagai strategi untuk meningkatkan penjualan mereka. Di antara mereka, pengiriman gratis adalah strategi umum untuk menarik pelanggan. Flatsome menawarkan untuk mengatur pengiriman gratis WooCommerce untuk produk tertentu . Anda dapat menambahkan pengiriman gratis ke masing-masing produk, produk berbasis kategori tertentu, atau jenis produk lainnya.

16. Atur Daftar Keinginan dengan Benar

Biasanya, orang menghabiskan banyak waktu di situs web eCommerce. Saat mengunjungi situs untuk waktu yang lama, sangat umum kehilangan produk yang mereka putuskan untuk dibeli. Itulah mengapa daftar keinginan sangat penting untuk situs eCommerce Anda. Itu memastikan pelanggan Anda dapat menyimpan produk untuk dibeli nanti. Membuat daftar keinginan di Flatsome mudah diterapkan. Anda dapat menambahkannya ke situs web Anda tanpa melakukan pengkodean apa pun.

17. Buat Halaman Kesalahan 404 Kustom

Salah satu kesalahan paling umum di web adalah halaman kesalahan 404. Ini membuat frustrasi dan membingungkan pengunjung Anda. Halaman seperti ini tidak jelas dan tidak membantu pengguna tetap berada di situs. Anda tentu tidak ingin pengunjung mendarat di halaman kesalahan umum. Jika kebetulan pengunjung Anda menghadapi situasi seperti itu, jangan khawatir, Flatsome memiliki beberapa halaman kesalahan 404 kustom WordPress bawaan . Anda dapat memilih salah satu dari daftar dan memberi tahu pengunjung bahwa mereka masih berada di situs Anda.

18. Tambahkan Testimoni Pelanggan

Cara ampuh untuk membangun kepercayaan pembeli adalah dengan menambahkan testimonial pelanggan. Ini adalah ulasan positif yang paling sering ditinggalkan oleh pelanggan yang puas. Ada banyak cara berbeda untuk menambahkan testimonial pelanggan ke tema testimonial Flatsome dan Anda dapat dengan mudah mendesain testimonial Anda sendiri . Anda akan menemukan beberapa halaman testimonial yang telah ditentukan sebelumnya pada tema Flatsome untuk dipilih.

19. Buat Header Halaman Toko dengan UX Builder

Apa pun jenis produk yang Anda jual, halaman toko WooCommerce Anda adalah bagian penting dari toko Anda. Flatsome memungkinkan Anda menambahkan desain header halaman web dengan UX builder untuk membuat halaman toko Flatsome Anda lebih berguna dan menarik.

20. Buat Slider Menggunakan UX Builder

Penggeser dapat membantu Anda menampilkan produk dengan cara yang didekorasi dan ramah pengguna. Akibatnya, pengunjung Anda akan memiliki kesan yang lebih baik. Tema ini telah memudahkan untuk membuat slider Flatsome untuk WordPress menggunakan UX Builder .

21. Sesuaikan Halaman Produk WooCommerce

Produk fantastis Anda layak mendapatkan halaman produk WooCommerce khusus yang unik. Anda harus dapat menyesuaikan halaman produk WooCommerce untuk membuat toko e-niaga Anda menonjol. Pembuat UX Flatsome memberi Anda fleksibilitas desain untuk membuat dan menyesuaikan halaman produk khusus Anda secara visual.

22. Dapatkan Google Sitelinks dengan Cepat

Google Sitelinks adalah sub-daftar yang muncul di bawah hasil pencarian pertama, biasanya saat mencari merek. Tautan situs menghemat waktu dan memberikan hasil yang relevan bagi penelusur. Anda dapat mengikuti beberapa proses untuk meningkatkan peluang Anda mendapatkan tautan situs . Anda dapat mengetahui cara mendapatkan tautan situs google dalam beberapa langkah mudah.

23. Siapkan dan Instal Google Pengelola Tag

Google Pengelola Tag membantu membuat pengelolaan tag menjadi mudah, sederhana, dan andal dengan memungkinkan pemasar dan webmaster untuk menerapkan tag situs web di satu tempat. Anda dapat memeriksa tutorial kami jika Anda bertanya-tanya bagaimana cara mengatur dan menginstal Google tag manager WordPress .

24. Tambahkan Google Search Console

Google Search Console, sebelumnya dikenal sebagai Alat Webmaster, membantu Anda mengoptimalkan data untuk memantau kinerja situs web dalam pencarian. Manfaat Search Console membuatnya sangat diperlukan untuk meningkatkan kinerja penelusuran. Menyiapkan Google Search Console di situs Anda yang didukung Flatsome hanya membutuhkan beberapa menit tetapi memberi Anda manfaat seumur hidup. Anda dapat mengetahui cara menambahkan wawasan konsol pencarian Google WordPress

25. Tambahkan Google Analytics untuk Melacak Lalu Lintas Toko

Google Analytics adalah alat gratis oleh Google untuk melacak dan menganalisis pengunjung situs Anda. Selain itu, ini memberikan wawasan utama tentang apa yang dapat Anda lakukan untuk memenuhi tujuan Anda dan bagaimana kinerja situs web Anda. Jika Anda sudah mengetahui pentingnya, berikut adalah ikhtisar cara menambahkan google analytics dengan WordPress pada tema WooCommerce Flatsome Anda.

26. Tambahkan Google Recaptcha Ke Formulir Kontak 7

Plugin Formulir Kontak 7 sangat penting untuk situs web apa pun yang diberdayakan WordPress. Jika Anda menggunakannya di situs web Anda, Anda mungkin akan mulai mendapatkan posting spam melalui formulir Anda. Untuk mencegah kotak masuk Anda memiliki konten yang tidak perlu, Anda perlu menambahkan Recaptcha ke formulir kontak 7 .

27. Tambahkan Metadata Grafik Terbuka Facebook

Metadata grafik terbuka Facebook menawarkan Anda kendali atas tampilan konten Anda saat dibagikan di Facebook. Dibutuhkan metadata dari konten dan memungkinkan Anda memilih bagaimana hal-hal akan ditampilkan. Anda dapat mengikuti metode manual atau plugin untuk menambahkan metadata grafik pena ke situs web Flatsome Anda.

28. Buat Produk Variabel

Variabel di WooCommerce memungkinkan Anda memilih dari beberapa opsi. Ini dapat dengan mudah didefinisikan sebagai produk yang tersedia dalam beberapa warna, gaya, ukuran, dan banyak lagi. Menambahkan produk variabel WooCommerce dalam tema Flatsome sangatlah mudah.

29. Tambahkan Beberapa Variasi Gambar dan video

Beberapa gambar untuk suatu produk memudahkan pembeli untuk memilih produk. Namun, secara default, WooCommerce memungkinkan Anda untuk menambahkan hanya satu gambar per variasi produk. Namun, Galeri Gambar Variasi Tambahan untuk plugin WooCommerce memungkinkan Anda menampilkan produk dari sudut atau perspektif yang berbeda. Selain itu, Anda dapat menambahkan video ke galeri gambar produk WooCommerce Anda.

30. Tampilkan Variasi Swatch di Halaman Toko/Arsip

Secara default, WooCommerce menawarkan dropdown untuk produk variasi. Tapi dibutuhkan lebih banyak klik untuk melihat dan tidak memberikan pengunjung pengalaman yang mulus. Plugin WooCommerce Variation Swatches mengubah dropdown produk default menjadi swatch yang indah.

Menambahkan contoh warna WooCommerce adalah salah satu cara terbaik untuk membawa lebih banyak kehidupan ke produk Anda. Di sisi lain, atribut produk WooCommerce menyediakan cara yang menyenangkan untuk menampilkan variasi.

Atau, Anda mungkin ingin menyesuaikan swatch tombol radio untuk tujuan yang berbeda. Dibandingkan dengan dropdown tertentu, tombol radio lebih ramah pelanggan.

31. Terjemahkan Flatsome dengan Plugin Terjemahan Loco

Ada banyak lalu lintas situs web yang Anda kehilangan setiap hari karena situs web Anda tidak dapat diterjemahkan. Jika situs bertenaga tema Flatsome Anda perlu multibahasa, Anda dapat dengan mudah menerjemahkan dengan plugin Loco Translate , dan Anda dapat mengetahui cara menerjemahkan situs web ke dalam bahasa Inggris atau bahasa lain dengan plugin ini.

32. Nonaktifkan Ulasan di Flatsome

Tidak disarankan untuk menonaktifkan ulasan WooCommerce di sebagian besar situasi. Namun, ada beberapa alasan mengapa Anda dapat mempertimbangkan untuk menonaktifkan ulasan produk . Terkadang, sulit bagi pemilik toko untuk mengikuti spam di bagian ulasan produk.

33. Tambahkan Pengguna ke Tim Dukungan

WordPress memiliki sistem manajemen pengguna bawaan. Anda mungkin memiliki tim yang terdiri dari orang-orang yang bekerja sama untuk mengelola berbagai aspek situs Anda, seperti dukungan teknis, penulis konten, pakar SEO, dan banyak lagi. Platform ini memungkinkan Anda menambahkan pengguna baru di luar kotak dan memberikan berbagai peran dan izin. Anda bisa mendapatkan artikel tentang cara menambahkan pengguna ke WordPress dari sini.

34. Tambahkan Label Menu Pribadi Sendiri

Menu adalah cara umum untuk menjelajahi situs web Anda dengan mudah. Banyak tema WordPress hadir dengan lokasi dan tata letak menu yang telah ditentukan sebelumnya. Untungnya, Flatsome hadir dengan label menu siap pakai yang sangat bersih untuk menarik pengunjung. Juga, Anda membuat label menu pribadi Anda sendiri juga.

35. Tambahkan Ikon Pembayaran ke Footer

Situs web maksimum yang didukung Flatsome berbasis WooCommerce. Sebelum membeli produk dari toko online, pelanggan ingin tahu bagaimana mereka dapat membelinya. Jadi, memiliki ikon pembayaran yang didukung sangat penting. Beri tahu pelanggan Anda dengan menunjukkan ikon pembayaran di footer .

36. Nonaktifkan Tampilan Cepat Produk

Tampilan cepat produk menawarkan "tampilan cepat" kepada pembeli pada produk Anda. Tema Flatsome hadir dengan fitur ini. Namun, jika Anda ingin menonaktifkan tampilan cepat WooCommerce karena alasan apa pun, Anda dapat melakukannya dengan cepat.

37. Buat Tautan 'Gulir-Ke'

Anda dapat membantu pengunjung situs Anda pindah ke bagian halaman tertentu dengan mengaktifkan elemen scroll-to-link . Ini dapat menghemat waktu mereka yang berharga dan membantu mereka bernavigasi dengan mudah.

38. Gunakan Ikon Kustom

Anda mungkin bertanya-tanya mengapa Anda ingin menambahkan ikon khusus ke situs Anda. Jawabannya cukup sederhana; untuk ' representasi visual yang lebih baik .' Meskipun Flatsome memiliki beberapa ikon yang menarik, Anda mungkin masih ingin menggunakan ikon khusus di situs web Anda dan Anda dapat dengan mudah menyesuaikan ikon sendiri.

39. Ciutkan/Perluas Daftar Kategori Produk Sidebar

Daftar kategori produk sidebar sangat penting untuk setiap toko online. Di situs WooCommerce yang didukung Flatsome, Anda dapat menciutkan/memperluas menu bilah sisi di daftar kategori penciutan WooCommerce, sehingga pengunjung dapat dengan mudah menavigasi situs Anda.

40. Setup Server SMTP WordPress Menggunakan Gmail API

WordPress menggunakan fungsi surat PHP untuk mengirimkan pemberitahuan email. Namun, fungsi ini tidak berfungsi seperti yang diharapkan karena beberapa alasan. Gmail menyediakan layanan SMTP yang dapat Anda gunakan untuk mengirim email. Untuk itu, Anda perlu menyiapkan server SMTP menggunakan integrasi Gmail .

41. Buat Popup Panduan Ukuran Sederhana

Jika pembeli berjuang untuk menemukan produk yang tepat untuk kebutuhan mereka kemungkinan besar akan meninggalkan toko Anda dan beralih ke pesaing. Akan lebih baik untuk menampilkan popup panduan ukuran sederhana di toko online Anda dan Anda dapat mempelajari cara membuat bagan ukuran. Tanpa itu, pelanggan Anda akan bingung tentang ukuran yang tepat yang mereka butuhkan. Ini adalah suatu keharusan jika produk Anda berorientasi pada ukuran, seperti pakaian, sepatu, dll.

42. Hapus Cache Elemen Instagram

Cache adalah data sementara yang membantu browser Anda memuat sesuatu lebih cepat. Terkadang data cache ini bisa kedaluwarsa atau rusak dan menyebabkan masalah saat menggunakan Instagram. Praktik terbaik adalah menghapus data cache elemen Instagram . Jika Anda tidak tahu cara membersihkan cache Instagram maka Anda dapat mempelajarinya dengan baik dari sini.

43. Percepat Toko WooCommerce Anda

Mudah-mudahan, pada tahap ini, Anda dapat membuat toko online Anda menggunakan tema Flatsome, tetapi Anda mungkin menghadapi masalah dengan pengoptimalan kecepatan. Semakin cepat situs web Anda dimuat, semakin baik pengalaman berbelanja. Berikut adalah beberapa tips untuk membuat situs WooCommerce Anda memuat lebih cepat dengan praktik terbaik pengoptimalan kecepatan WordPress .

Membungkus

Kami harap panduan ini akan bermanfaat bagi siapa saja yang menggunakan tema Flatsome WooCommerce. Ini akan membantu Anda untuk meningkatkan situs web Anda, mendapatkan lebih banyak pengunjung situs, dan pada saat yang sama meningkatkan penjualan Anda.

Jika Anda ingin kami membahas lebih banyak topik di Flatsome, beri tahu kami di bagian komentar. Kami akan memperbarui artikel ini terus menerus untuk memberikan solusi yang lebih baik untuk toko WooCommerce Anda.