Reusable Blocks WordPress: Synced Patterns vs Patterns vs Template Parts

Reusable blocks WordPress adalah cara praktis untuk menjaga section penting tetap konsisten dan mudah di-update di banyak halaman, terutama kalau Anda bekerja dengan Block Editor (Gutenberg) dan Full Site Editing.

Panduan ini ditulis untuk WordPress versi 6.9 ke atas dan tetap kompatibel untuk workflow versi stabil 6.5.x. Kami menggunakan seminimal mungkin bahasa teknis agar mudah dipahami dan nyaman dibaca oleh pengguna WordPress umum.

Perbedaan antara Reusable Blocks, Patterns, dan Template Parts

Istilahnya memang mirip, tapi fungsinya beda. Patterns adalah layout template yang bisa Anda sisipkan untuk mempercepat produksi halaman. Di sisi lain, synced patterns adalah pattern yang sinkron dan berperilaku sama seperti reusable block.

Berbeda dengan patterns, Template Parts adalah komponen struktur tema seperti header dan footer yang dipakai di template. Ini sangat membantu dalam merajut tema WordPress Anda.

Di versi WordPress modern, “Reusable Blocks” sudah diarahkan menjadi Patterns, dan opsi “Synced” membuatnya bekerja seperti reusable block.

Key Takeaways

• Patterns (unsynced) cocok untuk mempercepat membuat layout, tapi tiap instance bisa Anda edit berbeda karena tidak ada sinkronisasi.
• Synced patterns adalah pengganti perilaku reusable, edit sekali dan perubahan akan ikut terapkan di semua tempat pattern itu digunakan.
• Template Parts dipakai untuk struktur global pada block theme, dan hanya digunakan saat membuat atau mengedit template, bukan saat menulis konten harian.
• Kesalahan paling umum adalah mengira semua pattern itu sinkron, padahal sebagian besar pattern hanya berfungsi sebagai layout awal.

Aspek	Patterns (unsynced)	Reusable Blocks dan Synced patterns	Template Parts
Kemampuan sinkron	Tidak sinkron, setelah disisipkan tiap instance bisa berbeda.	Sinkron, edit synced pattern akan update di semua pemakaian.	Perubahan template part akan terapkan ke semua template yang menyertakan template part tersebut.
Lokasi dan workflow edit	Umumnya dari editor konten saat membuat halaman atau post.	Edit dari instance di halaman, atau dari Options lalu Manage Patterns.	Edit lewat Site Editor atau Template Editor saat mengedit template dan template parts.
Paling cocok untuk	Hero layout, section konten, kerangka landing page.	CTA yang sama, disclaimer, modul FAQ yang harus konsisten.	Header, footer, struktur navigasi global, layout struktur tema.
Confusion yang sering terjadi	Ekspektasi salah, mengira perubahan akan update di semua halaman.	Lupa dampaknya global karena satu perubahan bisa mengubah banyak halaman.	Mengira sama dengan Page Template, padahal ini hanya bagian reusable dari template.

Kalau tujuan Anda adalah konsistensi brand dan efisiensi produksi konten, gunakan Synced patterns untuk konten yang wajib sama. Selain itu, Anda bisa menggunakan Pattern biasa untuk mempercepat layout dan Template Parts untuk struktur di level tema.

Membuat dan Mengedit Reusable/Synced Blocks

Bagaimana cara membuat reusable block? Pertanyaan ini sering muncul khususnya pada pengguna WordPress yang baru mulai mencoba bekerja dengan WordPress Block Editor. Saat ini Anda bisa melakukannya dengan membuat pattern lalu mengaktifkan opsi Synced, karena Synced pattern berperilaku sama seperti reusable block.

Cara Membuat Synced Pattern (Reusable Behavior)

1. Di halaman atau post, susun section Anda dari beberapa blok, misalnya Group, Heading, Paragraph, dan Buttons.
2. Pilih semua blok yang ingin dijadikan satu paket, List View sangat membantu untuk seleksi yang rapi.
3. Klik menu tiga titik pada toolbar blok, lalu pilih “Create pattern”.
4. Masukkan nama pattern yang jelas, misalnya “CTA – Konsultasi Gratis”.
5. Aktifkan opsi “Synced” agar perubahan nanti sinkron ke semua pemakaian.
6. Klik Create, lalu uji dengan menyisipkannya di halaman lain.

Cara Mengedit Synced Pattern

• Edit dari instance: buka halaman yang memakai section itu, edit bloknya, lalu simpan, perubahan akan ikut sinkron jika itu memang Synced pattern.
• Edit dari pusat pengelolaan: buka Options lalu “Manage Patterns”, cari berdasarkan nama, dan edit dari satu tempat.
• Butuh versi khusus untuk satu halaman: gunakan “Detach pattern” supaya instance tersebut bisa Anda ubah tanpa memengaruhi pattern tersimpan.

Best practice untuk tim adalah memberi nama berdasarkan fungsi dan konteks, bukan hanya “CTA 1”, supaya Anda tidak salah edit komponen yang dipakai di banyak halaman. Naming yang rapi juga membuat Pattern Library lebih mudah dicari.

Use Cases

• CTA blocks: tombol WhatsApp, tombol booking, atau form singkat yang muncul di banyak halaman.
• FAQ sections: versi ringkas yang harus konsisten di beberapa halaman layanan.
• Hero banners: gunakan pattern unsynced untuk variasi konten, atau Synced bila pesannya harus seragam.
• Trust badges: garansi, fast response, gratis konsultasi, yang tidak boleh berubah ubah antar halaman.
• Legal snippets: disclaimer, catatan kebijakan, atau informasi kontak standar.

Cara Memanfaatkan Pattern Library

Pattern Library membantu Anda publish lebih cepat karena Anda tidak perlu menyusun layout dari nol setiap kali. Untuk konteks WordPress 6.9, anggap pattern sebagai template mini yang Anda insert saat membangun halaman, lalu Anda sesuaikan sesuai kebutuhan.

Intinya ada dua model. Unsynced untuk starter layout yang fleksibel, Synced untuk controlled reuse yang konsisten dan mudah di-update.

Langkah-langkah Menyimpan Layout sebagai Pattern

1. Buat satu section lengkap, misalnya Hero yang berisi heading, subheading, image, dan button.
2. Rapikan spacing, alignment, dan typography agar sesuai style guide.
3. Seleksi semua blok section tersebut sebagai satu paket, idealnya dari List View.
4. Buka menu tiga titik pada toolbar selection, lalu pilih “Create pattern”.
5. Beri nama yang spesifik, misalnya “Hero – Layanan Renovasi”.
6. Pilih kategori kalau tersedia agar mudah dicari tim.
7. Tentukan synced atau tidak. Pilih synced untuk konsistensi total, pilih unsynced untuk variasi per halaman.
8. Insert lagi dari inserter ke halaman baru untuk memastikan tampil sesuai.

Kalau Anda sering bikin landing page, siapkan 10 sampai 20 pattern baseline yang sesuai brand. Dari situ Anda tinggal ganti copy, gambar, dan link tanpa mengulang layout.

Memahami Template Parts

Template Parts adalah blok lanjutan yang digunakan untuk mengatur struktur website yang berulang, seperti header dan footer, dan hanya bisa dipakai saat Anda membuat atau mengedit template. Ini adalah fondasi penting untuk template parts block theme dan workflow Full Site Editing.

Keunggulannya ada di dampak global. Saat Anda mengubah blok di dalam template part, editor akan memperbarui blok tersebut di setiap template yang menyertakan template part itu.

Template Parts vs Page Templates

• Page Template: kerangka satu jenis halaman, misalnya Single Post, Page, Archive, atau Search.
• Template Part: potongan dari template yang reusable, misalnya header yang sama dipakai untuk homepage dan blog.
• Kalau Anda mengubah logo atau menu di Header template part, perubahan itu muncul di semua template yang memakai header tersebut.

Cara Edit Template Parts via Site Editor

1. Buka Appearance, lalu Editor (Site Editor).
2. Masuk ke Templates, pilih template yang ingin Anda cek, misalnya “Single”.
3. Klik area Header atau Footer yang merupakan Template Part, lalu klik Edit untuk masuk focus mode agar lebih mudah.
4. Lakukan perubahan, misalnya navigasi, spacing, warna, atau menambah blok search.
5. Simpan, lalu preview beberapa halaman untuk memastikan layout tetap rapi.

Kapan Menggunakan Pattern dan Reusable Block?

Gunakan Pattern (unsynced) saat Anda butuh kerangka layout yang sama tapi isi harus berbeda per halaman, misalnya hero untuk banyak layanan. Gunakan Synced patterns saat Anda butuh section yang sama persis dan harus mudah di-update secara global, misalnya CTA universal atau disclaimer.

Gunakan Template Parts saat elemennya adalah struktur global website, misalnya header, footer, atau komponen yang harus konsisten di template level.

End-to-End Workflow

Berikut workflow yang kami sarankan agar tim Anda bisa reuse dengan cepat tapi tetap terkontrol, terutama saat website sudah punya banyak halaman.

1. Create a section: buat section di satu halaman uji, misalnya CTA dengan headline, benefit singkat, dan tombol.
2. Decide the reuse type: kalau wajib sama di seluruh website, jadikan Synced pattern, kalau hanya layoutnya yang sama, jadikan Pattern unsynced.
3. Save it: simpan dengan nama jelas dan kategori yang konsisten, misalnya CTA, FAQ, Hero, Pricing.
4. Reuse it: insert dari inserter, jangan copy paste, supaya Anda tidak membuat duplikasi yang tidak terkelola.
5. Controlled updates: update Synced pattern saat Anda siap dampaknya global, lalu cek beberapa halaman representatif.

Untuk website yang sudah besar, pembagian perannya biasanya seperti ini: Template Parts untuk struktur, Synced patterns untuk komponen global marketing, dan Pattern unsynced untuk library layout per kampanye.

Kesalahan Umum dan Solusinya

Kesalahan kecil di sini bisa terasa besar karena dampaknya bisa menyebar ke banyak halaman. Berikut masalah yang paling sering terjadi dan cara mengatasinya.

• Kesalahan: Mengira semua pattern itu sinkron. Solusi: Pastikan Anda memilih Synced agar perubahan berlaku di semua pemakaian.
• Kesalahan: Edit satu instance, lalu semua halaman ikut berubah. Solusi: Kalau Anda butuh versi unik, gunakan Detach pattern sebelum mengubah konten.
• Kesalahan: Copy paste section antar halaman. Solusi: Insert dari Pattern Library agar reuse rapi dan bisa dikelola.
• Kesalahan: Menaruh header custom sebagai pattern di setiap halaman. Solusi: Pindahkan ke Template Parts supaya struktur global dikelola dari Site Editor.
• Kesalahan: Penamaan pattern tidak konsisten. Solusi: Gunakan format nama berbasis fungsi, misalnya “FAQ – Layanan A”, “CTA – Promo Q1”, “Hero – Webinar”.

Mini Troubleshooting

Kalau ada yang terasa “kok tidak muncul” atau “kok tidak ikut berubah”, biasanya penyebabnya adalah salah jenis pattern atau instance sudah terlepas dari sinkron.

• Masalah: Pattern tidak muncul di inserter. Solusi: Cari lewat search by name, dan cek area Synced Patterns jika yang Anda cari adalah synced.
• Masalah: Perubahan tidak syncing. Solusi: Pastikan pattern memang dibuat Synced, dan pastikan instance yang Anda lihat belum di-detach.
• Masalah: Anda takut edit global merusak banyak halaman. Solusi: Duplikasi pattern untuk versi baru, lalu ganti pemakaiannya bertahap.
• Masalah: Template Part berubah tapi halaman tertentu tidak berubah. Solusi: Pastikan halaman itu memakai template yang menyertakan template part yang Anda edit.

Pre-Publish Checklist

• Pastikan section yang harus konsisten dibuat sebagai Synced pattern, bukan Pattern biasa.
• Pastikan section yang harus unik per halaman tidak dibuat Synced, supaya editor tidak terkunci oleh update global.
• Review naming dan kategori, apakah tim Anda bisa menemukan komponen itu dalam 10 detik.
• Setiap update global, cek minimal 3 halaman, homepage, landing page utama, dan satu halaman konten panjang.
• Cek tampilan mobile untuk hero, CTA, dan kolom, karena ini yang paling sering pecah.
• Untuk header dan footer, gunakan Template Parts, bukan copy paste ke halaman.
• Kalau Anda detach instance, catat alasannya supaya tidak muncul inkonsistensi yang tidak disengaja.
• Pastikan link dan tracking, misalnya UTM atau event, tetap benar setelah reuse.

Kalau Anda ingin website yang konsisten, cepat dibuat, dan mudah dirawat, mulai dengan library pattern yang rapi, gunakan synced patterns untuk komponen global, dan simpan struktur global di template parts, lalu evaluasi rutin komponen mana yang paling sering dipakai dan perlu distandardisasi, reusable blocks WordPress.