Apakah Anda ingin mempelajari cara menggunakan editor blok Website?
Ketika Website 5.0 dirilis pada tahun 2019, ia menggantikan editor klasik lama dengan editor blok baru yang dijuluki “Gutenberg”. Editor blok memperkenalkan cara berbeda untuk membuat konten di Website.
Dalam panduan ini, kami akan menunjukkan cara menggunakan editor blok Website dan menguasainya untuk membuat postingan dan halaman blog yang memukau secara visual.
Apa Perbedaan Antara Editor Blok (Gutenberg) dan Editor Klasik?
Sebelum kita masuk ke editor blok, pertama-tama mari kita bandingkan dan pahami perbedaan antara Editor Blok Gutenberg dan Editor Klasik Lama.
Inilah tampilan editor klasik di Website:
Dan beginilah tampilan editor blok Website modern:
Seperti yang Anda lihat, mereka adalah dua editor yang sangat berbeda untuk membuat konten di Website.
Editor klasik lama adalah editor teks dengan tombol pemformatan yang sangat mirip dengan Microsoft Word.
Editor baru menggunakan pendekatan yang sama sekali berbeda, yang disebut ‘Blocks’ (oleh karena itu, nama Block Editor).
Blok adalah elemen konten yang Anda tambahkan ke layar edit untuk membuat tata letak konten. Setiap item yang Anda tambahkan ke posting atau halaman Anda adalah blok.
Anda dapat menambahkan blok untuk setiap paragraf, gambar, video, galeri, audio, daftar, dan lainnya. Ada blok untuk semua elemen konten umum, dan lebih banyak lagi yang dapat ditambahkan oleh plugin Website.
Bagaimana editor blok Website lebih baik daripada editor klasik?
Editor blok Website menawarkan cara sederhana untuk menambahkan berbagai jenis konten ke posting dan halaman Anda.
Misalnya, sebelumnya jika Anda ingin menambahkan tabel di konten Anda, maka Anda memerlukan plugin tabel terpisah.
Dengan editor blok, Anda cukup menambahkan blok tabel, memilih kolom dan baris, dan mulai menambahkan konten.
Anda dapat memindahkan elemen konten ke atas dan ke bawah, mengeditnya sebagai blok individual, dan membuat konten kaya media dengan mudah.
Yang terpenting, editor blok Website mudah digunakan dan dipelajari.
Ini memberikan keuntungan besar bagi semua pemula Website yang baru memulai blog pertama mereka atau membangun situs web bisnis DIY.
Karena itu, mari kita lihat cara menggunakan editor blok Website seperti seorang profesional untuk membuat konten yang hebat.
Inilah yang akan kita bahas dalam tutorial Gutenberg ini:
- Menggunakan Gutenberg – Editor blok Website
- Membuat postingan atau halaman blog baru
- Bagaimana cara menambahkan blok di Gutenberg
- Bekerja dengan blok di editor baru
- Menyimpan dan menggunakan kembali blok di Gutenberg
- Pengaturan penerbitan dan posting di Gutenberg
- Pengaturan plugin di editor baru
- Menambahkan beberapa blok umum di Gutenberg
- Menjelajahi beberapa blok konten baru di Gutenberg
- Kiat bonus dalam menggunakan Gutenberg seperti seorang profesional
- Menambahkan lebih banyak blok ke Editor Blok Gutenberg
- FAQ tentang Gutenberg
Menggunakan Gutenberg – Editor Blok Website
Editor blok dirancang agar intuitif dan fleksibel. Meskipun terlihat berbeda dari editor Website lama, ia masih melakukan semua hal yang dapat Anda lakukan di editor klasik.
Mari kita mulai dengan membahas hal-hal dasar yang Anda lakukan di editor klasik, dan bagaimana hal itu dilakukan di editor blok.
Membuat Postingan Blog atau Halaman Baru Menggunakan Editor Blok
Anda akan mulai membuat posting atau halaman blog baru seperti biasanya. Cukup klik pada menu Posts »Add New di admin Website Anda. Jika Anda membuat halaman, buka menu Pages » Add New.
Ini akan meluncurkan editor blok.
Cara Menambahkan Blok di Gutenberg
Blok pertama dari setiap posting atau halaman adalah judul.
Anda dapat menggunakan mouse untuk bergerak di bawah judul atau menekan tombol tab pada keyboard Anda untuk memindahkan kursor ke bawah dan mulai menulis.
Secara default, blok berikutnya adalah blok paragraf. Ini memungkinkan pengguna untuk mulai menulis segera.n
Namun, jika Anda ingin menambahkan sesuatu yang berbeda, maka Anda dapat mengklik tombol tambah blok baru (+) di sudut kiri atas editor, di bawah blok yang ada, atau di sisi kanan blok.
Mengklik tombol akan menampilkan menu tambah blok dengan bilah pencarian di atas dan blok yang biasa digunakan di bawah.
Anda dapat mengklik tab untuk menelusuri kategori blok atau mengetikkan kata kunci untuk mencari blok dengan cepat.
Jika Anda tidak ingin menggunakan mouse untuk mengklik tombol, maka Anda dapat menggunakan pintasan keyboard dengan mengetik / untuk mencari dan menambahkan blok.
Bekerja dengan Blok di Editor Baru
Setiap blok dilengkapi dengan bilah alatnya sendiri yang muncul di atas blok. Tombol di bilah alat akan berubah tergantung pada blok yang Anda edit.
Misalnya, dalam tangkapan layar ini, kami bekerja di blok paragraf yang menunjukkan tombol pemformatan dasar seperti perataan teks, tebal, miring, sisipkan tautan, dan banyak lagi.
Terlepas dari bilah alat, setiap blok juga dapat memiliki pengaturan bloknya sendiri yang akan muncul di kolom kanan layar edit Anda.
Anda dapat memindahkan blok ke atas dan ke bawah hanya dengan menyeretnya atau dengan mengklik tombol atas dan bawah di sebelah setiap blok.
Mengatur Blok dalam Grup dan Kolom
Editor blok dilengkapi dengan alat praktis untuk mengelola dan mengatur tata letak konten Anda.
Anda dapat memilih beberapa blok dengan mengkliknya sambil menekan tombol SHIFT pada keyboard Anda.
Setelah itu, klik tombol jenis blok di bilah alat untuk mengubah blok yang dipilih menjadi Grup atau Kolom.
Anda kemudian dapat menerapkan gaya ke seluruh blok grup seperti mengubah perataan atau spasinya.
Editor blok juga memungkinkan Anda untuk menambahkan blok Grup atau Kolom yang kosong. Setelah itu, Anda bisa mengisinya dengan blok lain.
Anda kemudian dapat mengisi setiap kolom dengan jenis blok apa pun untuk membuat tata letak yang indah.
Menyimpan dan Menggunakan Kembali Blok di Gutenberg
Salah satu hal terbaik tentang blok adalah mereka dapat disimpan dan digunakan kembali. Ini sangat membantu bagi pemilik situs web dan blogger yang sering kali perlu menambahkan cuplikan konten tertentu ke artikel atau halaman mereka.
Cukup klik tombol menu yang terletak di sudut kanan bilah alat setiap blok. Dari menu, pilih opsi ‘Add to reusable blocks’.
Anda harus memberikan nama untuk blok yang dapat digunakan kembali sehingga Anda dapat mengidentifikasi dan menggunakannya kembali nanti.
Editor blok sekarang akan menyimpan blok sebagai blok yang dapat digunakan kembali.
Sekarang setelah Anda menyimpan satu blok, mari kita lihat cara menambahkan blok yang dapat digunakan kembali ke postingan dan halaman Website lain di situs Anda.
Cukup edit posting atau halaman tempat Anda ingin menambahkan blok yang dapat digunakan kembali. Dari layar edit posting, klik tombol tambah blokir.
Anda akan menemukan blok tersimpan Anda di bawah tab ‘Reusable’. Anda juga dapat menemukannya dengan mengetikkan namanya di bilah pencarian.
Anda dapat mengarahkan mouse ke atasnya untuk melihat pratinjau cepat blok tersebut. Cukup klik pada blok untuk memasukkannya ke dalam posting atau halaman Anda.
Semua blok yang dapat digunakan kembali disimpan di database Website Anda, dan Anda dapat mengelolanya dengan mengklik tautan ‘kelola semua blok yang dapat digunakan kembali’.
Ini akan membawa Anda ke halaman pengelola blok. Dari sini, Anda dapat mengedit atau menghapus blok yang dapat digunakan kembali. Anda juga dapat mengekspor blok yang dapat digunakan kembali dan menggunakannya di situs web Website lainnya.
Catatan: Anda juga dapat menggunakan seluruh grup dan kolom sebagai blok yang dapat digunakan kembali. Ini memungkinkan Anda untuk menyimpan seluruh bagian dan menggunakannya kapan pun diperlukan.
Opsi Penerbitan dan Pengelolaan di Editor Blok Gutenberg
Setiap posting Website berisi banyak metadata. Ini termasuk informasi seperti tanggal publikasi, kategori dan tag, gambar unggulan, dan banyak lagi.
Semua opsi ini ditempatkan dengan rapi di kolom kanan pada layar editor.
Opsi Plugin di Gutenberg
Plugin Website dapat memanfaatkan API editor blok untuk mengintegrasikan pengaturan mereka sendiri di dalam layar edit.
Beberapa plugin populer hadir dengan bloknya sendiri. Misalnya, WPForms, plugin pembuat formulir Website terbaik memungkinkan Anda untuk menambahkan formulir ke konten Anda menggunakan blok.
Inilah cara All in One SEO untuk Website memungkinkan Anda untuk mengedit pengaturan SEO Anda di editor blok:
WooCommerce juga dilengkapi dengan blok yang dapat Anda tambahkan dengan mudah ke salah satu posting dan halaman Website Anda.
Menambahkan Beberapa Blok Umum di Editor Baru
Pada dasarnya, editor blok dapat melakukan semua yang dilakukan editor klasik. Namun, Anda akan melakukan hal-hal lebih cepat dan elegan dari sebelumnya.
1. Menambahkan gambar di editor blok Website
Ada blok gambar siap pakai di editor blok Website. Cukup tambahkan blok dan kemudian unggah file gambar atau pilih dari perpustakaan media.
Anda juga dapat menarik dan melepas gambar dari komputer Anda, dan editor akan secara otomatis membuat blok gambar untuk itu.
Setelah Anda menambahkan gambar, Anda akan dapat melihat pengaturan blok tempat Anda dapat menambahkan metadata untuk gambar seperti teks alternatif, ukuran, dan menambahkan tautan ke gambar.
2. Menambahkan tautan di editor blok
Editor blok dilengkapi dengan beberapa blok tempat Anda dapat menambahkan teks. Yang paling umum digunakan adalah blok paragraf yang dilengkapi dengan tombol tautan sisipkan di bilah alat.
Semua blok teks lain yang umum digunakan juga menyertakan tombol tautan di bilah alat.
Anda juga dapat menyisipkan tautan menggunakan pintasan keyboard, yaitu Command + K untuk Mac dan CTRL + K di komputer Windows.
3. Menambahkan galeri gambar di Gutenberg
Blok galeri berfungsi seperti blok gambar. Anda menambahkannya dan kemudian mengunggah atau memilih file gambar.
4. Menambahkan shortcode di posting Website menggunakan Gutenberg
Semua kode pendek Anda akan berfungsi seperti yang mereka lakukan di editor klasik. Anda cukup menambahkannya ke blok paragraf, atau Anda bisa menggunakan blok kode pendek.
Menjelajahi Beberapa Blok Konten Baru di Gutenberg
Editor Gutenberg berjanji untuk memecahkan beberapa masalah kegunaan lama di Website dengan memperkenalkan beberapa blok baru.
Berikut ini adalah beberapa favorit yang kami yakini akan sangat membantu pengguna.
1. Menambahkan gambar di sebelah beberapa teks di Website
Menggunakan editor lama, banyak pengguna kami tidak dapat menempatkan gambar di sebelah teks. Anda dapat melakukannya sekarang dengan blok Media & Texs.
Blok sederhana ini hadir dengan dua blok yang ditempatkan berdampingan sehingga Anda dapat dengan mudah menambahkan gambar dengan beberapa teks di sebelahnya.
2. Menambahkan tombol di postingan dan halaman Website
Menambahkan tombol ke posting atau halaman blog Anda adalah gangguan lain di editor lama. Anda harus menggunakan plugin yang membuat kode pendek untuk tombol, atau Anda harus beralih ke mode HTML dan menulis kode.
Gutenberg hadir dengan blok tombol yang memungkinkan Anda menambahkan tombol dengan cepat ke pos atau halaman mana pun.
Anda dapat menambahkan tautan untuk tombol Anda, mengubah warna, dan banyak lagi. Untuk detailnya, lihat artikel kami tentang cara menambahkan tombol dengan mudah di Website.
3. Menambahkan gambar sampul yang indah di posting blog dan halaman arahan
Fitur keren lainnya yang mungkin ingin Anda coba adalah blok ‘Cover’, yang memungkinkan Anda menambahkan gambar sampul atau sampul latar belakang berwarna ke posting dan halaman Anda.
Gambar sampul adalah gambar yang lebih luas yang sering digunakan sebagai sampul untuk bagian baru di halaman atau awal cerita. Mereka terlihat cantik dan memungkinkan Anda membuat tata letak konten yang menarik.
Cukup tambahkan blok sampul lalu unggah gambar yang ingin Anda gunakan. Anda dapat memilih warna overlay untuk sampul atau menjadikannya gambar latar tetap untuk menciptakan efek paralaks saat pengguna menggulir halaman ke bawah.
Untuk lebih jelasnya, lihat artikel kami tentang perbedaan antara gambar sampul dan gambar fitur di Website.
4. Membuat tabel di dalam artikel
Editor klasik tidak memiliki tombol untuk menambahkan tabel ke dalam posting Website Anda. Anda harus menggunakan plugin atau membuat tabel penulisan CSS dan HTML khusus.
Editor Gutenberg hadir dengan blok Tabel default, yang membuatnya sangat mudah untuk menambahkan tabel ke dalam posting dan halaman Anda. Cukup tambahkan blok lalu pilih jumlah kolom dan baris yang ingin Anda sisipkan.
Anda sekarang dapat melanjutkan dan mulai menambahkan data ke baris tabel. Anda selalu dapat menambahkan lebih banyak baris dan kolom jika diperlukan. Ada juga dua pilihan gaya dasar yang tersedia.
5. Membuat konten multi-kolom
Membuat konten multi-kolom adalah masalah lain yang tidak ditangani oleh editor klasik sama sekali. Editor blok memungkinkan Anda untuk menambahkan blok Kolom, yang pada dasarnya menambahkan dua kolom blok paragraf.
Blok kolom ini cukup fleksibel. Anda dapat menambahkan hingga 6 kolom berturut-turut dan bahkan menggunakan blok lain di dalam setiap kolom.
Kami harap tutorial Gutenberg ini membantu Anda mempelajari cara menggunakan editor blok Website. Semoga bermanfaat!
