Blok WordPress: Panduan Mendalam

Diterbitkan: 2021-10-02

Blok WordPress adalah komponen utama dari sistem pengeditan Gutenberg drag-and-drop WordPress untuk situs web.

Cara termudah untuk belajar menggunakan blok adalah melalui praktik langsung, tetapi memahami apa itu blok dan apa yang dapat mereka lakukan untuk Anda dapat membuat pembuatan halaman Anda lebih efisien dan bahkan menyenangkan.

Baik Anda baru dalam membuat situs WordPress atau ingin mengembangkan beberapa keterampilan lanjutan, panduan ini akan mengajarkan Anda lebih banyak tentang apa itu blok, blok apa yang umum digunakan orang, cara menggunakannya, dan informasi lain yang dapat meningkatkan situs Anda.

Pelajari lebih lanjut: Desain Situs Web WordPress: Cara Membuat Situs Web WordPress dari Awal

Daftar isi

Apa itu Blok WordPress?

Blok WordPress adalah elemen teks, media, atau kode khusus yang dapat Anda tambahkan ke posting blog atau halaman situs web menggunakan sistem pengeditan Gutenberg WordPress.

Apa itu Blok WordPress?
Sumber Gambar

Kebanyakan orang fokus menggunakannya untuk blog, tetapi berfungsi dengan baik untuk sebagian besar halaman lain di banyak situs web.

Blok WordPress ada untuk menyederhanakan pembuatan posting dan halaman yang terlihat bagus untuk pembaca dengan menghilangkan kebutuhan untuk mengkodekan setiap elemen secara manual. Sebagai gantinya, Anda dapat menarik dan mengatur ulang setiap blok untuk menyesuaikan tampilan halaman Anda.

Setiap blok secara fungsional merupakan elemen mandiri pada halaman, jadi mengubah satu blok tidak akan mengubah blok lainnya.

Ini bukan satu-satunya sistem pengeditan tipe blok di pasar. Beberapa layanan pesaing, seperti Ghost, juga memiliki editor tangguh yang dapat Anda gunakan untuk membuat situs web.

Namun, Ghost sebagian besar adalah platform blogging, dan editornya berfokus pada hal itu, sementara editor WordPress juga membantu untuk membuat halaman non-blog di situs web Anda.

Blok ini juga berbeda dari Drupal, sistem manajemen konten lainnya.

Drupal berfokus pada blok yang dapat muncul di beberapa bagian situs web, sedangkan WordPress berfokus pada bagian individual dari satu halaman.

Anda dapat menduplikasi konten dengan cukup mudah, tetapi blok itu sendiri tidak ditautkan dan tidak semuanya akan berubah saat Anda mengeditnya.

Pelajari lebih lanjut: Desain Halaman Arahan: 10 Halaman Arahan Inspiratif dengan Konversi Tinggi

Sejarah Gutenberg

Gutenberg adalah editor WordPress saat ini.

Awalnya diluncurkan pada tahun 2018, ini berkembang sejak saat itu menjadi sistem yang lebih matang yang mampu memberikan pengeditan yang cepat dan kuat untuk halaman web dan posting blog.

Itu masih belum selesai karena pengembang ingin menggunakannya untuk mengedit situs penuh, tetapi sekarang memiliki lebih banyak fitur secara signifikan daripada saat diluncurkan.

Blok WordPress: Sejarah Gutenberg
Sumber Gambar

Gutenberg ada karena banyak pengguna WordPress ingin memiliki cara blog yang lebih bersih dan sederhana tanpa mengedit kode agar semuanya terlihat bagus.

Di sini, penting untuk dipahami bahwa WordPress menarik banyak pengguna biasa, banyak di antaranya memiliki sedikit pengetahuan pengkodean.

Ini adalah perbedaan tajam dari tahun-tahun awal internet ketika Anda bahkan tidak akan memiliki situs web kecuali Anda memiliki pengetahuan pengkodean yang relatif maju untuk saat itu. Dengan kata lain, WordPress ingin mendukung pasar kasual, di mana proses klik-dan-seret lebih masuk akal.

Pertimbangan kedua untuk Gutenberg adalah bagaimana dan di mana orang-orang membuat blog.

Beberapa pemilik situs web menggunakan sistem text-to-speech alih-alih menulis sesuatu secara manual, sementara sistem pengeditan drag-and-drop membuatnya lebih mudah untuk membuat situs web di ponsel cerdas, tablet, dan perangkat lain.

Namun, beberapa orang masih lebih suka sistem pengeditan yang lama. Itu tidak mengejutkan karena masih menawarkan kontrol dan dukungan yang jauh lebih besar bagi pengguna yang mampu mengelola kodenya.

Gutenberg adalah editor yang hebat , tetapi karena kebutuhan, ia membatasi beberapa hal yang dapat dilakukan pengguna. Tidak ada yang sefleksibel pengkodean murni, tetapi Gutenberg lebih cepat dan lebih mudah untuk sebagian besar kebutuhan.

Pelajari lebih lanjut: Pengoptimalan Tingkat Konversi: Panduan Lengkap

Beralih Antara Editor Klasik dan Blok

WordPress tahu bahwa fleksibilitas biasanya lebih baik daripada memaksa semua orang untuk menggunakan satu sistem, dan itulah mengapa Anda dapat beralih antara sistem pengeditan klasik dan blok.

Dalam kebanyakan kasus, Anda harus menjadi administrator situs untuk beralih di antara tampilan pengeditan.

Namun, setelah Anda masuk dengan akun yang benar, Anda dapat mengubah editor di setiap halaman saat Anda memodifikasinya dengan mengeklik tombol di bagian atas layar.

Ini semua yang perlu diketahui sebagian besar pengguna, tetapi Anda dapat menyesuaikan lebih lanjut.

Blok WordPress: Beralih Antara Editor Klasik dan Blok
Sumber Gambar

Banyak plugin WordPress memungkinkan Anda membuat halaman dengan antarmuka drag-and-drop seperti Gutenberg tetapi Anda mungkin lebih suka. Mereka biasanya juga menawarkan pilihan pengeditan yang tidak dimiliki Gutenberg.

Plugin seperti Divi builder, SeedProd, dan Elementor yang populer dan mudah digunakan menawarkan sistem pengeditan di luar blok yang disediakan Gutenberg.

Plugin ini biasanya berisi alat pengubahan ukuran, komponen multi-bagian, dan templat yang disempurnakan yang semakin mengurangi proses pembuatan halaman.

Plugin eksternal sangat membantu untuk halaman non-blog, di situlah Gutenberg sering gagal. Itu dapat melakukan banyak halaman itu, tetapi belum dengan fleksibilitas yang sama seperti sistem lain dulu.

Pelajari lebih lanjut: Peta Perjalanan Pelanggan: Praktik Terbaik + Template Siap

Cara Menonaktifkan Gutenberg

Bisakah Anda menonaktifkan Gutenberg untuk pengguna tertentu? Bisakah itu dinonaktifkan sepenuhnya?

Jawaban untuk keduanya adalah ya. Ada beberapa cara untuk menonaktifkan Gutenberg jika Anda tidak ingin menggunakannya di situs Anda.

Nonaktifkan Gutenberg dengan Memasang Plugin

Metode pertama, dan bagi sebagian besar pengguna yang terbaik, adalah menggunakan plugin Editor Klasik. Ini adalah plugin resmi dari tim WordPress, dengan jutaan instalasi aktif di situs.

Blok WordPress: Nonaktifkan Gutenberg dengan Memasang Plugin
Sumber Gambar
Sumber Gambar

Editor Klasik memungkinkan Anda untuk mengatur editor default untuk setiap pengguna, memungkinkan pengguna untuk memilih editor, dan dilengkapi dengan beberapa fitur tambahan untuk mempermudah.

Ini tidak menonaktifkan Gutenberg secara teknis seperti menyembunyikannya, tetapi hasil praktisnya sama. Atau, dalam arti lain, menginstal Editor Klasik adalah bijaksana karena memungkinkan Anda menggunakan editor mana pun yang Anda inginkan, dan itu lebih baik daripada terjebak dengan satu editor sepanjang waktu.

Alternatif berbasis komunitas menggunakan plugin Nonaktifkan Gutenberg, yang tidak sepopuler Editor Klasik tetapi tidak bergantung pada dukungan resmi.

Ini adalah cara langsung dan praktis untuk menonaktifkan Gutenberg sepenuhnya atau menonaktifkannya untuk halaman, jenis posting, peran, atau tema tertentu di situs.

Untuk menginstal salah satu plugin, langkah-langkahnya sederhana:

  1. Masuk ke antarmuka WordPress Anda
  2. Di sebelah kiri, pilih 'Plugin'
  3. Pada layar Plugin yang diperluas, pilih 'Baru'
  4. Di kolom pencarian di atas, ketik nama plugin yang Anda inginkan
  5. Pilih plugin yang Anda inginkan dari hasil dan klik tombol 'Instal Sekarang'
  6. Setelah selesai, klik 'Aktifkan Plugin'

Nonaktifkan Gutenberg dengan Mengedit functions.php

Terakhir, Anda dapat memodifikasi file functions.php di situs Anda untuk menonaktifkan berbagai hal secara langsung.

Namun, ini dapat merusak situs Anda jika Anda melakukannya dengan tidak benar, jadi kami tidak menyarankan ini untuk pengguna biasa. Memasang salah satu plugin yang tercantum di atas lebih sederhana dan mudah dibalik.

Jika Anda ingin menonaktifkan Gutenberg tanpa plugin dan Anda seorang pemula dalam kode WordPress, Anda dapat mengikuti langkah-langkah ini. Metode ini menonaktifkannya untuk semua pengguna.

  1. Masuk ke antarmuka WordPress Anda (Anda harus menjadi administrator)
  2. Temukan 'Tampilan' di bilah sisi kiri dan arahkan kursor ke atasnya
  3. Pilih 'Editor Tema'
  4. Dalam daftar file di sebelah kanan, pilih 'functions.php'
  5. Buat salinan file functions.php Anda sebelumnya sebagai cadangan sehingga Anda dapat memulihkannya jika ada yang tidak beres
  6. Saat editor muncul, salin yang berikut ini dan rekatkan ke dalam file: add_filter( 'use_block_editor_for_post', '__return_false' );
  7. Klik tombol Perbarui File di bawah ini

Pelajari lebih lanjut: Penjelasan Peta Panas + Cara Membuat Peta Panas Situs Web

Jenis Umum Blok WordPress

Berikut adalah jenis blok paling umum yang tersedia di editor WordPress dasar.

Blok WordPress
Sumber GIF

Sebelum Gutenberg, kebanyakan orang mengkodekan blok-blok ini secara langsung, atau dengan alat pemformatan teks dan gambar dari editor teks kaya, dan mengatur ulang kode seperlunya untuk menyesuaikan tata letak pada halaman.

Gugus kalimat

Ini adalah blok yang paling banyak digunakan orang daripada yang lain. Seperti namanya, ini berfokus pada konten tertulis.

Editor teks mengubah setiap paragraf menjadi blok sehingga Anda dapat memindahkan dan mengatur ulang setelah menulisnya.

Gambar

Blok penyematan gambar menampung satu grafik yang dapat Anda pindahkan di sekitar halaman.

Ini datang dengan berbagai opsi perataan, termasuk mengubah ukuran gambar atau bahkan menjadi lebar penuh, melampaui batas biasa dari sebuah tema.

Sumber Gambar

Blok paragraf dan gambar bersama-sama sudah cukup untuk membuat halaman web dasar, jadi semua yang lain pada akhirnya hanya ada di sana untuk mengulangi dan meningkatkan elemen-elemen ini, mengikuti prinsip hierarki visual dasar.

Judul

Blok judul menahan teks berukuran besar untuk membagi halaman menjadi beberapa bagian dan memudahkan pengguna menemukan konten. Editor memungkinkan Anda untuk menyesuaikan ukuran judul, pemformatan, hyperlink, dan elemen lainnya sesuai kebutuhan.

WordPress mendukung hingga 6 level heading, termasuk h1 untuk judul halaman, tetapi kebanyakan orang jarang melampaui h4.

Galeri

Blok galeri adalah versi lanjutan dari blok gambar dasar dan memungkinkan Anda menambahkan banyak gambar dalam tata letak yang telah ditentukan.

Editor saat ini mendukung maksimal delapan kolom untuk gambar, ditambah opsi pengubahan ukuran, penautan, dan pemformatan lain untuk halaman.

Daftar

Blok daftar membuat daftar bernomor atau berpoin.

Ini pada dasarnya hanyalah sebuah aplikasi dari blok paragraf, tetapi memisahkan daftar ke dalam komponennya sendiri membuatnya lebih mudah untuk menghindari modifikasi pemformatan secara tidak sengaja.

Mengutip

Blok kutipan adalah blok paragraf yang diformat khusus yang membantu menyebutkan sesuatu yang sangat penting.

Sumber GIF

Kebanyakan orang menggunakan ini untuk kutipan oleh orang tertentu, tetapi Anda juga dapat menggunakannya untuk memberikan komentar atau menyoroti informasi penting.

audio

Blok audio relatif jarang di situs web, tetapi WordPress masih mendukungnya.

Ini memungkinkan Anda untuk menambahkan file audio apa pun yang Anda miliki, termasuk fitur seperti memutar audio secara otomatis atau mengulangnya.

Ingatlah bahwa sebagian besar pengguna tidak menyukai audio yang diputar secara otomatis kecuali mereka menginginkan hal itu terjadi, jadi cobalah untuk tidak mengejutkan pengunjung dengan suara yang tidak terduga.

Menutupi

Blok penutup adalah elemen pemformatan yang lebih canggih. Blok ini memungkinkan Anda memilih gambar atau video, dan terkadang teks, yang dapat Anda overlay di halaman Anda.

Sumber Gambar

Media ini dapat melayang di latar belakang, berulang, dan sebaliknya berfungsi sebagai penarik perhatian instan.

WordPress mendukung tidak adanya transparansi pada overlay, atau transparansi penuh, tetapi merekomendasikan jumlah yang moderat untuk memastikan teks Anda mudah dibaca.

Mengajukan

Blok file memungkinkan Anda memberikan tautan langsung ke file di situs web Anda sehingga pengunjung dapat mengunduhnya.

Anda dapat mengunggah hampir semua jenis file ke situs Anda, tetapi penyedia hosting Anda mungkin memiliki pertanyaan jika Anda mencoba mengunggah sesuatu yang terlalu besar atau mendapatkan terlalu banyak unduhan untuk paket Anda.

Ini adalah contoh yang baik dari keterkaitan pengembangan web.

Anda mungkin tidak akan melanggar batas jika Anda hanya mengizinkan orang mengunduh file teks dasar, tetapi berbicaralah dengan host situs web Anda sebelum menambahkan file lain. Mereka dapat memberi tahu Anda apa yang diperbolehkan dalam rencana Anda atau menyarankan alternatif sesuai kebutuhan.

Video

Blok video memungkinkan Anda menambahkan konten multimedia ke situs Anda, dengan mengunggahnya secara langsung atau menautkan konten di situs lain.

Sumber Gambar

File video cenderung sangat besar, jadi Anda biasanya memerlukan paket hosting yang bagus jika ingin memiliki file di situs Anda.

Hosting secara eksternal, seperti melalui YouTube dan menggunakan sematan YouTube, jauh lebih mudah. Gutenberg secara otomatis mengonversi beberapa tautan video ke jenis blok berbeda yang sesuai.

Cara Menggunakan Blok WordPress

Ada beberapa cara untuk menambahkan blok di editor Gutenberg. Anda dapat menambahkannya langsung dari bilah ikon atas, atau dengan mengklik tombol penyisip.

Tombol ini terlihat seperti lingkaran dengan plus di dalamnya dan memungkinkan Anda mengklik jenis blok yang akan ditambahkan.

Setelah blok berada di halaman, Anda dapat memindahkannya ke atas dan ke bawah dengan mengklik panah di sisi kiri blok. Atau, Anda dapat mengklik kisi enam titik dan menahan tombol mouse Anda, lalu seret blok ke tempat yang Anda inginkan.

Cara Menggunakan Blok WordPress
Sumber Gambar

Untuk mengedit blok, cukup klik pada ruangnya. Ini akan secara otomatis membuka informasi blok dan membiarkan Anda menyesuaikan komponen seperlunya.

Anda dapat menggunakan fungsi yang sama untuk mengubah jenis blok. Panah di panel kontrol dapat digunakan untuk memperluas atau menutup bagian editor, sedangkan tombol X memungkinkan Anda menutup editor blok dan fokus pada hal lain.

Perbedaan Antara Blok dan Widget WordPress

Blok terutama adalah konten halaman web, termasuk teks dan media seperti gambar dan audio. Jadi, apa itu widget WordPress, dan apa bedanya dengan blok?

Widget WordPress, sebaliknya, adalah konten yang dapat Anda letakkan di area khusus seperti sidebar dan footer. Editor Gutenberg sebagian besar menghindari area ini, meskipun Anda dapat memasukkan hal-hal seperti widget di konten utama Anda dengan menambahkan blok kode.

Antarmuka blok biasanya berada di sisi kanan layar saat editor halaman terbuka. Editor widget tersedia melalui area Appearance > Customizer dan melalui menu admin.

Widget biasanya muncul di setiap halaman situs web, jadi Anda tidak dapat mengeditnya dari tempat yang sama saat Anda mengedit blok.

Membuat Template Blok WordPress yang Dapat Digunakan Kembali

WordPress memungkinkan Anda membuat templat blok yang dapat digunakan kembali.

Ini berguna untuk memiliki branding dan desain yang konsisten di situs Anda tanpa membuat ulang tata letak yang tepat setiap saat. Ini sangat berguna jika Anda menggunakan perangkat lunak seperti Vectornator atau Adobe Illustrator untuk membuat grafik dan tata letak vektor tingkat lanjut.

Membuat template itu sendiri sederhana. Yang perlu Anda lakukan adalah memilih blok, klik tiga titik di bilah alat yang muncul, lalu klik Tambahkan ke Blok yang Dapat Digunakan Kembali.

Dari sana, Anda dapat mengganti namanya menjadi sesuatu yang mudah diingat dan kembali mengerjakan halaman.

Blokir template menyederhanakan hal-hal seperti logo, tombol khusus yang dibuat dalam perangkat lunak desain grafis, elemen desain, dan apa pun yang digunakan dalam pencitraan merek situs web.

Template akan memungkinkan elemen untuk ditambahkan dengan mudah di mana pun Anda inginkan tanpa harus mengulang elemen atau tata letak branding tertentu setiap kali Anda ingin menggunakannya.

Pikiran Terakhir tentang Blok WordPress

Meskipun blok WordPress tidak ideal untuk semua orang, blok tersebut merupakan titik awal yang kuat untuk membuat halaman dan mengatur konten dengan cara yang intuitif dan ramah pengguna.

Namun, hanya membaca tentang blok tidak cukup untuk menguasai penggunaannya.

Sebagai gantinya, buka situs WordPress Anda sekarang dan mulailah bermain-main di satu halaman. Dengan mendapatkan beberapa praktik langsung, Anda akan dapat menguasai penggunaannya dan mulai membuat tata letak lanjutan di situs Anda.

Sama seperti mengendarai sepeda, blok WordPress sulit dilupakan begitu Anda mempelajarinya dan dapat membantu Anda membuat hampir semua desain halaman standar.