Kita akan membandingkan keduanya sekaligus menjelajahi alat-alat yang ada di dalam Site Editor. Pada akhirnya, kita akan merasa lebih percaya diri dalam menggunakan keduanya secara bersamaan untuk membangun seluruh tata letak situs kita.
Block Editor vs Site Editor
Site Editor memberi kita kebebasan untuk membangun setiap aspek situs WordPress, mulai dari header hingga footer, menggunakan kekuatan blok yang terdapat dalam fitur Site Editor.
Namun, apa sebenarnya Site Editor itu? Apa bedanya dengan Block Editor yang sudah biasa kita gunakan? Bagaimana kita bisa menggunakan template di Site Editor untuk membangun struktur keseluruhan situs?
Mari kita jelajahi dasbor WordPress untuk menjawab pertanyaan-pertanyaan penting ini dan membandingkan keduanya.
Block Editor adalah dasar dari konten situs Anda dan digunakan untuk menambahkan isi ke halaman maupun postingan.
Untuk mengingat kembali cara menambahkan konten halaman atau postingan: di dasbor, buka menu Pages jika Anda ingin membuat halaman statis, atau buka Posts untuk konten dinamis seperti artikel blog. Saat Anda mengklik Add New, Anda akan membuat konten untuk halaman atau posting tersebut.
Apa yang bisa dilakukan Site Editor dibandingkan dengan itu?
Site Editor memungkinkan kita mengedit situs secara menyeluruh dan terpadu.
Jika halaman dan postingan hanya digunakan untuk menambahkan konten statis atau dinamis menggunakan blok, maka Site Editor menggunakan blok untuk membangun tampilan dan nuansa keseluruhan situs melalui template.
Selain itu, Site Editor juga memungkinkan kita menambah dan mengedit halaman agar pengalaman mengedit situs menjadi lebih lancar.
Jika Anda menggunakan tema blok seperti Twenty Twenty-Four, Anda dapat mengakses Site Editor melalui menu Appearance β Editor.
Mengenal Area Site Editor
Setelah Site Editor terbuka, halaman depan situs akan muncul dalam mode edit. Di sebelah kiri terdapat sidebar tampilan situs (site view sidebar).
Alat ini memungkinkan Anda berpindah antarbagian utama situs: Navigation, Styles, Pages, Templates, dan Patterns.
π§ Navigation
Di sini Anda dapat melihat dan menyesuaikan semua menu dengan cepat β mengganti nama, mengatur ulang item menu, dan sebagainya.
π¨ Styles
Ketika Anda mengklik Styles, Anda bisa mengubah kombinasi gaya dari tema Anda.
Klik Edit Styles untuk mengubah tipografi, warna, dan tata letak seluruh situs.
Lebih jauh ke bawah, Anda juga bisa menyesuaikan tampilan blok tertentu untuk seluruh situs.
Untuk melihat hasil perubahan, buka Style Book situs Anda. Di sana Anda bisa meninjau semua perubahan gaya yang dibuat.
π Pages
Di bagian Pages, Anda dapat membuat dan mengedit halaman seperti halnya di dasbor.
Fitur ini memungkinkan Anda tetap berada di Site Editor saat mengedit konten halaman.
Ketika mengedit halaman di dalam Site Editor, kita menambahkan konten melalui Content block.
π§© Patterns
Selanjutnya, di bagian Patterns, Anda akan menemukan pustaka pola blok (block patterns).
Anda dapat membuat dan mengelola pola sendiri, serta melihat pola yang disediakan oleh tema.
Selain itu, Anda juga bisa membuat dan mengelola template parts β yaitu kumpulan blok yang dapat digunakan kembali untuk bagian yang berulang seperti header dan footer.
ποΈ Templates
Sekarang kita fokus ke Templates.
Bagian ini memungkinkan Anda mengatur tata letak situs menggunakan blok untuk menambahkan header, footer, atau sidebar.
Saat Anda membuka Templates, lihat menu di bagian atas:
-
Ikon Plus (+) atau Inserter digunakan untuk menambahkan blok atau pola blok ke dalam template.
-
Di sebelahnya ada tombol Undo dan Redo.
-
List View menampilkan daftar semua blok di halaman β sangat berguna untuk melihat struktur halaman dan memindahkan atau menghapus blok.
-
Di tengah atas terdapat nama template yang sedang diedit.
-
Tombol Preview memungkinkan Anda melihat tampilan situs di desktop, tablet, atau ponsel.
-
Klik Save untuk menyimpan perubahan.
-
Settings tab menampilkan atau menyembunyikan sidebar pengaturan template dan blok.
-
Styles tab memberi akses cepat ke pengaturan gaya.
-
Dan ikon tiga titik vertikal memberi lebih banyak opsi, seperti Spotlight Mode, dan lainnya.
Cara Kerja Template
Di bagian atas tertulis, βUngkapkan tata letak situs Anda dengan template.β
Template menggunakan blok untuk membangun desain keseluruhan situs dengan menambahkan header, footer, atau sidebar.
Contohnya, saat membuka template halaman dengan sidebar, Anda akan melihat struktur yang terdiri dari header, sidebar, dan footer.
Perlu diingat, template dapat diterapkan pada satu atau beberapa halaman sekaligus.
Misalnya, kita ingin menambahkan template khusus untuk halaman. Tema biasanya menyediakan beberapa pilihan, seperti:
-
Default Page Template
-
Page with Wide Image
-
Page with No Title
Kita pilih Page with No Title.
Ketika template dimuat, Anda akan melihat contoh tampilannya tanpa konten apa pun.
Di sinilah List View sangat berguna. Sidebar di kiri akan menampilkan struktur blok penyusun template tersebut β seperti Header, Footer, dan Group block yang berisi Post Content block.
Blok Post Content ini sangat penting β blok inilah yang menampilkan isi dari halaman atau postingan Anda di dalam template. Tanpa blok ini, konten halaman tidak akan muncul.
Ingat: kita tidak menambahkan konten ke dalam template, tetapi hanya mengubah elemen seperti header, footer, atau sidebar.
Mengganti Header
Sekarang mari kita ganti header dengan pola header lain dari tema.
Kita bisa memilih pola Centered Header with Logo dan memilih menu navigasi bernama Lifestyle.
Setelah dipilih, klik Save β template halaman berhasil disimpan.
Untuk menerapkan template ini ke halaman tertentu, kembali ke Dashboard β Pages, buka halaman yang diinginkan, lalu di panel kanan, klik bagian Template.
Pilih template Page with No Title, lalu klik Update.
Sekarang, Anda bisa melihat perbedaannya:
-
Halaman dengan template default
-
Halaman dengan template Page with No Title
Langkah ini bisa diterapkan pada halaman maupun postingan lain sesuai kebutuhan.
Kesimpulan
Seperti yang telah kita lihat, Block Editor dan Site Editor saling melengkapi.
Block Editor digunakan untuk menambahkan konten ke halaman dan postingan,
sementara Site Editor memungkinkan Anda mengedit tampilan situs secara menyeluruh β dari gaya, struktur template, hingga isi halaman.
Dengan memahami keduanya, Anda bisa membangun situs WordPress yang konsisten, menarik, dan mudah dikelola.

