{"id":29191,"date":"2026-01-05T02:41:13","date_gmt":"2026-01-05T02:41:13","guid":{"rendered":"https:\/\/hosteko.com\/blog\/?p=29191"},"modified":"2026-01-05T02:41:13","modified_gmt":"2026-01-05T02:41:13","slug":"mengenal-gutenberg-block-pattern","status":"publish","type":"post","link":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern","title":{"rendered":"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress"},"content":{"rendered":"<p data-start=\"293\" data-end=\"658\">Sejak diperkenalkannya Gutenberg Editor, WordPress terus mengalami perkembangan besar dalam hal kemudahan desain konten. Salah satu fitur penting yang sering belum dimanfaatkan secara maksimal adalah Gutenberg Block Pattern.<\/p>\n<p data-start=\"293\" data-end=\"658\">Padahal, fitur ini sangat membantu untuk membuat tampilan website yang rapi, profesional, dan konsisten tanpa perlu keahlian coding. Artikel ini akan membahas secara lengkap apa itu Gutenberg Block Pattern, manfaatnya, perbedaannya dengan block biasa, hingga cara menggunakannya dengan mudah.<\/p>\n<h2 data-start=\"826\" data-end=\"861\">Definisi Gutenberg Block Pattern<\/h2>\n<p data-start=\"82\" data-end=\"681\">Gutenberg Block Pattern adalah kumpulan beberapa block pada editor Gutenberg WordPress yang telah dirancang dan disusun dalam satu layout atau desain tertentu, sehingga dapat digunakan kembali kapan saja.<\/p>\n<p data-start=\"82\" data-end=\"681\">Fitur ini memungkinkan pengguna WordPress untuk menambahkan desain siap pakai ke dalam halaman atau artikel hanya dengan satu klik, tanpa perlu menyusun block satu per satu secara manual. Dengan adanya Block Pattern, proses pembuatan konten menjadi jauh lebih cepat, efisien, dan konsisten, terutama bagi pengguna yang ingin menampilkan desain profesional tanpa keahlian teknis atau coding. Block Pattern sangat membantu dalam menjaga keseragaman tampilan website, karena layout yang digunakan bisa disesuaikan dengan identitas visual situs.<\/p>\n<p data-start=\"82\" data-end=\"681\">Beberapa contoh Gutenberg Block Pattern yang umum digunakan antara lain hero section yang berisi kombinasi judul, tombol, dan gambar, layout artikel dua kolom untuk tampilan konten yang lebih rapi, section testimoni untuk meningkatkan kepercayaan pengunjung, Call To Action (CTA) untuk mendorong interaksi, hingga footer sederhana. Dengan memanfaatkan Block Pattern, pengguna dapat fokus pada pengisian konten tanpa harus memikirkan struktur desain dari awal.<\/p>\n<h2 data-start=\"1446\" data-end=\"1499\">Perbedaan Block, Reusable Block, dan Block Pattern<\/h2>\n<div class=\"TyagGW_tableContainer\">\n<div class=\"group TyagGW_tableWrapper flex w-fit flex-col-reverse\">\n<table class=\"w-fit min-w-(--thread-content-width)\" style=\"height: 362px\" width=\"1461\" data-start=\"89\" data-end=\"949\">\n<thead data-start=\"89\" data-end=\"163\">\n<tr data-start=\"89\" data-end=\"163\">\n<th data-start=\"89\" data-end=\"103\" data-col-size=\"sm\">Jenis Block<\/th>\n<th data-start=\"103\" data-end=\"116\" data-col-size=\"md\">Pengertian<\/th>\n<th data-start=\"116\" data-end=\"138\" data-col-size=\"md\">Karakteristik Utama<\/th>\n<th data-start=\"138\" data-end=\"163\" data-col-size=\"md\">Cocok Digunakan Untuk<\/th>\n<\/tr>\n<\/thead>\n<tbody data-start=\"236\" data-end=\"949\">\n<tr data-start=\"236\" data-end=\"439\">\n<td data-start=\"236\" data-end=\"254\" data-col-size=\"sm\"><strong data-start=\"238\" data-end=\"253\">Block Biasa<\/strong><\/td>\n<td data-start=\"254\" data-end=\"333\" data-col-size=\"md\">Elemen tunggal dalam editor Gutenberg seperti paragraf, gambar, atau heading<\/td>\n<td data-col-size=\"md\" data-start=\"333\" data-end=\"402\">Tidak tersimpan sebagai template, digunakan sekali di satu halaman<\/td>\n<td data-col-size=\"md\" data-start=\"402\" data-end=\"439\">Konten sederhana dan sekali pakai<\/td>\n<\/tr>\n<tr data-start=\"440\" data-end=\"684\">\n<td data-start=\"440\" data-end=\"461\" data-col-size=\"sm\"><strong data-start=\"442\" data-end=\"460\">Reusable Block<\/strong><\/td>\n<td data-col-size=\"md\" data-start=\"461\" data-end=\"528\">Block yang disimpan dan bisa digunakan kembali di banyak halaman<\/td>\n<td data-col-size=\"md\" data-start=\"528\" data-end=\"618\">Perubahan pada satu reusable block akan diterapkan ke semua halaman yang menggunakannya<\/td>\n<td data-col-size=\"md\" data-start=\"618\" data-end=\"684\">Konten statis seperti disclaimer, kontak, atau informasi tetap<\/td>\n<\/tr>\n<tr data-start=\"685\" data-end=\"949\">\n<td data-start=\"685\" data-end=\"705\" data-col-size=\"sm\"><strong data-start=\"687\" data-end=\"704\">Block Pattern<\/strong><\/td>\n<td data-col-size=\"md\" data-start=\"705\" data-end=\"783\">Kumpulan beberapa block yang disusun dalam satu layout atau desain tertentu<\/td>\n<td data-col-size=\"md\" data-start=\"783\" data-end=\"873\">Bisa diedit bebas tanpa memengaruhi pattern aslinya, fleksibel untuk berbagai kebutuhan<\/td>\n<td data-col-size=\"md\" data-start=\"873\" data-end=\"949\">Desain berulang seperti hero section, CTA, testimoni, dan layout halaman<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p data-start=\"951\" data-end=\"1153\">Block Pattern lebih cocok digunakan untuk kebutuhan desain dan layout, sedangkan Reusable Block lebih ideal untuk konten tetap yang harus selalu sama di setiap halaman.<\/p>\n<h2 data-start=\"2081\" data-end=\"2126\">Fungsi dan Manfaat Gutenberg Block Pattern<\/h2>\n<p><span class=\"suggestion_paragraphs result__para__0_1\" data-para=\"result__para__0_1\">Berikut adalah beberapa fungsi\u00a0dari Gutenberg Block Pattern\u00a0yang harus Anda pahami: <\/span><\/p>\n<p data-start=\"201\" data-end=\"240\"><strong>1. Menghemat Waktu Pembuatan Konten<\/strong><\/p>\n<p data-start=\"241\" data-end=\"661\">Dengan Gutenberg Block Pattern, pengguna tidak perlu lagi menyusun layout halaman dari awal. Semua struktur desain sudah tersedia dalam bentuk pattern siap pakai. Cukup memilih block pattern yang diinginkan, lalu menyesuaikan isi seperti teks, gambar, atau tombol.<\/p>\n<p data-start=\"241\" data-end=\"661\">Hal ini sangat membantu terutama saat membuat banyak halaman dengan struktur yang serupa, sehingga proses pembuatan konten menjadi lebih cepat dan efisien.<\/p>\n<p data-start=\"668\" data-end=\"702\"><strong>2. Mudah Digunakan oleh Pemula<\/strong><\/p>\n<p data-start=\"703\" data-end=\"1068\">Gutenberg Block Pattern dirancang agar bisa digunakan oleh siapa saja, termasuk pengguna WordPress pemula. Fitur ini dapat dimanfaatkan tanpa memerlukan kemampuan coding, tanpa plugin tambahan, dan tanpa page builder pihak ketiga.<\/p>\n<p data-start=\"703\" data-end=\"1068\">Seluruh proses dilakukan langsung melalui editor Gutenberg bawaan WordPress, sehingga lebih sederhana, ringan, dan minim risiko error.<\/p>\n<p data-start=\"1075\" data-end=\"1116\"><strong>3. Menjaga Konsistensi Desain Website<\/strong><\/p>\n<p data-start=\"1117\" data-end=\"1463\">Salah satu manfaat utama Block Pattern adalah menjaga konsistensi desain di seluruh halaman website. Dengan menggunakan layout yang sama atau serupa, tampilan website akan terlihat lebih rapi, profesional, dan terstruktur.<\/p>\n<p data-start=\"1117\" data-end=\"1463\">Konsistensi ini penting untuk meningkatkan pengalaman pengguna (user experience) serta memperkuat identitas visual website.<\/p>\n<p data-start=\"1470\" data-end=\"1510\"><strong>4. Mendukung Full Site Editing (FSE)<\/strong><\/p>\n<p data-start=\"1511\" data-end=\"1925\">Gutenberg Block Pattern sangat optimal digunakan pada tema WordPress berbasis Block Theme yang mendukung fitur Full Site Editing (FSE). Dengan FSE, pengguna dapat mengatur berbagai bagian website seperti header, footer, dan template halaman menggunakan block dan pattern.<\/p>\n<p data-start=\"1511\" data-end=\"1925\">Hal ini memberikan fleksibilitas tinggi dalam mengelola desain website secara menyeluruh tanpa harus mengedit file tema secara manual.<\/p>\n<h3 data-start=\"1932\" data-end=\"1972\">5. Fleksibel dan Mudah Dikustomisasi<\/h3>\n<p data-start=\"1973\" data-end=\"2358\">Meskipun Block Pattern merupakan desain siap pakai, pengguna tetap memiliki kebebasan penuh untuk melakukan kustomisasi. Setiap elemen di dalam pattern\u2014mulai dari teks, warna, gambar, hingga tata letaknya dapat diubah sesuai kebutuhan. Perubahan yang dilakukan tidak akan memengaruhi pattern aslinya, sehingga pengguna bisa bereksperimen dengan desain tanpa khawatir merusak layout utama.<\/p>\n<h2 data-start=\"2638\" data-end=\"2676\">Jenis-Jenis Gutenberg Block Pattern<\/h2>\n<p data-start=\"2678\" data-end=\"2716\"><strong>1. Default Block Pattern WordPress<\/strong><\/p>\n<p data-start=\"2717\" data-end=\"2762\">WordPress menyediakan pattern bawaan seperti:<\/p>\n<ul>\n<li data-start=\"2765\" data-end=\"2771\">Header<\/li>\n<li data-start=\"2774\" data-end=\"2781\">Gallery<\/li>\n<li data-start=\"2784\" data-end=\"2795\">Text layout<\/li>\n<li data-start=\"2798\" data-end=\"2805\">Buttons<\/li>\n<\/ul>\n<p data-start=\"2807\" data-end=\"2833\"><strong>2. Theme Block Pattern<\/strong><\/p>\n<p data-start=\"2834\" data-end=\"2887\">Beberapa tema modern menyediakan pattern khusus yang:<\/p>\n<ul>\n<li data-start=\"2890\" data-end=\"2908\">Sesuai desain tema<\/li>\n<li data-start=\"2911\" data-end=\"2924\">Lebih estetik<\/li>\n<li data-start=\"2927\" data-end=\"2960\">Siap digunakan untuk landing page<\/li>\n<\/ul>\n<p data-start=\"2962\" data-end=\"2989\"><strong>3. Custom Block Pattern<\/strong><\/p>\n<p data-start=\"2990\" data-end=\"3043\">Pattern buatan sendiri atau dari plugin pihak ketiga.<\/p>\n<h2 data-start=\"3050\" data-end=\"3093\">Cara Menggunakan Gutenberg Block Pattern<\/h2>\n<p data-start=\"3095\" data-end=\"3141\">Berikut ini merupakan langkah-langkah Menggunakan Block Pattern:<\/p>\n<ol>\n<li data-start=\"3145\" data-end=\"3177\">Masuk ke Dashboard WordPress<\/li>\n<li data-start=\"3181\" data-end=\"3208\">Buka Post atau Page<\/li>\n<li data-start=\"3212\" data-end=\"3241\">Klik tombol (+) Add Block<\/li>\n<li data-start=\"3245\" data-end=\"3267\">Pilih tab Patterns<\/li>\n<li data-start=\"3271\" data-end=\"3309\">Pilih kategori pattern yang diinginkan<\/li>\n<li data-start=\"3313\" data-end=\"3352\">Klik pattern maka otomatis akan masuk ke editor<\/li>\n<li data-start=\"3356\" data-end=\"3401\">Edit teks, gambar, dan warna sesuai kebutuhan<\/li>\n<\/ol>\n<h2 data-start=\"3420\" data-end=\"3482\">Cara Membuat Gutenberg Block Pattern Sendiri (Tanpa Coding)<\/h2>\n<p data-start=\"3484\" data-end=\"3502\">Berikut cara paling mudah untuk membuat Gutenberg Block Pattern tanpa menggunakan coding:<\/p>\n<ol>\n<li data-start=\"3507\" data-end=\"3546\">Buat layout menggunakan block Gutenberg<\/li>\n<li data-start=\"3550\" data-end=\"3588\">Pastikan desain sudah sesuai keinginan<\/li>\n<li data-start=\"3592\" data-end=\"3611\">Salin seluruh block<\/li>\n<li data-start=\"3615\" data-end=\"3676\">Simpan sebagai Reusable Block atau gunakan plugin pattern<\/li>\n<li data-start=\"3680\" data-end=\"3706\">Gunakan kembali kapan saja<\/li>\n<\/ol>\n<p data-start=\"3708\" data-end=\"3833\">Untuk pengguna lanjutan, block pattern juga bisa dibuat menggunakan kode PHP, biasanya oleh developer atau theme creator.<\/p>\n<h2 data-start=\"3840\" data-end=\"3891\">Plugin Rekomendasi untuk Gutenberg Block Pattern<\/h2>\n<p data-start=\"3893\" data-end=\"3970\">Jika ingin lebih banyak pilihan desain, kamu bisa menggunakan plugin berikut:<\/p>\n<ul data-start=\"3972\" data-end=\"4099\">\n<li data-start=\"3972\" data-end=\"3992\">\n<p data-start=\"3974\" data-end=\"3992\">Kadence Blocks<\/p>\n<\/li>\n<li data-start=\"3993\" data-end=\"4008\">\n<p data-start=\"3995\" data-end=\"4008\">Stackable<\/p>\n<\/li>\n<li data-start=\"4009\" data-end=\"4054\">\n<p data-start=\"4011\" data-end=\"4054\">Spectra (Ultimate Addons for Gutenberg)<\/p>\n<\/li>\n<li data-start=\"4055\" data-end=\"4078\">\n<p data-start=\"4057\" data-end=\"4078\">Blocksy Companion<\/p>\n<\/li>\n<li data-start=\"4079\" data-end=\"4099\">\n<p data-start=\"4081\" data-end=\"4099\">GenerateBlocks<\/p>\n<\/li>\n<\/ul>\n<p data-start=\"4101\" data-end=\"4124\">Plugin ini menyediakan:<\/p>\n<ul data-start=\"4125\" data-end=\"4210\">\n<li data-start=\"4125\" data-end=\"4159\">\n<p data-start=\"4127\" data-end=\"4159\">Ratusan block pattern siap pakai<\/p>\n<\/li>\n<li data-start=\"4160\" data-end=\"4175\">\n<p data-start=\"4162\" data-end=\"4175\">Desain modern<\/p>\n<\/li>\n<li data-start=\"4176\" data-end=\"4210\">\n<p data-start=\"4178\" data-end=\"4210\">Pengaturan lanjutan tanpa coding<\/p>\n<\/li>\n<\/ul>\n<h2 data-start=\"4217\" data-end=\"4259\">Gutenberg Block Pattern vs Page Builder<\/h2>\n<div class=\"TyagGW_tableContainer\">\n<div class=\"group TyagGW_tableWrapper flex w-fit flex-col-reverse\">\n<table class=\"w-fit min-w-(--thread-content-width)\" style=\"height: 289px\" width=\"1013\" data-start=\"4261\" data-end=\"4513\">\n<thead data-start=\"4261\" data-end=\"4301\">\n<tr data-start=\"4261\" data-end=\"4301\">\n<th data-start=\"4261\" data-end=\"4269\" data-col-size=\"sm\">Aspek<\/th>\n<th data-start=\"4269\" data-end=\"4285\" data-col-size=\"sm\">Block Pattern<\/th>\n<th data-start=\"4285\" data-end=\"4301\" data-col-size=\"sm\">Page Builder<\/th>\n<\/tr>\n<\/thead>\n<tbody data-start=\"4341\" data-end=\"4513\">\n<tr data-start=\"4341\" data-end=\"4377\">\n<td data-start=\"4341\" data-end=\"4353\" data-col-size=\"sm\">Kecepatan<\/td>\n<td data-start=\"4353\" data-end=\"4362\" data-col-size=\"sm\">Ringan<\/td>\n<td data-start=\"4362\" data-end=\"4377\" data-col-size=\"sm\">Lebih berat<\/td>\n<\/tr>\n<tr data-start=\"4378\" data-end=\"4421\">\n<td data-start=\"4378\" data-end=\"4395\" data-col-size=\"sm\">Learning curve<\/td>\n<td data-col-size=\"sm\" data-start=\"4395\" data-end=\"4403\">Mudah<\/td>\n<td data-col-size=\"sm\" data-start=\"4403\" data-end=\"4421\">Perlu adaptasi<\/td>\n<\/tr>\n<tr data-start=\"4422\" data-end=\"4460\">\n<td data-start=\"4422\" data-end=\"4431\" data-col-size=\"sm\">Coding<\/td>\n<td data-start=\"4431\" data-end=\"4445\" data-col-size=\"sm\">Tidak perlu<\/td>\n<td data-start=\"4445\" data-end=\"4460\" data-col-size=\"sm\">Tidak perlu<\/td>\n<\/tr>\n<tr data-start=\"4461\" data-end=\"4513\">\n<td data-start=\"4461\" data-end=\"4476\" data-col-size=\"sm\">SEO Friendly<\/td>\n<td data-col-size=\"sm\" data-start=\"4476\" data-end=\"4492\">Lebih optimal<\/td>\n<td data-col-size=\"sm\" data-start=\"4492\" data-end=\"4513\">Tergantung plugin<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p data-start=\"4515\" data-end=\"4590\">Untuk blog dan website ringan, Block Pattern lebih direkomendasikan.<\/p>\n<h2 data-start=\"4597\" data-end=\"4642\">Kapan Sebaiknya Menggunakan Block Pattern?<\/h2>\n<p data-start=\"4644\" data-end=\"4681\">Gunakan Gutenberg Block Pattern saat:<\/p>\n<ol>\n<li data-start=\"4684\" data-end=\"4702\">Ingin desain cepat<\/li>\n<li data-start=\"4705\" data-end=\"4729\">Tidak ingin plugin berat<\/li>\n<li data-start=\"4732\" data-end=\"4760\">Menggunakan tema block-based<\/li>\n<li data-start=\"4763\" data-end=\"4790\">Fokus pada performa dan SEO<\/li>\n<\/ol>\n<h2 data-start=\"4797\" data-end=\"4810\">Kesimpulan<\/h2>\n<p data-start=\"4812\" data-end=\"5050\">Gutenberg Block Pattern adalah solusi praktis untuk membuat desain konten WordPress yang rapi, konsisten, dan profesional tanpa ribet. Dengan fitur ini, siapa pun\u2014termasuk pemula\u2014bisa membuat layout menarik hanya dengan beberapa klik.<\/p>\n<p data-start=\"5052\" data-end=\"5171\">Jika kamu ingin website cepat, ringan, dan mudah dikelola, memanfaatkan Block Pattern adalah langkah yang sangat tepat.<\/p>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-right kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;right&quot;,&quot;id&quot;:&quot;29191&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;1&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;5&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;0&quot;,&quot;greet&quot;:&quot;Jadilah yang pertama untuk memberi nilai&quot;,&quot;legend&quot;:&quot;5\\\/5 - (1 vote)&quot;,&quot;size&quot;:&quot;22&quot;,&quot;title&quot;:&quot;Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress&quot;,&quot;width&quot;:&quot;110&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} - ({count} {votes})&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 110px;\">\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 0px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 22px; height: 22px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 17.6px;\">\n            5\/5 - (1 vote)    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p>Sejak diperkenalkannya Gutenberg Editor, WordPress terus mengalami perkembangan besar dalam hal kemudahan desain konten. Salah satu fitur penting yang sering belum dimanfaatkan secara maksimal adalah Gutenberg Block Pattern. Padahal, fitur ini sangat membantu untuk membuat tampilan website yang rapi, profesional, dan konsisten tanpa perlu keahlian coding. Artikel ini akan membahas secara lengkap apa itu Gutenberg [&hellip;]<\/p>\n","protected":false},"author":13,"featured_media":29194,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rop_custom_images_group":[],"rop_custom_messages_group":[],"rop_publish_now":"no","rop_publish_now_accounts":{"twitter_2392824914_2392824914":""},"rop_publish_now_history":[{"account":"twitter_2392824914_2392824914","service":"twitter","timestamp":1767580888,"status":"error"}],"rop_publish_now_status":"done","_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"enabled":false},"version":2}},"categories":[3,8],"tags":[14384,14383,14380,14381,14382],"class_list":["post-29191","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","category-wordpress","tag-block-pattern-wordpress","tag-desain-wordpress-tanpa-coding","tag-gutenberg-block-pattern","tag-gutenberg-editor","tag-layout-gutenberg"],"featured_image_src":{"landsacpe":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117-1140x445.png",1140,445,true],"list":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117-463x348.png",463,348,true],"medium":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117-300x169.png",300,169,true],"full":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png",1366,768,false]},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress - Hosteko Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress - Hosteko Blog\" \/>\n<meta property=\"og:description\" content=\"Sejak diperkenalkannya Gutenberg Editor, WordPress terus mengalami perkembangan besar dalam hal kemudahan desain konten. Salah satu fitur penting yang sering belum dimanfaatkan secara maksimal adalah Gutenberg Block Pattern. Padahal, fitur ini sangat membantu untuk membuat tampilan website yang rapi, profesional, dan konsisten tanpa perlu keahlian coding. Artikel ini akan membahas secara lengkap apa itu Gutenberg [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern\" \/>\n<meta property=\"og:site_name\" content=\"Hosteko Blog\" \/>\n<meta property=\"article:published_time\" content=\"2026-01-05T02:41:13+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1366\" \/>\n\t<meta property=\"og:image:height\" content=\"768\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Fitri Ana\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fitri Ana\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#article\",\"isPartOf\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern\"},\"author\":{\"name\":\"Fitri Ana\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/ffcd8071a8a3d6a862a4e1381d1c4ea0\"},\"headline\":\"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress\",\"datePublished\":\"2026-01-05T02:41:13+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern\"},\"wordCount\":989,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#primaryimage\"},\"thumbnailUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png\",\"keywords\":[\"Block Pattern WordPress\",\"Desain WordPress Tanpa Coding\",\"Gutenberg Block Pattern\",\"Gutenberg Editor\",\"Layout Gutenberg\"],\"articleSection\":[\"Blog\",\"Wordpress\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern\",\"url\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern\",\"name\":\"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress - Hosteko Blog\",\"isPartOf\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#primaryimage\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#primaryimage\"},\"thumbnailUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png\",\"datePublished\":\"2026-01-05T02:41:13+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#primaryimage\",\"url\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png\",\"contentUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png\",\"width\":1366,\"height\":768},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/hosteko.com\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/hosteko.com\/blog\/#website\",\"url\":\"https:\/\/hosteko.com\/blog\/\",\"name\":\"Hosteko Blog\",\"description\":\"Berita &amp; Informasi Dunia IT\",\"publisher\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/hosteko.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\",\"name\":\"HOSTEKO\",\"url\":\"https:\/\/hosteko.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png\",\"contentUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png\",\"width\":195,\"height\":57,\"caption\":\"HOSTEKO\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/ffcd8071a8a3d6a862a4e1381d1c4ea0\",\"name\":\"Fitri Ana\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/a099f723518ab9b89aa80b7ed8cadd2d3fae127c5bd735733cf24a661e75a882?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/a099f723518ab9b89aa80b7ed8cadd2d3fae127c5bd735733cf24a661e75a882?s=96&d=mm&r=g\",\"caption\":\"Fitri Ana\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress - Hosteko Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern","og_locale":"en_US","og_type":"article","og_title":"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress - Hosteko Blog","og_description":"Sejak diperkenalkannya Gutenberg Editor, WordPress terus mengalami perkembangan besar dalam hal kemudahan desain konten. Salah satu fitur penting yang sering belum dimanfaatkan secara maksimal adalah Gutenberg Block Pattern. Padahal, fitur ini sangat membantu untuk membuat tampilan website yang rapi, profesional, dan konsisten tanpa perlu keahlian coding. Artikel ini akan membahas secara lengkap apa itu Gutenberg [&hellip;]","og_url":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern","og_site_name":"Hosteko Blog","article_published_time":"2026-01-05T02:41:13+00:00","og_image":[{"width":1366,"height":768,"url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png","type":"image\/png"}],"author":"Fitri Ana","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Fitri Ana","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#article","isPartOf":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern"},"author":{"name":"Fitri Ana","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/ffcd8071a8a3d6a862a4e1381d1c4ea0"},"headline":"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress","datePublished":"2026-01-05T02:41:13+00:00","mainEntityOfPage":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern"},"wordCount":989,"commentCount":0,"publisher":{"@id":"https:\/\/hosteko.com\/blog\/#organization"},"image":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#primaryimage"},"thumbnailUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png","keywords":["Block Pattern WordPress","Desain WordPress Tanpa Coding","Gutenberg Block Pattern","Gutenberg Editor","Layout Gutenberg"],"articleSection":["Blog","Wordpress"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#respond"]}]},{"@type":"WebPage","@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern","url":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern","name":"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress - Hosteko Blog","isPartOf":{"@id":"https:\/\/hosteko.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#primaryimage"},"image":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#primaryimage"},"thumbnailUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png","datePublished":"2026-01-05T02:41:13+00:00","breadcrumb":{"@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#primaryimage","url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png","contentUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png","width":1366,"height":768},{"@type":"BreadcrumbList","@id":"https:\/\/hosteko.com\/blog\/mengenal-gutenberg-block-pattern#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/hosteko.com\/blog"},{"@type":"ListItem","position":2,"name":"Gutenberg Block Pattern: Pengertian, Fungsi, dan Cara Menggunakannya di WordPress"}]},{"@type":"WebSite","@id":"https:\/\/hosteko.com\/blog\/#website","url":"https:\/\/hosteko.com\/blog\/","name":"Hosteko Blog","description":"Berita &amp; Informasi Dunia IT","publisher":{"@id":"https:\/\/hosteko.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/hosteko.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/hosteko.com\/blog\/#organization","name":"HOSTEKO","url":"https:\/\/hosteko.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png","contentUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2019\/04\/logo-hosteko.png","width":195,"height":57,"caption":"HOSTEKO"},"image":{"@id":"https:\/\/hosteko.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/ffcd8071a8a3d6a862a4e1381d1c4ea0","name":"Fitri Ana","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/a099f723518ab9b89aa80b7ed8cadd2d3fae127c5bd735733cf24a661e75a882?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/a099f723518ab9b89aa80b7ed8cadd2d3fae127c5bd735733cf24a661e75a882?s=96&d=mm&r=g","caption":"Fitri Ana"}}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2026\/01\/Desain-tanpa-judul117.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/29191","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/comments?post=29191"}],"version-history":[{"count":2,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/29191\/revisions"}],"predecessor-version":[{"id":29195,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/29191\/revisions\/29195"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/media\/29194"}],"wp:attachment":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/media?parent=29191"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/categories?post=29191"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/tags?post=29191"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}