Ulasan Wira CSS: Penyesuaian Tema WordPress Dimudahkan!

Tawaran WordPress


Untuk mendapatkan laman web yang kelihatan seperti yang anda mahukan, kekayaan pelbagai tema WordPress yang ada adalah kebaikan! Dan jika anda menghabiskan masa yang lama untuk mencari, anda mungkin dapat mencari tema yang sangat sesuai untuk laman web anda. Walau bagaimanapun, ada kemungkinan bahawa walaupun anda dapat mendekati apa yang anda mahukan, anda mungkin masih jauh dari kesempurnaan. Lagipun, bolehkah tema pra-binaan benar-benar sesuai dengan keperluan individu hingga T?…

Jadi apa yang harus dilakukan jika anda berjaya menemui tema yang hampir dengan apa yang anda mahukan, tetapi masih perlu melakukan beberapa perubahan? Sekiranya anda mempunyai kemahiran yang diperlukan, tidak ada masalah: anda akan dapat mengubahnya sesuka hati. Tetapi bagaimana jika anda tidak mempunyai keyakinan untuk masuk dan membuat perubahan anda sendiri pada fail yang diperlukan?

Hari ini, saya ingin memperkenalkan anda kepada pemalam yang sangat berguna: CSS Hero – pemalam yang memberi anda kuasa untuk membuat penyesuaian visual kecil – atau mungkin agak besar – sendiri: tanpa perlu menyentuh satu baris kod!

Apa itu Wira CSS?

CSS Hero adalah plugin penyesuaian tema (lihat ciri.

Wira CSS

Oleh itu, ia menempati ruang yang serupa dengan plugin pembangun halaman drag-and-drop. Walau bagaimanapun, di mana pembangun halaman mendorong anda membuat reka bentuk tersuai dari awal, CSS Hero membolehkan anda mengubah tema WordPress yang ada dengan cara yang anda suka.

Ini membolehkan anda bermain pembangun, tanpa semestinya mempunyai kemahiran pembangun yang biasanya terlibat. Anda terus menggunakan tema WordPress yang direka secara profesional – anda tahu, tema yang dibina oleh seorang pakar, bukan oleh seseorang yang menggabungkan modul rawak bersama, plugin pembangun halaman – sambil membuat penyesuaian kecil agar sesuai dengan keperluan anda.

Tidak ada elemen di luar kawasan: Anda boleh menyesuaikan apa sahaja dan segala-galanya. CSS Hero mengubah penyesuaian anda menjadi kod CSS yang relevan, yang kemudian diterapkan pada lembaran gaya CSS baru (lembaran gaya asli tetap tidak tersentuh, mengelakkan masalah di bawah).

CSS Hero berfungsi dengan tema WordPress juga. Mereka yang diuji secara meluas untuk keserasian disebut sebagai Hero-ready, sementara tema yang belum diuji masih disokong dalam Mode Roket.

Harga

CSS Hero adalah plugin premium yang berpatutan. Untuk menunjukkan persaingannya, harganya setaraf dengan plugin pembangun halaman yang paling popular.

Lesen pemula asas berharga hanya $ 29, dan memberi anda akses ke pemalam CSS Hero penuh (walaupun anda terhad untuk menggunakan hanya satu laman web).

Sekiranya anda ingin menggunakan CSS Hero di lebih dari satu laman web, pilihan anda adalah:

  • Lesen peribadi ($ 59) – sehingga lima laman web
  • Lesen Pro ($ 199) – sehingga 999 laman web

Seperti yang anda bayangkan, lesen pro ditujukan kepada agensi kreatif dan pemaju kerjaya. Kedua-dua lesen peribadi dan pro juga dilengkapi dengan akses ke tambahan premium, Inspector Pro – kami akan membahas ini dengan lebih terperinci di halaman seterusnya.

Ketiga-tiga lesen Wira CSS berlaku selama satu tahun, memberi akses kepada kemas kini dan sokongan satu tahun, dan dilengkapi dengan jaminan wang dikembalikan selama 30 hari.

Bermula

Setelah membuat pembelian, anda akan dibawa ke papan pemuka CSS Hero. Dari sana, anda dapat mengakses dokumentasi lengkap plugin, serta CSS Hero Academy yang hebat. Akademi ini adalah sentuhan yang bagus, yang menampilkan siri tutorial video mesra pemula yang direka untuk membantu anda memanfaatkan sepenuhnya pemalam baru anda (Saya ingin melihat pemalam canggih lain mengikutinya).

Papan Pemuka Wira CSS

Papan pemuka melakukan satu fungsi penting yang lain: Di sinilah anda memuat turun Wira CSS dan – bergantung pada tahap lesen anda – pemalam Inspector Pro.

Setelah muat turun selesai, log masuk ke papan pemuka WordPress anda. Navigasi ke Pemalam > Tambah baru > Muat naik Plugin, kemudian ikuti arahan untuk memuat naik fail zip pemalam dan aktifkan pemalam. Sekiranya anda pernah memasang pemalam WordPress sebelumnya, ini semua akan terasa sangat biasa.

Walau bagaimanapun, pemasangan Wira CSS memerlukan satu langkah tambahan: Pengesahan. Klik butang biru, kemudian ikuti arahan semasa anda mendaftarkan salah satu lesen anda. Setakat ini, begitu baik.

Sekarang, CSS Hero adalah alat penyuntingan tema, dan, dengan demikian, penyuntingan dilakukan di bahagian depan, di mana anda dapat melihat perubahan dalam masa nyata. Akses bahagian depan laman web anda, dan anda akan melihat ikon biru baru di sudut kanan atas skrin. Klik ini untuk mula menggunakan pemalam baru anda.

Ikon Wira CSS

Editor Wira CSS

Setelah mengklik ikon biru, anda perlu menunggu beberapa saat sehingga CSS Hero dihidupkan. Dengan plugin diaktifkan, anda kini boleh mula menggayakan dan menyesuaikan laman web anda.

Untuk memulakan, cukup klik ikon biru di bahagian atas panel pilihan. Sekiranya anda tidak pasti bagaimana untuk meneruskannya, pemalam akan memberi anda pautan berguna yang merangkumi semua asas. Namun, jika anda sudah siap untuk menyelam, anda boleh mula menyasarkan dan mengedit elemen apa pun di halaman anda.

Arahkan kursor ke elemen yang ingin diedit, kemudian klik (kita akan mulai dengan melihat perenggan isi yang agak asas, seperti yang dilihat pada tangkapan layar di bawah). Setelah diklik, CSS Hero akan memasukkan elemen anda, yang bermaksud anda bebas untuk mula menyesuaikannya.

Elemen Sasaran Wira CSS

Untuk menjadikan prosesnya sesederhana mungkin, CSS Hero akan memberi anda senarai pilihan penyesuaian, bergantung pada jenis elemen yang anda pilih. Setelah memilih perenggan, pilihan saya termasuk menukar fon, latar belakang dan sempadan, dan mengkonfigurasi padding di sekitar teks.

Mengedit elemen adalah mudah, dengan segala yang dikendalikan dari bar menu sebelah kanan, dan perubahan yang dipratonton dalam masa nyata. Untuk memulakan, saya telah memutuskan untuk memberi tumpuan kepada sifat teks. Dengan pilihan ini dipilih, CSS Hero memaparkan semua pilihan yang tersedia untuk mengkonfigurasi teks, termasuk:

  • Font face – dengan setiap fon Google tersedia untuk dipilih
  • Warna fon
  • Saiz huruf
  • Berat fon
  • Penjajaran teks
  • Transformasi teks – contohnya, huruf besar
  • Jarak kata
  • Ketinggian garisan

Lakukan perubahan yang anda mahukan, dan tonton perubahan itu berlaku pada teks beberapa saat kemudian.

Gaya Fon Wira CSS

Anda kemudian boleh kembali dan mengkonfigurasi latar belakang perenggan anda – sekali lagi, CSS Hero memberikan kawalan sepenuhnya kepada anda. Anda boleh memuat naik gambar khusus, memilih warna, atau mengkonfigurasi kecerunan untuk ditampilkan sebagai latar belakang anda.

Gradien Latar Belakang Wira CSS

Anda juga diberi pilihan yang sama untuk sempadan perenggan, dengan fleksibiliti penuh pada gaya, lebar dan warna sempadan.

Gaya Sempadan Wira CSS

Bahkan ada beberapa gaya prakonfigurasi yang keren – misalnya, mengubah teks Anda menjadi tombol atau menampilkan latar belakang siap pakai dalam sejumlah desain keren.

Gaya Wira ReadySade CSS

Sekiranya anda memilih untuk tidak melakukan perubahan pada satu bahagian pada satu waktu, anda juga dapat memilih semua opsi, yang mencantumkan setiap pilihan penyesuaian pada satu layar yang mudah.

Membatalkan Perubahan

Semasa anda membuat perubahan pada teks, Wira CSS akan menerapkannya ke versi langsung laman web anda. Namun, jangan bimbang untuk membuat perubahan tetap pada masa ini – sebelum perubahan diterapkan, Anda mempunyai pilihan untuk menghapusnya dengan mengklik batal, atau untuk mengesahkannya dengan menekan butang simpan.

Walaupun selepas menyelamatkan, anda tidak akan terjebak dengan perubahan yang tidak diinginkan. Untuk kembali ke aslinya, kembali ke tingkat atas menu CSS Hero, arahkan ke bahagian alat, kemudian pilih tetapan semula ke pilihan lalai tema.

Anda juga boleh mengembalikan elemen individu ke tetapan kilang lalai – cukup klik elemen yang ingin anda pulihkan, kemudian klik pada ikon tetapan semula ‘R’ di sebelah kanan menu. Tekan mengesahkan, dan unsur penyangak anda akan dikembalikan kepada kegemilangannya yang dulu.

Seperti yang saya nyatakan sebelumnya, semua penyesuaian diterapkan pada helaian gaya tambahan. Sekiranya perkara terburuk berlaku, helaian gaya asal tema anda tidak akan tersentuh. Ini bermaksud, tidak kira apa perubahan yang anda buat menggunakan CSS Hero, kerosakan jangka panjang tidak dapat dilakukan. Sekiranya semua pilihan pemulihan lain gagal, anda boleh mengembalikan tema lalai dan tidur dengan lena!

Edit Sebarang Elemen

Salah satu kelebihan CSS Hero adalah bahawa ia membolehkan anda mengedit elemen apa pun di halaman anda – tidak kira besar atau kecil.

Melihat gambar yang besar, anda boleh mengedit gambar latar belakang laman web anda, gaya bar sisi dan bahagian kaki.

Ini dicapai dengan menggunakan proses yang sama seperti yang kami gunakan untuk mengedit perenggan kami, tetapi menunjukkan bahawa CSS Hero dapat digunakan untuk membuat perubahan mendasar pada estetika laman web anda. Lihat tangkapan skrin di bawah, di mana saya telah mengubah latar belakang bar sisi saya, mengubah gaya tajuk widget, dan juga mengatur ulang jarak. Inilah asas sebelum penggambaran:

Wira CSS Sebelum Tangkapan Skrin

Dan ini adalah selepas perubahan saya – memang saya bukan seorang pereka, tetapi ini hanya memerlukan beberapa saat untuk dicapai.

Wira CSS Selepas Tangkapan Skrin

Anda juga dapat menyesuaikan elemen kandungan kecil, seperti gambar, warna pautan, dan gaya senarai. Gaya senarai sangat menarik, kerana anda dapat memilih peluru khas dari bahagian senarai khusus. Terdapat enam peluru prebuilt yang disokong – termasuk kotak, perpuluhan, dan angka Rom – atau anda boleh memuat naik ikon tersuai anda sendiri untuk sentuhan yang lebih peribadi.

Mudah-mudahan, ini memberi anda idea bagaimana anda boleh merombak reka bentuk laman web anda. Tema WordPress anda menyediakan asas, tetapi, terima kasih kepada CSS Hero, anda dapat mengubah setiap piksel laman web anda mengikut keinginan anda – tanpa menyentuh garis kod.

Ciri-ciri lain

CSS Hero mempunyai beberapa ciri menarik yang saya ingin menarik perhatian anda.

Pertama ialah penukar pandangan. Dengan penekanan yang semakin meningkat pada reka bentuk yang responsif, sangat penting laman web anda berfungsi dengan sempurna pada peranti dari pelbagai bentuk dan saiz. CSS Hero dilengkapi dengan ciri bawaan yang membolehkan anda melihat laman web anda dalam paparan desktop, tablet, dan mudah alih.

Cukup pilih paparan pilihan anda dari bar alat – ini adalah pilihan kedua ke bawah – dan biarkan CSS Hero mengubah skrin anda menjadi ukuran yang sesuai. Ini adalah kaedah yang bagus untuk menguji perubahan yang anda gunakan pada peranti yang lebih kecil.

Paparan Tablet Wira CSS

Seterusnya, kita mempunyai ciri sejarah penting. Setiap kali anda menekan butang simpan, CSS Hero menyimpan gambar laman web anda. Tangkapan gambar ini dapat dilihat dan dipulihkan dengan satu klik butang, yang bermaksud kerja keras anda tidak akan hilang – anda boleh melompat ke depan dan ke belakang dalam masa.

Akhirnya, kami mempunyai pilihan Export CSS, tersedia dari bahagian alat. Ini memberi anda peluang untuk mengeksport CSS yang diedit untuk digunakan di laman web lain, atau hanya muncul di layar untuk mengkaji perubahan yang anda buat (salah satu cara terbaik untuk mempelajari CSS).

Tambahan Inspector Pro

Anda yang menaik taraf rancangan peribadi atau pro juga mendapatkan CSS Hero add-on Inspector Pro yang disertakan bersama lesen anda.

Diumumkan pada Mei 2015, dan baru-baru ini dalam mod beta, Inspector Pro bertujuan untuk pengguna CSS yang lebih maju. Walaupun CSS Hero adalah alat yang sama sekali tidak memerlukan kemahiran CSS, Inspector Pro telah dikembangkan untuk mereka yang ingin menyesuaikan laman web mereka dengan mengubah CSS secara langsung.

Inspector Pro memaparkan CSS tema anda di bawah pratonton langsung. Anda boleh mengedit kod ini sesuka hati, dan, ketika anda melakukannya, perubahan anda dapat dilihat dalam pratonton. Dengan memberi anda kemampuan untuk mengedit CSS secara langsung, plugin ini memberi anda kawalan mutlak terhadap penyesuaian anda, pixel demi pixel.

CSS Hero Inspector Pro

Walau bagaimanapun, Inspector Pro juga menawarkan beberapa fungsi yang berguna, jadi anda tidak akan melakukannya sendiri. Contohnya, anda boleh melompat ke baris tertentu dengan menggunakan fungsi carian yang berguna, atau mematikan garis gaya tertentu sehingga unsur yang bertindih tidak akan menghalangi.

Sekiranya anda menulis CSS anda dari awal, anda akan menyukai alat tambah ini, kerana ini bermakna anda tidak perlu lagi berpusing di antara tingkap – anda boleh membuat dan melihat semua pengeditan anda pada satu skrin. Berguna!

Sokongan Wira CSS

Dari saat anda log masuk ke papan pemuka CSS Hero, anda dapat melihat bahawa pembangun berusaha untuk membantu anda memanfaatkan sepenuhnya pemalam mereka.

Saya telah menyentuh mengenai dokumentasi yang luas dan CSS Hero Academy (akademi ini masih dalam peringkat awal, tetapi ada rancangan konkrit untuk meneruskan pengembangannya).

Kedua-dua bahagian ini sangat teliti, dan akademi merangkumi tutorial video yang berguna. CSS Hero terasa sukar untuk digunakan pada mulanya, jadi saya mendapati tutorial video pendek ini berguna untuk mencari kaki saya – selepas itu, plugin terasa agak mudah.

Akademi Wira CSS

Terdapat juga bahagian dokumentasi yang lebih maju, yang dikenali sebagai Pangkalan Pengetahuan Pengembang. Ini disasarkan kepada pemaju plugin / tema, yang mengikuti langkah-langkah yang diperlukan untuk memastikan produk mereka sepenuhnya serasi dengan CSS Hero – aka, siap sedia untuk menjadi wira.

Bagi mereka yang masih tidak dapat menyelesaikan masalah mereka, walaupun terdapat dokumentasi yang mendalam, ada juga forum sokongan. Anggota staf sokongan Wira CSS siap menjawab sebarang pertanyaan – biasanya dalam masa beberapa jam. Lesen memberi anda akses selama satu tahun ke forum dan pasukan sokongan.

Forum Sokongan CSS

Secara keseluruhan, CSS Hero tidak boleh disalahkan atas usaha sokongannya. Tutorial yang ditulis sebelumnya dan direkodkan sangat membantu, dan mereka dihiasi sepanjang pengalaman pengguna di titik-titik di mana kemungkinan besar diperlukan.

Oleh kerana pemalam WordPress menjadi semakin canggih, saya ingin melihat lebih banyak pembangun mengikuti contoh CSS Hero, memberikan sokongan lanjutan langsung, supaya pengguna yang tidak berpengalaman tidak pernah merasa jauh dari kedalaman mereka.

Pemikiran Akhir

Secara keseluruhan, saya sangat kagum dengan Wira CSS. Dengan potensi penyesuaian yang tidak terhad, plugin ini dapat dengan mudah menjadi luar biasa – namun, kerana antara muka yang pintar, intuitif (dan tutorial berguna) ia tetap mudah digunakan sepanjang.

Pilihan penyesuaian tidak berkesudahan, membolehkan anda mengubah tema anda dengan cara yang anda bayangkan. Ini membolehkan anda membuat beberapa reka bentuk yang menarik dan asli, menggunakan asas tema anda, dan semuanya tanpa membuat tangan anda kotor dengan kodnya.

Namun, CSS Hero bukan hanya untuk pengkoden amatur. Inspector Pro adalah alat yang menarik untuk pembangun berpengalaman yang ingin membina laman web dari awal.

Tambahnya menjadikan anda boleh membina laman web dari awal, melihat ciptaan anda menjadi hidup semasa anda membuat kod, baris demi baris. Namun, lebih realistik, ia memerlukan tekaan dari penyesuaian tema, yang akan menjimatkan banyak masa untuk pembangun yang melakukan kerja klien.

Secara keseluruhan, CSS Hero adalah plugin teratas, dan yang semestinya menarik bagi pengguna WordPress dari semua tahap kemahiran. Sekiranya anda belum melakukannya, lihatlah!

(kemas kini – 16 Mac – Sejak menulis catatan ini, CSS Hero dengan baik memberikan kami yang istimewa kod kupon diskaun memberi hak kepada pembaca WinningWP untuk Diskaun 40% – lihat kupon.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map