Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
Advertisement
  1. Code
  2. WooCommerce
Code

Cara Pasang dan Menyediakan Tema WordPress WooCommerce Baru

by
Difficulty:BeginnerLength:LongLanguages:

Malay (Melayu) translation by Aisyah Arrafah (you can also view the original English article)

WooCommerce adalah platform eCommerce yang paling popular dan 'paling disesuaikan untuk membina perniagaan dalam talian anda.' Anda boleh memuat turun WooCommerce secara percuma, tetapi anda benar-benar mula melihat kuasa apabila anda mula menggunakan WordPress WooCommerce plugin dan tema.

Tetapi adakah anda benar-benar perlu menggunakan tema WooCommerce?

Walaupun ia tidak diperlukan, saya sangat mengesyorkannya.

Bukan sahaja tema WooCommerce eCommerce-centric oleh reka bentuk, tema keseluruhan berpusat di sekitar gaya WooCommerce. CSS yang digunakan oleh WooCommerce untuk menentukan bagaimana produk dipaparkan kemudian digunakan oleh tema WordPress WooCommerce untuk benar-benar menarik segala-galanya-membuat untuk beberapa eCommerce storefronts yang paling indah direka.

Belum lagi fakta bahawa memasang dan menubuhkan tema WordPress WooCommerce baru tidaklah lebih sukar daripada menubuhkan tema WordPress lain.

Biarkan saya menunjukkan kepada anda bagaimana untuk melakukannya.

Cara Pasang dan Menyediakan Tema WordPress WooCommerce Baru

Jika anda sudah memasang WooCommerce, itu hebat! Jika tidak, saya sangat mengesyorkan Panduan Beginner Rachel McCollin untuk Menggunakan WooCommerce. Ini akan memperkenalkan anda kepada WooCommerce dan membawa anda melalui semua langkah yang diperlukan untuk mendapatkan kedai dalam talian anda dan berjalan.

Sekarang mari kita mulakan cara memasang dan sediakan tema WordPress WooCommerce baru.

keserasian silang pelayar, reka bentuk responsif, dan mesra SEO

Jika anda telah menambah produk anda ke WooCommerce, saya cadangkan melangkau langkah ini dan bermula dengan langkah 2.

Memasang data dummy menambah produk fictional ke etalase anda untuk membantu anda memvisualisasikan kedai anda dengan produk. Selepas anda selesai memasang dan menyiapkan tema WordPress WooCommerce baru anda, anda perlu memadam semua data dummy sebelum menambah produk anda. Jika tidak, risiko anda secara tidak sengaja memadam data produk anda sendiri.

Data dummy disertakan dengan plugin WooCommerce anda. Jika anda telah memasang WooCommerce dalam Admin WordPress, teruskan dan muat turun plugin dari WordPress Plugin Directory ke komputer anda. Ini akan menjadi lebih mudah daripada log masuk ke FTP anda, pergi ke direktori plugin anda, dan memuat turun data dummy dari sana.

Sebaik sahaja muat turun anda selesai, unzip fail tersebut supaya anda sudah bersedia untuk mengimport fail dummy-data.xml anda.

Pergi ke Alat anda dan klik Import:

How to Install and Setup a New WordPress WooCommerce Theme

Jangan biarkan ''Tarif Cukai WooCommerce (CSV)'' mengelirukan anda. Ini boleh dilakukan kemudian jika anda suka. Untuk Data Dummy WooCommerce, anda akan mahu memilih WordPress.

How to Install and Setup a New WordPress WooCommerce Theme

Lebih daripada mungkin anda tidak akan mempunyai plugin Pengimport WordPress, jadi teruskan dan Pasang Sekarang.

How to Install and Setup a New WordPress WooCommerce Theme

Setelah dipasang, teruskan dan Aktifkan Plugin & Jalankan Pengimport.

Adakah anda ingat di mana anda memuat turun dan mengosongkan pemalam WooCommerce? Hebat! Sekarang anda perlu klik Pilih Fail dan buat jalan anda.

How to Install and Setup a New WordPress WooCommerce Theme

Data dummy anda sepatutnya berada dalam folder terbiar: (woocommerce.version.number)> woocommerce> dummy-data.

How to Install and Setup a New WordPress WooCommerce Theme

Buka folder dummy-data, pilih dummy-data.xml, dan anda sudah bersedia untuk memuat naik fail dan import.

Ini adalah perkara terakhir yang perlu anda lakukan sebelum mengimport semua data dummy.

Sebahagian daripada ini adalah pilihan peribadi, tetapi inilah yang saya lakukan (tangkapkan lebih lanjut di bawah):

Import pengarang lalai 'wooteam' daripada membuat pengarang baru atau menggunakan pengarang yang sudah ada sebelumnya. DDengan cara ini, anda tahu apa kandungan yang diimport / dibuat dalam proses ini berdasarkan nama pengarang (Saya cadangkan memotong penulis apabila anda mengeluarkan data dummy selepas anda selesai memasang dan menyediakan tema WordPress WooCommerce baru anda).

Saya juga mengesyorkan agar anda memuat turun dan mengimport lampiran supaya anda mempunyai imej yang berkaitan dengan setiap produk (sekali lagi, anda perlu memastikan media dikeluarkan apabila anda selesai dengan data dummy).

Sebaik sahaja anda membuat pilihan ini, serahkan:

How to Install and Setup a New WordPress WooCommerce Theme

Lawati yourwebsite.com/shop/ dan anda akan melihat kedai ujian yang diimport sepenuhnya:

How to Install and Setup a New WordPress WooCommerce Theme

Yeah! Kamu lakukan!

Ia tidak direka dengan baik, bukan? Perkara yang baik kami akan memasang tema WordPress WooCommerce yang hebat seperti Savoy.

(NOTA: Setelah selesai memasang dan menetapkan tema anda, jangan lupa untuk memadamkan produk dan imej dari import data dummy sebelum anda mula menambahkan produk anda sendiri.)

Langkah 2: Pasang Tema WordPress WooCommerce

Sekarang, mari kita lihat cara memasang tema WooCommerce. Sekiranya anda belum memuat turun tema WordPress Commerce anda, teruskan dan muat turun ke komputer anda (pastikan anda tahu di mana anda memuat turunnya, supaya anda boleh mengaksesnya).

Terdapat dua cara yang berbeza yang boleh anda pasang tema anda:

  1. Translation service is temporarily unavailable
  2. Dari Admin WordPress

FTP Tema anda

Jika anda selesa menggunakan FTP, teruskan dan sambungkan ke pelayan anda dan buat jalan anda ke direktori wp-content > themes. Di sinilah anda mahu menghantar tema anda. Sebelum anda menghantar folder yang tidak terjejas ke pelayan anda, bagaimanapun, pastikan anda menghantar tema anda. Mari lihat lebih dekat dengan menggunakan tema WordPress contoh kami dari ThemeForest.

Selepas menyahpasang muat turun anda, anda akan melihat terdapat beberapa folder yang berbeza:

How to Install and Setup a New WordPress WooCommerce Theme

Tidak setiap tema yang anda muat turun akan dibungkus seperti ini. Kadang-kadang folder zipped yang anda muat turun adalah folder tema sebenar. Adalah idea yang baik untuk diperiksa semula, kerana ini berbeza dari satu tempat ke tempat.

Tema Savoy - AJAX WooCommerce Minimalis termasuk beberapa perkara tambahan seperti dokumentasi, aset, dll. Jika anda melihat folder Tema Fail untuk Savoy, anda akan menemui tema anda (savoy.zip).

Jika anda memasang melalui FTP, teruskan dan muat naik folder tema unzip anda (sebagai contoh: ''savoy'') ke dalam tema tema. Sekiranya anda tidak pasti menggunakan FTP atau lebih suka memasang dari Admin WordPress, itu baik-baik saja. Saya lebih suka menggunakan Admin WordPress juga.

Dari Admin WordPress

Memasang tema WordPress dari Admin memerlukan bahawa folder tema akan zip (themefolder.zip). Seperti yang telah kami bincangkan sebelum ini, anda perlu memastikan anda bekerja dengan folder tema sebenar dan bukan folder tema anda boleh dibungkus.

Dari Admin WordPress, di bawah Penampilan, klik Tema:

How to Install and Setup a New WordPress WooCommerce Theme

Tambah tema baru:

How to Install and Setup a New WordPress WooCommerce Theme

Muat naik tema:

Adakah anda ingat di mana fail zip tema anda terletak?

(Tema contoh kami bertajuk: savoy.zip)

Klik Pilih Fail dan buat jalan anda kepadanya:

Setelah dipasang, anda boleh melawat Rupa> Tema di Admin WordPress anda untuk melihat apakah ia dipasang atau klik untuk mengaktifkannya langsung.

Seperti yang anda lihat (di bawah), tema Savoy telah dipasang dengan jayanya, jadi tetikus dan Aktifkan:

How to Install and Setup a New WordPress WooCommerce Theme

Sekarang tema WordPress WooCommerce anda berjaya dipasang dan diaktifkan, mari kita tentukannya.

Langkah 3: Tetapkan Tema WordPress WooCommerce

Tidak setiap tema disesuaikan sama persis. Bagaimana tema yang direka dan dibangunkan adalah faktor yang besar, jadi mungkin terdapat beberapa perbezaan antara tutorial ini dan apa yang mungkin anda hadapi. Secara umumnya, bagaimanapun, ini akan membantu anda mendapatkan tema WordPress WooCommerce anda yang ditetapkan-tidak kira tema WooCommerce yang anda gunakan dari WorldWideThemes.net atau di mana-mana sahaja.

Plugin yang Disyorkan/Diperlukan

Selepas memasang dan mengaktifkan tema Savoy, anda akan dimaklumkan mengenai plugin yang disyorkan:

How to Install and Setup a New WordPress WooCommerce Theme

Kadang-kadang tema anda memberitahu anda tentang plugin yang disyorkan manakala yang lain termasuk cadangan dalam dokumentasi mereka. Terdapat fungsi reka bentuk tema-seperti slider pilihan-yang tidak dikodkan ke dalam tema, tetapi ditampung.

Klik pada Mula memasang plugin di tema Savoy untuk melihat senarai plugin yang disyorkan:

How to Install and Setup a New WordPress WooCommerce Theme

Sekali lagi, ini akan berbeza dari tema ke tema, tetapi dalam kes ini, anda mungkin atau mungkin tidak mahu memasang semua ini.

Sebagai contoh, sementara Savoy mengesyorkan Borang Perhubungan 7 dan termasuk gaya untuknya, anda mungkin tidak mahu menggunakan plugin ini untuk borang kenalan anda. Anda mungkin mahu menggunakan sesuatu seperti Borang Graviti atau Borang Ninja.

Plugin seperti Thumbnails Regenerate adalah plugin yang sangat baik untuk digunakan untuk mereka yang mempunyai kedai yang sedia ada dan mempunyai imej mereka dikonfigurasikan untuk tema sebelumnya. Plugin ini akan melalui Perpustakaan Media WordPress anda dan mengubah saiz semua imej anda untuk berfungsi dengan tema baharu anda. Anda mungkin atau mungkin tidak mahu melakukan ini dengan data dummy, dan anda mungkin mahu melangkau plugin ini sama sekali (tetapi saya mengesyorkan melakukannya, supaya semua media bersaiz dengan betul untuk tujuan pengujian).

Plugin seperti Envato Toolkit, bagaimanapun, adalah sangat penting untuk tema yang dibeli melalui WorldWideThemes.net, memastikan bahawa anda diberitahu tentang kemas kini tema.

Saya akan mengesyorkan memasang semua plugin yang disyorkan apabila anda bermula. Anda sentiasa boleh mengeluarkan plugin kemudian jika anda tidak memerlukannya, sedangkan jika anda tidak memasang plugin yang diperlukan, anda boleh kecewa kerana tema itu tidak ''berfungsi'' atau melakukan sesuatu yang anda suka pada demo.

Setelah anda memasang semua, beberapa, atau tidak ada plugin yang disyorkan dan / atau yang diperlukan, jangan lupa untuk mengaktifkannya:

How to Install and Setup a New WordPress WooCommerce Theme

Jika anda menggunakan tema yang dibeli dari WorldWideThemes.net, seperti tema Savoy tema contoh kami, jangan lupa masukkan Nama Pengguna dan Kunci API Rahsia di Envato WordPress Toolkit untuk memastikan kemas kini tema yang betul.

Customize

Ini adalah bahagian memasang dan menubuhkan tema WordPress WooCommerce anda apabila ia benar-benar menyeronokkan dan anda mula melihat laman web anda menjadi kenyataan.

Anda boleh mengakses Customizer WordPress dari menu di WordPress: Appearance > Customize. Atau pergi ke laman Tema di bawah Penampilan> Tema dan kemudian klik butang Customize:

How to Install and Setup a New WordPress WooCommerce Theme

Selamat datang ke Customizer WordPress:

How to Install and Setup a New WordPress WooCommerce Theme

Di sinilah kita akan membuat beberapa tweak sebelum masuk ke dalam konfigurasi yang lebih mendalam.

Perkara pertama yang anda akan lihat ialah Identiti Laman. Di sinilah anda boleh menukar Title Site dan Tagline anda.

How to Install and Setup a New WordPress WooCommerce Theme

Kadang-kadang ini adalah di mana anda boleh menambah imej header adat dan / atau Icon Site juga (ini akan berbeza dari tema ke tema).

Seterusnya, konfigurasi menu anda:

How to Install and Setup a New WordPress WooCommerce Theme

Jika ini adalah persediaan WooCommerce baru atau anda belum membuat sebarang halaman, mungkin tidak banyak untuk anda ''menyesuaikan'' lagi. Dengan WooCommerce dipasang, bagaimanapun, secara automatik menambah beberapa halaman yang saya pasti anda akan mahu menambah ke menu anda dengan segera.

Anda boleh menambah dan membuat menu baru dengan mudah:

How to Install and Setup a New WordPress WooCommerce ThemeHow to Install and Setup a New WordPress WooCommerce Theme

Sebaik sahaja anda telah menambah menu (atau beberapa), anda boleh memilih di mana anda mahu menu muncul serta item menu yang berbeza (seperti pautan tersuai, siaran, halaman, produk, dll.).

How to Install and Setup a New WordPress WooCommerce Theme

Ini memberikan anda banyak fleksibiliti dengan bagaimana anda ingin laman WooCommerce anda berfungsi. Jangan takut bermain-main dengannya atau ubahnya kemudian.

Sebelum kami meninggalkan Customizer WordPress, anda ingin memberitahu WordPress untuk membuat halaman depan kedai anda:

How to Install and Setup a New WordPress WooCommerce Theme

Halaman muka Mark Laman memaparkan sebagai halaman statik dan pilih halaman Depan untuk menjadi halaman Kedai anda. Halaman Kedai dibuat secara automatik apabila anda memasang plugin WooCommerce.

Bagi halaman Posts, ini bergantung kepada di mana atau tidak anda mahu blog di laman web WooCommerce anda. Jika ya, anda perlu membuat halaman blog dan pilih pada Halaman ini Customizer WordPress atau dalam Tetapan Admin WordPress> Membaca.

Keputusan

Dengan beberapa konfigurasi asas, anda dapat melihat betapa hebatnya kedai dalam talian anda boleh menggunakan tema WordPress WooCommerce:

How to Install and Setup a New WordPress WooCommerce Theme

Halaman produk individu kelihatan hebat:

How to Install and Setup a New WordPress WooCommerce Theme

Ia juga termasuk produk berkaitan:

How to Install and Setup a New WordPress WooCommerce Theme

The Savoy - Tema AJAX WooCommerce Minimalist membolehkan anda menapis banyak elemen dalam laman web anda dengan mudah dan boleh pergi jauh di belakang apa sahaja yang saya bahas dalam tutorial ini (pastikan anda membaca dokumentasi tema anda untuk mengetahui lebih lanjut mengenai tema anda secara khusus). Saya hanya menunjukkan perubahan yang boleh dibuat dalam Customizer WordPress dan biasanya boleh dibuat pada mana-mana tema yang mungkin anda gunakan.

Kesimpulan

Anda dapat melihat dengan jelas betapa mudah langkah pertama awal dalam mengkonfigurasi tema WordPress WooCommerce baru anda dan bagaimana kelihatannya dengan baik-hanya dengan menggunakan tema WordPress yang direka khusus untuk WooCommerce.

Terdapat banyak plugin WordPress WooCommerce yang berguna di CodeCanyon dan beberapa tema WordPress WooCommerce yang direka dan berkesan di WorldWideThemes.net.

Melihat beberapa tema WorldForest WooCommerce yang paling laris mungkin menjadi tempat yang baik untuk memulakan (Savoy masih kegemaran saya). Saya pasti anda akan menemui sesuatu yang sesuai dengan kedai e-dagang anda dengan sempurna. Atau semak pameran pilihan kami untuk mencari yang tepat untuk kedai anda:

Apa yang anda gunakan untuk menjual WooCommerce?

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.