Selepas menggunakan WooCommerce untuk membina tapak web bebas, kami akan mempunyai pusat ahli dalam keadaan biasa. Pusat ahli di sini ialah antara muka konfigurasi untuk pengguna menyemak pesanan mereka dan mengubah suai maklumat peribadi mereka. Jadi, kadangkala, kita perlu menyesuaikan antara muka sedemikian. Sudah tentu, yang kami gunakan sekarang ialah Woodmart .

woocommerce lalai ke akaun saya:

Antara muka yang dihasilkan oleh tema sedemikian agak cantik.

1 antara muka pusat ahli woocommerce e1713882548704

Tetapi terdapat beberapa tema, seperti Astra atau The7. Tema sedemikian akan mempunyai kesan yang sangat buruk pada pusat pengguna sedemikian.

Di samping itu, kadangkala, kami perlu menambah pautan tersuai ke halaman seperti Akaun Saya. Pada masa ini, kita perlu menggunakan beberapa pemalam untuk mengoptimumkan antara muka kerana kod antara muka ini lebih menyusahkan untuk diubah suai, jadi ia adalah perkara biasa. Dalam kebanyakan kes, kami akan menggunakan pemalam dan kemudian melengkapkan penyesuaian visual. Di sini, kami telah menyediakan pemalam untuk membuat pengubahsuaian tersuai pada halaman kami secara langsung.

Yith Woocommerce Sesuaikan pemasangan pemalam Halaman akaun saya:

Sekarang kami memasuki bahagian belakang stesen bebas kami, kemudian cari pemalam dan klik tambah baharu, kemudian muat naik pemalam kami, cari versi tertinggi semasa dan klik untuk membuka. Selepas memasang pemalam, kami akan mengaktifkannya terus selepas pemasangan berjaya. Selepas pengaktifan, kita perlu Mari isi kuncinya. Kami tidak perlu risau tentangnya di sini kerana kami adalah versi GPL, jadi kami boleh menggunakannya walaupun ia tidak diaktifkan. Kami hanya klik di bawah untuk kembali ke papan pemuka.

2 woocommerce menyesuaikan antara muka pengaktifan halaman myaccount

Selepas pemasangan berjaya, kami klik pada tetapan pemalam, dan terdapat butang tambahan seperti ini dalam butang fungsi WordPress di sebelah kiri. Syarikat seperti YITH membangunkannya, jadi kami klik terus untuk memasukkan tetapan, dan kemudian kami pergi dahulu Lihat nombor versi kami. Kini kami melihat bahawa ia diaktifkan secara automatik, jadi anda tidak perlu risau mengenainya, dan anda juga boleh menaik taraf pemalam ini dalam talian.

Yith-Woocommerce-Customize-My account-Page pemalam papan pemuka:

Yang kedua ialah sistemnya, yang digunakan terutamanya untuk memantau versi PHP semasa kami, termasuk versi pemalam semasa. Kemudian, kita melihat bahawa yang pertama hanya mempunyai satu tetapan kandungan. Apabila anda meletakkan pemalam ini Selepas pengaktifan, anda boleh memuat semula antara muka pusat ahli seperti akaun saya. Ia telah disesuaikan, tetapi kerana mungkin terdapat beberapa masalah padanan dengan tema semasa, kadangkala kesan paparan tidak begitu cantik. , kita perlu mengubah suai gayanya kemudian. Sudah tentu, tema yang berbeza mempunyai kaedah tetapan yang berbeza. Kami terus memasuki latar belakang dan melihat bahawa fungsi di sini adalah sangat mudah.

3 woocommerce menyesuaikan antara muka tetapan halaman myaccount e1713882751730

Yang pertama ialah halaman seperti ini dalam Kawen kami. Ia akan menjana beberapa menu, seperti papan pemuka kami. Pengguna boleh melihat pesanan saya dan muat turun saya. Jika anda membuat beberapa tapak maya, Kemudian ia boleh melihat kandungan saya yang dimuat turun, mengedit alamatnya, dan kemudian menetapkan kaedah pembayarannya. Jika anda mengklik butang fungsi di sebelah kiri, panel di sebelah kanan akan berubah dengan sewajarnya, tetapi kami tidak mempunyainya sekarang. Untuk pesanan, kini kita melihat kandungan di latar belakang dan semua maklumat lalai yang boleh dipaparkan pada halaman muka depan. Ia terutamanya termasuk papan pemuka kami, pesanan, pengubahsuaian alamat, dll.

Tetapan modul Halaman Akaun Saya:

Sudah tentu, jika terdapat beberapa kandungan ini yang anda tidak mahu paparkan, seperti lampiran yang saya belum muat turun, anda boleh menutupnya. Selepas menutupnya, simpannya. Kini, anda boleh kembali ke meja depan untuk menyegarkan mereka. Kemudian, yang dimuat turun akan dipaparkan. Modul telah hilang. Sudah tentu, anda boleh memadam setiap modul atau seret dan gerakkan kedudukannya. Ini semua mungkin.

4 Woocommerce menyesuaikan halaman akaun saya Tetapan Butang Fungsi

Di samping itu, anda boleh mengklik anak panah ini untuk memasuki antara muka pengubahsuaian. Anda boleh mengubah suai teks yang dipaparkan pada halaman akaun, dan sudah tentu, anda juga boleh menambah ikon padanya. Sebagai contoh, kami boleh menambah ikon di sini, dan kemudian antara muka ini biasanya berfungsi secara lalai untuk semua pengguna.

5 woocommerce menyesuaikan penyesuaian butang fungsi halaman akaun saya

Langkah seterusnya ialah menambah sepanduk. Sepanduk adalah kesan yang kita lihat sekarang. Contohnya, kalau kita masuk dashboard, setiap modul macam ni dipanggil banner. Kami akan menambah banner di sini nanti kerana ia perlu dibuat pada langkah kedua.

Yang seterusnya ialah lokasinya, di mana ia dipaparkan secara lalai. Anda juga boleh menambah beberapa kelas padanya. Okey, simpan sahaja selepas menambahnya. Ini adalah beberapa kaedah pengubahsuaian untuk butang fungsi dalam antara muka akaun.

Butang tambah Halaman Akaun Saya:

Sudah tentu, anda juga boleh menambah butang lain di atas. Sebagai contoh, jika kami mengklik pada yang pertama, anda boleh menulis alias teks anda di dalamnya, dan kemudian anda boleh menambah pautan kepadanya, tetapi secara lalai, ini termasuk Kami mempunyai semua butang fungsi lalai. Jika terdapat butang lain, anda mungkin telah memasang beberapa pemalam.

6 woocommerce sesuaikan halaman akaun saya tambah butang tersuai e1713882923850

Yang kedua ialah menambah beberapa pautan tersuai. Sebagai contoh, kami akan menambah rumah di sini supaya pengguna boleh kembali ke halaman utama atau halaman penggunaan kami dan kemudian menambah pautan. Kami akan menggunakan halaman utama untuk pautan di sini. Pautan, dan kemudian sama ada yang seterusnya memaparkan ikon kecil, kami membiarkannya memaparkan ikon kecil secara lalai di sini. Selain itu, anda boleh melihat pautan ini untuk siapa dan kemudian menambah beberapa gaya kelas atau membukanya dalam tetingkap baharu. Selepas menambah Klik Tambah kemudian, kami menyimpannya, tetapi kami melihat sekarang bahawa ia berada di bahagian paling bawah kami.

Selepas pengubahsuaian, simpannya. Sekarang kembali ke akaun kami, muat semula halaman, dan akan ada pautan ke halaman utama di bahagian bawah. Halaman utama masih tidak memaparkan nama biasa supaya kami akan mengubah suai nama itu semula. Walau bagaimanapun, kami melihat bahawa kami perlu mengisi URL pautan di sini, jadi kami mengisi kedua-dua ini ke belakang. Pautan harus ditambah ke bahagian atas, dan rumah harus ditambah ke bahagian bawah. Kemudian simpan. Sekarang muat semula, dan ia akan dipaparkan seperti biasa. Hanya klik padanya. Ia akan kembali ke halaman utama anda dengan beberapa butang tersuai.

7 woocommerce menyesuaikan paparan butang tersuai halaman akaun saya

Yang terakhir ialah menambah kumpulan. Apa yang dipanggil utama bermakna menambah submenu dan nama. Anda boleh memisahkan modul di dalamnya. Kami tidak akan menunjukkannya kepada anda di sini.

Pengisihan butang Halaman Akaun Saya:

Kemudian, kita melihat sepanduk ucapan kedua. Sesetengah kandungan akan ditambahkan padanya secara lalai. Sudah tentu, kandungan ini serupa dengan kaedah pengubahsuaian butang fungsi di atas.

8 woocommerce menyesuaikan tetapan modul sepanduk halaman akaun saya e1713883016806

Anda juga boleh menambah pautan kepadanya dan menambah beberapa modul. Di sini, anda juga boleh melihat beberapa modul lain yang boleh anda pilih. Sebagai contoh, kami boleh menambah alamat pengeditan atau kaedah pembayaran. Tunggu, sudah tentu, kita juga boleh menambah yang baharu di atas.

9 woocommerce menyesuaikan pengubahsuaian modul sepanduk halaman myaccount

Kemudian, berikan nama yang sama sama ada untuk memaparkan ikon kecil dan kemudian lebarnya. Berikut ialah sama ada warnanya memaparkan kuantiti. Jika ia mempunyai kuantiti, anda boleh memaparkannya. Jika tidak, anda tidak perlu risau tentangnya. Jadi, bagaimana kita menambah sepanduk ini pada masa kini?

Modul paparan halaman utama Halaman Akaun Saya:

Mari kita kembali ke butang. Sebagai contoh, kami kini berada di rumah, tetapi sekarang ia dibuka, ia melompat ke pautan lain. Sekarang, kami memilih pesanan saya dan menambahnya di sini kerana mungkin tiada pesanan dalam banyak kes. Kami juga mahu dia melihat beberapa modul, jadi kami mencari pesanan saya dan menambah sepanduk kami pada kandungan.

10 woocommerce menyesuaikan halaman akaun saya tambah paparan butang sepanduk

Di sini anda boleh menyemak. Sebagai contoh, kami menambah muat turun, kemudian menambah maklumat pengguna, alamat dan kaedah pembayaran padanya, menambahnya secara terus dan menyimpannya. Selepas menyimpan, kami Simpan semula, dan kemudian kami muat semula pesanan kami.

11 woocommerce menyesuaikan paparan modul sepanduk halaman myaccount

Anda boleh melihat bahawa terdapat beberapa lagi modul di sini. Sudah tentu, anda juga boleh menambah beberapa ikon pada modul ini. Anda boleh mencari kandungan yang anda tambah dan menambah ikon dalam sepanduk. Yang pertama ialah fungsi. butang, yang kedua ialah menambah beberapa sepanduk pada butang fungsi kami.

Tetapan Pemalam:

Kemudian, kita melihat tetapan ketiga, yang sangat mudah. Pertama sekali, apabila kami menukar butang ini, kami mendapati ia menyegarkan halaman kami. Kita boleh menambah kesan Ajax kepadanya di sini. Kemudian, kita boleh menetapkan papan pemuka atau sesuatu yang lain untuk butang lalai, dan ia akan dipaparkan. Apabila pengguna memasuki halaman Akaun Saya, butang yang anda tetapkan sebagai lalai dipaparkan terlebih dahulu.

12 woocommerce menyesuaikan tetapan pemalam halaman akaun saya e1713883172198

Yang seterusnya ialah avatar untuk pengguna kami. Kami melihat bahawa selepas menambahnya, akan ada fungsi album foto di sebelah kiri. Selepas mengklik, pengguna boleh memuat naik avatarnya sendiri, jadi di sini, kita boleh menetapkan avatar lalai, yang kita lihat sekarang sebagai kesan lalai. Sudah tentu, ikon kecil tidak dipaparkan. Sudah tentu, anda juga boleh memuat naik logo anda sendiri.

Reka letak gaya Halaman Akaun Saya:

Satu lagi ialah saiz avatar kami, sama ada ia mempunyai sudut bulat dan sama ada ia membenarkan pengguna menyesuaikannya. Lalai adalah baik. Kini, pengguna boleh memuat naik avatar sendiri. Okay, jadi ini adalah persediaan pertama. Mari kita lihat.

13 woocommerce menyesuaikan tetapan gaya panel halaman myaccount

Kedua, gayanya ialah butang semasa kami. Gaya lalainya ialah bar sisi di sebelah kiri, tetapi kami juga boleh meletakkan bar sisi di sebelah kanan atau di atas. Berikut adalah beberapa gaya. Bida kecil juga dimuatkan secara lalai untuk saiz fon, warna latar belakang, dll. Kemudian kami menyimpannya dan kemudian memuat semula halaman Akaun Saya kami.

Sekarang kita melihat bahawa ia dijajarkan ke kanan, tetapi ia tidak dipaparkan secara normal dalam templat semasa kami. Jadi, untuk situasi sedemikian, kita perlu mengubah suai gaya CSSnya. Kemudian, cuba sendiri dengan tema anda. Jika anda merasakan bahawa kesan halaman Akaun Saya bukan seperti yang anda mahukan, anda boleh menggunakan pemalam ini untuk mencubanya. Untuk seketika, jika kesan seperti Woodmart sudah sangat cantik, kita tidak perlu mengubahnya sekarang.

14 woocommerce menyesuaikan tetapan pengesahan halaman myaccount

Pengesahan keselamatan Halaman Akaun Saya:

Yang terakhir ialah pengesahan keselamatan; apabila pengguna menyerahkan kandungan, seperti memuat naik avatar, kami boleh menambah pengesahan seperti robot. Di sini, kita perlu memohon kunci Google. Terdapat juga dokumen di sini, iaitu, dokumen Google, menerangkan cara memohon kod pengesahan. Secara amnya, kami tidak menambahnya secara lalai kerana pengguna telah melog masuk ke halaman Akaun Saya, jadi jika dia menyerahkan beberapa maklumat pada masa ini, tidak perlu menyediakan halangan untuknya.

Yang seterusnya ialah beberapa pemalam lain yang disediakan oleh keluarga pemalam. Kami akan membincangkannya kemudian, tetapi kami tidak boleh memasangnya terus di sini kerana semuanya adalah versi komersial. Terdapat juga bantuan, iaitu Pusat Bantuan. Ini adalah cara menggunakan pemalam yith-woocommerce-customize-myaccount-page untuk menyesuaikan halaman pengguna.