Cara Menggunakan Editor Blok WordPress Baru (Tutorial Gutenberg)

Di WordPress 5.0, editor kandungan klasik digantikan dengan penyunting blok baru, yang dikenali sebagai Gutenberg. Sejak itu, beberapa pembaca meminta kami membuat tutorial komprehensif mengenai cara menggunakan penyunting blok Gutenberg di WordPress.


Editor blok WordPress adalah cara yang sama sekali baru dan berbeza untuk membuat kandungan di WordPress. Dalam tutorial ini, kami akan menunjukkan kepada anda bagaimana menggunakan editor blok WordPress baru dan menguasainya untuk membuat catatan dan halaman blog yang menakjubkan.

Menggunakan penyunting blok WordPress yang baru aka Gutenberg

Apa Perbezaan Antara Penyunting Blok (Gutenberg) dan Editor Klasik?

Sebelum kita menyelidiki editor baru, mari kita bandingkan dan memahami perbezaan antara Gutenberg Block Editor dan Classic Editor.

Inilah rupa editor klasik di WordPress:

Penyunting WordPress lama

Sekiranya anda menaik taraf ke WordPress 5.0, seperti inilah penyunting blok baru:

Editor Blok WordPress Baru juga dikenali sebagai Gutenberg

Seperti yang anda lihat, mereka adalah dua editor yang sama sekali berbeza untuk membuat kandungan di WordPress.

Editor klasik lama adalah penyunting teks dengan butang pemformatan yang sangat serupa dengan Microsoft Word.

Editor baru menggunakan pendekatan yang sama sekali berbeza, yang disebut ‘Blok’ (oleh itu, nama Block Editor).

Blok adalah elemen kandungan yang anda tambahkan ke layar edit untuk membuat susun atur kandungan. Setiap item yang anda tambahkan ke pos atau halaman anda adalah blok.

Anda boleh menambahkan blok untuk setiap perenggan, gambar, video, galeri, audio, senarai dan banyak lagi. Terdapat blok untuk semua elemen kandungan biasa dan banyak lagi yang dapat ditambahkan oleh pemalam WordPress.

Bagaimana penyunting blok WordPress yang baru lebih baik daripada penyunting klasik?

Editor blok WordPress yang baru menawarkan cara mudah untuk menambahkan pelbagai jenis kandungan pada catatan dan halaman anda.

Sebagai contoh, sebelumnya jika anda ingin menambahkan jadual dalam kandungan anda, maka anda memerlukan pemalam jadual yang berasingan.

Dengan editor baru, anda hanya boleh menambahkan blok meja, memilih lajur dan baris anda, dan mula menambahkan kandungan.

Blok meja

Anda boleh memindahkan elemen kandungan ke atas dan ke bawah, mengeditnya sebagai blok individu, dan membuat kandungan kaya media dengan mudah.

Yang paling penting, penyunting blok WordPress yang baru senang digunakan dan dipelajari.

Ini memberi kelebihan besar kepada semua pemula WordPress yang baru memulakan blog pertama atau membina laman web perniagaan DIY.

Oleh itu, mari kita lihat bagaimana menggunakan editor blok WordPress baru seperti seorang profesional untuk membuat kandungan yang hebat.

Inilah yang akan kita bahas dalam tutorial Gutenberg ini:

  1. Menggunakan Gutenberg – Penyunting blok WordPress yang baru
  2. Membuat catatan atau halaman blog baru
  3. Cara menambah blok di Gutenberg
  4. Bekerja dengan blok dalam editor baru
  5. Menyimpan dan menggunakan semula blok di Gutenberg
  6. Tetapan penerbitan dan siaran di Gutenberg
  7. Tetapan pemalam dalam penyunting baru
  8. Menambah beberapa blok biasa di Gutenberg
  9. Meneroka beberapa blok kandungan baru di Gutenberg
  10. Petua bonus untuk menggunakan Gutenberg seperti profesional
  11. Menambah lebih banyak blok ke Gutenberg Block Editor
  12. Soalan Lazim mengenai Gutenberg

Sedia? Mari selami.

Menggunakan Gutenberg – Penyunting Blok WordPress Baru

Penyunting blok dirancang untuk menjadi intuitif dan fleksibel. Walaupun kelihatan berbeza daripada editor WordPress lama, ia tetap melakukan semua perkara yang dapat anda lakukan di editor klasik.

Mari kita mulakan dengan merangkumi perkara-perkara asas yang anda lakukan dalam editor klasik dan bagaimana ia dilakukan dalam penyunting blok.

Membuat Catatan atau Halaman Blog Baru Menggunakan Editor Blok

Anda akan mula membuat entri atau halaman blog baru seperti biasa. Cukup klik pada Catatan »Tambah Baru menu di pentadbir WordPress anda. Sekiranya anda membuat halaman, kemudian pergi ke Halaman »Tambah Baru menu.

Menambah catatan baru

Ini akan melancarkan penyunting blok baru.

Cara Menambah Blok di Gutenberg

Blok pertama setiap catatan atau halaman adalah tajuk.

Selepas itu, anda boleh menggunakan tetikus untuk bergerak di bawah tajuk atau tekan kekunci tab pada papan kekunci anda untuk bergerak ke bawah dan mula menulis.

Menambah tajuk catatan di Gutenberg

Secara lalai, blok seterusnya adalah blok perenggan. Ini membolehkan pengguna mula menulis dengan segera.

Walau bagaimanapun, jika anda ingin menambahkan sesuatu yang berbeza, anda boleh mengklik butang tambah blok baru di sudut kiri atas editor, di bawah blok yang ada, atau di sebelah kiri blok.

Tambah butang blok baru

Mengklik pada butang akan menunjukkan menu tambah blok dengan bar carian di atas dan blok yang biasa digunakan di bawah.

Anda boleh mengklik tab untuk melihat kategori blok atau memasukkan kata kunci untuk mencari blok dengan cepat.

Mencari dan menambah blok di Gutenberg

Sekiranya anda tidak mahu menggunakan tetikus untuk mengklik butang, anda boleh menggunakan pintasan papan kekunci dengan menaip / untuk mencari dan menambahkan blok.

Bekerja dengan Blocks di The New Editor

Setiap blok dilengkapi dengan bar alat sendiri yang muncul di atas blok. Butang di bar alat akan berubah bergantung pada blok yang anda edit.

Sebagai contoh, dalam tangkapan skrin ini, kami sedang bekerja di blok perenggan yang menunjukkan butang pemformatan asas seperti: penjajaran teks, tebal, miring, pautan sisipan, dan butang coretan.

Setiap blok dilengkapi dengan bar alat sendiri

Selain dari bar alat, setiap blok juga dapat memiliki pengaturan bloknya sendiri yang akan muncul di lajur kanan layar edit anda.

Sekatan tetapan

Anda boleh memindahkan blok ke atas dan ke bawah dengan seret dan lepas sederhana atau dengan mengklik butang atas dan bawah di sebelah setiap blok.

Menggerakkan blok ke atas dan ke bawah

Menyimpan dan Menggunakan Semula Blok di Gutenberg

Salah satu perkara terbaik mengenai blok ialah ia dapat disimpan dan digunakan semula secara individu. Ini sangat berguna bagi blogger yang sering perlu menambahkan potongan kandungan tertentu pada artikel mereka.

Cukup klik pada butang menu yang terletak di sudut kanan bar alat setiap blok. Dari menu, pilih pilihan ‘Tambahkan ke blok yang dapat digunakan kembali’.

Menyimpan sekatan untuk digunakan semula kemudian

Anda akan diminta memberikan nama untuk blok yang boleh digunakan semula ini. Masukkan nama untuk blok anda dan kemudian klik pada butang simpan.

Memberi nama kepada blok yang boleh digunakan semula

Penyunting blok sekarang akan menyimpan blok tersebut sebagai blok yang boleh digunakan semula.

Sekarang setelah anda menyimpan blok, mari kita lihat cara menambahkan blok yang boleh digunakan semula ke dalam catatan dan halaman WordPress lain di laman web anda.

Cukup edit siaran atau halaman di mana anda ingin menambahkan blok yang boleh digunakan semula. Dari skrin edit pos, klik pada butang tambah blok.

Anda akan menemui blok yang anda simpan di bawah tab ‘Reusable’. Anda juga boleh mencarinya dengan menaip namanya di bar carian.

Masukkan blok yang boleh digunakan semula

Anda boleh meletakkan tetikus di atasnya untuk melihat pratonton sekatan sekilas. Cukup klik pada blok untuk memasukkannya ke dalam pos atau halaman anda.

Semua blok yang boleh digunakan semula disimpan dalam pangkalan data WordPress anda, dan anda boleh menguruskannya dengan mengklik pada pautan ‘urus semua blok yang boleh digunakan semula’.

Uruskan blok anda yang boleh digunakan semula

Ini akan membawa anda ke halaman pengurus blok. Dari sini, anda boleh mengedit atau menghapus mana-mana blok yang boleh anda gunakan semula. Anda juga boleh mengeksport blok yang boleh digunakan semula dan menggunakannya di laman web WordPress yang lain.

Import blok eksport yang boleh digunakan semula di WordPress

Pilihan Penerbitan dan Urusan di Penyunting Blok Gutenberg

Setiap catatan WordPress mengandungi banyak metadata. Ini merangkumi maklumat seperti tarikh penerbitan, kategori dan tag, gambar pilihan dan banyak lagi.

Semua pilihan ini diletakkan dengan kemas di lajur kanan di skrin editor.

Tetapan dokumen di Gutenberg penyunting WordPress baru

Pilihan Pemalam di Gutenberg

Plugin WordPress dapat memanfaatkan API editor blok untuk mengintegrasikan tetapannya sendiri dalam skrin edit.

Beberapa pemalam yang popular sudah tersedia sebagai blok. Sebagai contoh, WPForms, plugin pembangun borang WordPress terbaik membolehkan anda menambahkan borang ke dalam kandungan anda menggunakan blok widget.

WPForms menyekat penyunting Gutenberg yang baru

Inilah cara Yoast SEO membolehkan anda mengedit tetapan SEO anda di editor baru:

Tetapan SEO Yoast dalam editor Gutenberg baru

WooCommerce juga dilengkapi dengan blok widget yang dapat anda tambahkan dengan mudah ke mana-mana catatan dan halaman WordPress anda.

Sekatan produk WooCommerce

Menambah Beberapa Blok Biasa dalam Editor Baru

Pada dasarnya, editor baru dapat melakukan semua yang dilakukan oleh editor klasik. Namun, anda akan melakukan sesuatu dengan lebih cepat dan elegan daripada sebelumnya.

1. Menambah gambar dalam editor WordPress baru

Terdapat blok gambar yang siap digunakan dalam penyunting WordPress baru. Cukup tambahkan blok dan kemudian muat naik fail gambar atau pilih dari perpustakaan media.

Blok gambar dalam penyunting WordPress baru

Anda juga boleh menyeret dan melepaskan gambar dari komputer anda, dan editor secara automatik akan membuat blok gambar untuknya.

Setelah anda menambah gambar, anda akan dapat melihat tetapan blok di mana anda dapat menambahkan metadata untuk gambar seperti teks alt, ukuran, dan menambahkan pautan ke gambar.

Tetapan blok gambar

2. Menambah pautan di Editor blok baru

Editor blok dilengkapi dengan beberapa blok di mana anda boleh menambahkan teks. Yang paling sering digunakan adalah blok perenggan yang dilengkapi dengan butang pautan sisipan di bar alat.

Semua blok teks lain yang biasa digunakan juga menyertakan butang pautan di bar alat.

Butang pautan di blok senarai

Anda juga boleh memasukkan pautan menggunakan jalan pintas papan kekunci, iaitu Command + K untuk Mac dan CTRL + K pada komputer Windows.

3. Menambah galeri gambar di Gutenberg

Blok galeri berfungsi seperti blok gambar. Anda menambahkannya dan kemudian memuat naik atau memilih fail gambar.

Menambah galeri gambar dalam editor WordPress baru

4. Menambah kod pendek dalam catatan WordPress menggunakan Gutenberg

Semua kod pendek anda akan berfungsi seperti yang dilakukan di editor klasik. Anda boleh menambahkannya ke blok perenggan, atau anda boleh menggunakan blok kod pendek.

Menambah blok kod pendek

Meneroka Beberapa Sekatan Kandungan Baru di Gutenberg

Editor Gutenberg berjanji untuk menyelesaikan beberapa masalah kebolehgunaan lama di WordPress dengan memperkenalkan beberapa blok baru.

Berikut adalah beberapa kegemaran yang kami percaya pengguna akan sangat membantu.

1. Menambah gambar di sebelah beberapa teks di WordPress

Menggunakan editor lama, ramai pengguna kami tidak dapat meletakkan gambar di sebelah teks. Anda boleh melakukan ini sekarang dengan Media & Teks sekatan.

Blok media dan Teks

Blok sederhana ini dilengkapi dengan dua blok yang diletakkan bersebelahan yang membolehkan anda dengan mudah menambahkan gambar dan menambahkan beberapa teks di sebelahnya.

2. Menambah butang dalam catatan dan halaman WordPress

Menambah butang pada catatan blog atau halaman anda adalah satu lagi gangguan di editor klasik. Anda mesti menggunakan plugin yang membuat kod pendek untuk butang, atau anda harus beralih ke mod HTML dan menulis kod.

Gutenberg dilengkapi dengan sekatan butang yang membolehkan anda menambahkan butang ke pos atau halaman mana pun dengan cepat.

Menambah blok butang di Gutenberg

Anda boleh menambahkan pautan untuk butang anda, menukar warna, dan memilih dari tiga gaya butang.

3. Menambah gambar sampul yang indah dalam catatan blog dan halaman arahan

Satu lagi ciri menarik yang mungkin ingin anda cuba ialah blok ‘Cover’, yang membolehkan anda menambahkan gambar sampul ke post dan halaman anda.

Gambar sampul adalah gambar yang lebih luas yang sering digunakan sebagai penutup untuk bahagian baru dalam halaman atau permulaan cerita. Ia kelihatan cantik dan membolehkan anda membuat susun atur kandungan yang menarik.

Cukup tambahkan blok penutup dan kemudian muat naik gambar yang ingin anda gunakan. Anda boleh memilih warna hamparan untuk sampul atau menjadikannya gambar latar tetap untuk mencipta kesan paralaks ketika pengguna menatal halaman.

Blok gambar sampul dalam penyunting Gutenberg

4. Membuat jadual di dalam artikel

Editor klasik tidak mempunyai butang untuk menambahkan jadual ke dalam catatan WordPress anda. Anda harus menggunakan plugin atau membuat jadual menulis CSS dan HTML tersuai.

Editor Gutenberg baru dilengkapi dengan blok Jadual lalai, yang menjadikannya sangat mudah untuk menambahkan jadual ke dalam catatan dan halaman anda. Cukup tambahkan blok dan kemudian pilih bilangan lajur dan baris yang ingin anda masukkan.

Blok meja

Anda kini boleh terus maju dan mula menambahkan data ke baris jadual. Anda sentiasa dapat menambahkan lebih banyak baris dan lajur jika diperlukan. Terdapat juga dua pilihan gaya asas yang ada.

5. Membuat kandungan berbilang lajur

Membuat kandungan berbilang lajur adalah masalah lain yang tidak ditangani oleh editor klasik. Penyunting blok membolehkan anda menambahkan blok Lajur, yang pada dasarnya menambah dua lajur blok perenggan.

Kandungan berbilang lajur

Blok lajur ini cukup fleksibel. Anda boleh menambahkan hingga 6 lajur berturut-turut dan bahkan menggunakan blok lain di dalam setiap lajur.

Petua Bonus untuk Menggunakan Gutenberg seperti Pro

Melihat penyunting blok baru, anda mungkin tertanya-tanya sama ada anda akan menghabiskan lebih banyak masa untuk menambah dan menyesuaikan blok daripada membuat kandungan sebenar?

Nah, penyunting baru sangat pantas dan penggunaan yang sangat mendasar selama beberapa minit akan membolehkan anda menambah blok dengan serta-merta tanpa berfikir.

Tidak lama lagi, anda akan menyedari betapa cepatnya aliran kerja anda dengan pendekatan baru ini.

Untuk pengguna tenaga, berikut adalah beberapa petua bonus untuk membantu anda bekerja lebih pantas dengan penyunting WordPress yang baru.

1. Gerakkan bar alat blok ke bahagian atas.

Seperti yang anda perhatikan di tangkapan layar bahawa terdapat bar alat yang muncul di atas setiap blok. Anda boleh memindahkan bar alat ini ke bahagian atas editor.

Cukup klik pada butang tiga titik di sudut kanan atas skrin dan kemudian pilih pilihan Bar Alat Atas.

Gerakkan bar alat blok ke bahagian atas editor

2. Gunakan pintasan papan kekunci

Gutenberg dilengkapi dengan beberapa jalan pintas yang berguna yang akan menjadikan aliran kerja anda lebih baik. Yang pertama anda harus mula menggunakan segera adalah /.

Cukup masukkan / dan kemudian mulailah menaip, dan ia akan menunjukkan blok yang sepadan yang boleh anda tambahkan dengan serta-merta.

Untuk jalan pintas yang lebih banyak, klik pada menu tiga titik di sudut kanan atas skrin anda dan kemudian pilih ‘Pintasan Papan Kekunci’.

Lancarkan pintasan papan kekunci

Ini akan memunculkan pop timbul dengan senarai semua pintasan papan kekunci yang boleh anda gunakan. Senarai ini akan mempunyai jalan pintas yang berbeza untuk pengguna Windows dan Mac.

3. Seret dan lepaskan media untuk membuat blok media secara automatik

Gutenberg membolehkan anda menyeret dan melepaskan fail ke mana sahaja di skrin dan secara automatik akan membuat blok untuk anda.

Anda boleh menjatuhkan satu gambar atau fail video, dan ia akan membuat blok untuk anda. Anda juga boleh menjatuhkan banyak fail gambar untuk membuat blok galeri.

Seret dan lepas blok galeri dalam penyunting WordPress baru

4. Menambah YouTube, Twitter, Facebook, Vimeo, dan embed lain

Gutenberg memperkenalkan blok penyematan baru kepada penyunting blok. Terdapat blok untuk semua jenis embed yang disokong termasuk YouTube, Twitter, Facebook, dan banyak lagi.

Benamkan blok

Walau bagaimanapun, anda boleh menyalin dan menampal URL penyisipan pada bila-bila masa, dan secara automatik akan membuat blok untuk anda.

Contohnya, jika anda menambahkan URL video YouTube, secara automatik ia akan membuat blok penyematan YouTube dan memaparkan video tersebut.

Benamkan YouTube

Menambah Lebih Banyak Blok ke Penyunting Blok Gutenberg di WordPress

Editor blok baru di WordPress membolehkan pemaju membuat blok mereka sendiri. Terdapat beberapa plugin WordPress yang hebat yang menawarkan kumpulan blok untuk editor baru.

Berikut adalah beberapa daripadanya:

1. Advanced Gutenberg

Lanjutan Gutenberg

Advanced Gutenberg hadir dengan beberapa blok untuk elemen kandungan popular seperti slaid produk WooCommerce, testimoni, peta, kaunter, tab, akordeon, dan banyak lagi.

Ini juga memberi anda kawalan lanjutan di mana pengguna dapat mengakses blok berdasarkan peranan pengguna mereka. Anda boleh membuat profil pengguna dan memilih blok mana yang dapat mereka tambahkan.

2. Stackable – Blok Gutenberg

Stackable - Blok Gutenberg

Stackable – Gutenberg Blocks adalah koleksi blok Gutenberg yang direka dengan indah yang boleh anda gunakan di laman web anda. Ia merangkumi blok untuk bekas, tiang, grid ciri, akordeon, kotak gambar, senarai ikon, ajakan bertindak, dan banyak lagi.

3. Blok Penyunting

Penyekat blok untuk Gutenberg

Editor Blocks adalah satu lagi koleksi blok Gutenberg yang boleh anda gunakan. Ia dilengkapi dengan blok berguna seperti profil pengarang, gambar wira, jadual harga, jenama, ciri dan banyak lagi.

Soalan Lazim mengenai Gutenberg – Penyunting Blok Baru di WordPress

Sejak Gutenberg menjadi editor WordPress yang baru, kami telah mendapat banyak soalan. Berikut adalah jawapan kepada beberapa soalan yang paling sering ditanya mengenai Gutenberg.

1. Apa yang berlaku pada catatan dan halaman lama saya? Masih boleh saya mengeditnya?

Catatan dan halaman lama anda benar-benar selamat dan tidak terjejas oleh Gutenberg. Anda masih boleh mengeditnya, dan Gutenberg secara automatik akan membukanya di blok yang mengandungi editor klasik.

Menyunting artikel lama dalam editor WordPress baru

Anda boleh mengeditnya di dalam editor lama, atau anda boleh menukar artikel lama menjadi blok dan menggunakan editor blok baru.

2. Adakah saya masih boleh menggunakan editor lama?

Ya, anda masih boleh terus menggunakan editor lama. Cukup pasang dan aktifkan pemalam Editor Klasik.

Setelah diaktifkan, ia akan mematikan editor blok, dan anda akan dapat terus menggunakan editor klasik.

Harap maklum bahawa Editor Klasik akan disokong sehingga 2022.

3. Apa yang perlu dilakukan jika editor baru tidak berfungsi dengan plugin atau tema yang saya gunakan?

Projek Gutenberg sudah lama dibangun. Ini memberikan banyak masa kepada pengarang tema dan pengarang untuk menguji kesesuaian kod mereka.

Namun, masih ada kemungkinan beberapa plugin dan tema mungkin tidak berfungsi dengan baik dengan editor baru. Sekiranya demikian, anda boleh memasang plugin editor klasik, meminta pembangun untuk menambahkan sokongan Gutenberg, atau hanya mencari plugin atau tema alternatif.

4. Cara mengetahui lebih banyak petua dan trik Gutenberg?

WPBeginner adalah tempat terbaik untuk belajar mengenai penyunting blok baru di WordPress. Kami adalah laman sumber WordPress terbesar di internet.

Kami akan menerbitkan artikel baru dan mengemas kini sumber lama kami untuk membantu anda menguasai penyunting blok baru.

Sementara itu, jika anda mempunyai pertanyaan, jangan ragu untuk menghubungi kami dengan memberikan komen atau menggunakan borang hubungan di laman web kami.

Kami harap tutorial Gutenberg ini dapat membantu anda mempelajari cara menggunakan penyunting blok WordPress yang baru. Anda mungkin juga ingin melihat panduan prestasi WordPress lengkap kami untuk meningkatkan kelajuan laman web anda.

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