{"id":3848,"date":"2020-07-30T08:24:08","date_gmt":"2020-07-30T08:24:08","guid":{"rendered":"https:\/\/hosteko.com\/blog\/?p=3848"},"modified":"2020-10-17T03:33:47","modified_gmt":"2020-10-17T03:33:47","slug":"cara-menggunakan-reusable-block-gutenberg-pada-wordpress","status":"publish","type":"post","link":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress","title":{"rendered":"Cara Menggunakan Reusable Block Gutenberg Pada WordPress"},"content":{"rendered":"<p>Sejak update 5.0 di tahun 2018 editor WordPress berubah menjadi Gutenberg yang mengusung Block Based User Interface. Di mana tampilan editor tersusun dari kotak (<em>block<\/em>) yang bisa dipindah-pindah hanya dengan menggesernya.<\/p>\n<p>Salah satu fitur &#8220;rahasia&#8221; Gutenberg banyak orang yang tidak ketahui tentang reusable blok.<\/p>\n<h2><strong>Apa Itu Reusable Block?<\/strong><\/h2>\n<p>Sesuai denan namanya, Reusable Block adalah blok kustom yang bisa di simpan dan digunakan seperti blok default Gutenberg lainnya.<\/p>\n<p>Jika sering menulis atau membuat hal yang sama berulang-ulang, membuatnya menjadi Reusable Block akan sangat membantu. Cukup dengan beberapa klik sudah bisa membuat potongan konten tanpa perlu repot kopas dari postingan lain.<\/p>\n<p>Beberapa skenario yang bisa menggunakan Reusable Block sebagai berikut :<\/p>\n<ol>\n<li>Menambahkan call-to-action (CTA) berisi link afilasi atau form berlangganan<\/li>\n<li>Menampilkan banner iklan atau produk afilasi<\/li>\n<li>Menampilkan tombol sosial media atau sejenisnya<\/li>\n<\/ol>\n<p>selain yang disebutkan di atas ada banyak lagi skenario yang bisa di manfaatkan menggunakan Reusable Block, seperti untuk menyimpan kode HTTML kustom yang sering di pakai. Selama sering digunakan tdak ada salahnya untuk mengubahnya sebagai Reusable Block.<\/p>\n<h2><strong>Cara Mengunakan Reusable Block di Gutenberg<\/strong><\/h2>\n<p>Panduan cara menggunakan Reusable Block di bagi menjadi 4 bagian. Mulai dari pembuatannya hingga cara menggunakan reusable blok yang barusan dibuat di website lainnya.<\/p>\n<h3>1. Cara Membuat Reusable Block Baru<\/h3>\n<p>Sebelum Reusable Block bisa digunakan harus membuatnya terlebih dahulu.<\/p>\n<ol>\n<li>Membuat atau mengedit post atau halaman di website. Setelah masuk ke Gutenberg Editor, klik pada <strong>Add Block<\/strong> di pojok kiri atas.<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3850 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-block.png\" alt=\"\" width=\"1454\" height=\"696\" \/><\/li>\n<li>Memilih blok apapun di menu yang terbuka. Sebagai contoh memilih blok <strong>Paragraph<\/strong> karena ingin menyimpan paragraph penutup artikel.<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3851 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/paragraph.png\" alt=\"\" width=\"1454\" height=\"696\" \/><\/li>\n<li>Setelah selesai membuat blok sesuai dengan kebutuhan, klik blok tersebut dan klik titik tiga yang muncul di atasnya. Lalu pilih opsi <strong>Add To Reusable Blocks<\/strong>.<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3852 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/reusable-block.png\" alt=\"\" width=\"1454\" height=\"696\" \/><\/li>\n<li>Beri nama apapun di Reusable Block yang barusan di buat. Usahakan membuat nama yang sesuai dengan nama blok dan tujuannya di buat, sehingga mencarinya lebih mudah. Setelah itu klik <strong>Save<\/strong>.<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3853 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/paragraph-penutup.png\" alt=\"\" width=\"1454\" height=\"696\" \/><\/li>\n<li>Bisa untuk menyimpan Reusable Block yang kedua atau yang seterusnya. Sebagai contoh selain <strong>Paragraph <\/strong>di atas juga ingin menyimpan blok <strong>Button <\/strong>sebagai CTA. Tinggal klik dan geser saja blok-blok yang disimpan seperti gambar di bawah ini:<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3854 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/buttom-cta.png\" alt=\"\" width=\"1454\" height=\"696\" \/><\/li>\n<li>Lalu klik tiga titik yang ada di atasnya dan pilih <strong>Reusable Blok<\/strong>. Berikan nama, klik <strong>Save <\/strong>dan selesai! Beberapa blok Anda sudah tersimpan dan siap dipakai dengan satu klik saja.<\/li>\n<\/ol>\n<h3>2. Memasukkan Reusable Block Baru<\/h3>\n<p>Setelah reusable blok dibuat, berikut cara untuk memasukkan di post atau halaman website.<\/p>\n<ol>\n<li>Klik <strong>Add Block <\/strong>di kiri atas. Lalu, geser ke bawah sampai menemukan <strong>Reusable<\/strong>. Klik panah yang ada di samping untuk membuka menu yang berisi reusable block yang pernah disimpan.<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-3855 size-large\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-paragraph-reusable-1024x490.png\" alt=\"\" width=\"1024\" height=\"490\" \/><\/li>\n<li>Cara lain yang lebih cepat adalah dengan memasukkan nama reusable block di kotak pencarian. Maka dari itu, buatlah nama reusable blok yang mudah diingat dan sesuai kebutuhan.<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-3856 size-large\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/langkah-selanjutnya-dengan-pencarian-1024x490.png\" alt=\"\" width=\"1024\" height=\"490\" \/><\/li>\n<li>Kemudian, klik reusable blok yang ingin digunakan, maka akan langsung muncul di editor setelahnya.<\/li>\n<\/ol>\n<h3><strong>3. <\/strong><span id=\"3_Cara_Mengedit_Reusable_Blok\"><strong>Cara Mengedit Reusable Blok Baru<\/strong><br \/>\n<\/span><\/h3>\n<div class=\"judul-bab\">\n<h4><span id=\"Peringatan\">Peringatan!<\/span><\/h4>\n<\/div>\n<div class=\"ringkasan-panduan\">\n<p>Mengedit reusable blok akan mengganti semua blok di post\/halaman sebelumnya dengan reusable blok versi baru. Jadi, misalnya saja mengedit reusable blok untuk mengganti warnanya. Nah, berarti semua post\/halaman yang menggunakan reusable blok tersebut juga akan secara otomatis berganti warnanya.<\/p>\n<ol>\n<li>Pertama klik tombol <strong>Add Block <\/strong>di kiri atas. Lalu, geser ke bawah hingga menemukan <strong>Reusable<\/strong>. Klik panah di sampingnya, kemudian pilih <strong>Manage all reusable blocks<\/strong>. Maka akan dibawa keluar dari Gutenberg Editor, jadi pastikan post\/page sudah disimpan terlebih dahulu. <img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3857 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-reusable.png\" alt=\"\" width=\"1454\" height=\"696\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-reusable.png 1454w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-reusable-1024x490.png 1024w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-reusable-768x368.png 768w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-reusable-555x266.png 555w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-reusable-1110x531.png 1110w\" sizes=\"auto, (max-width: 1454px) 100vw, 1454px\" \/><\/li>\n<li>Pilih reusable block mana yang ingin diubah, lalu klik <strong>Edit <\/strong>di bawahnya.<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3858 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/edit.png\" alt=\"\" width=\"1454\" height=\"696\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/edit.png 1454w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/edit-1024x490.png 1024w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/edit-768x368.png 768w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/edit-555x266.png 555w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/edit-1110x531.png 1110w\" sizes=\"auto, (max-width: 1454px) 100vw, 1454px\" \/><\/li>\n<li>Setelah itu akan menuju ke halaman editor. Lakukan perubahan yang diinginkan, kemudian klik <strong>Update <\/strong>di kanan atas.<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3859 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/update.png\" alt=\"\" width=\"1454\" height=\"696\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/update.png 1454w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/update-1024x490.png 1024w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/update-768x368.png 768w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/update-555x266.png 555w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/update-1110x531.png 1110w\" sizes=\"auto, (max-width: 1454px) 100vw, 1454px\" \/><\/li>\n<\/ol>\n<h3><strong>4. <span id=\"4_Cara_Menggunakan_Reusable_Blok_yang_Sama_di_Website_Lainnya\">Cara Menggunakan Reusable Blok yang Sama di Website Lainnya<\/span><\/strong><\/h3>\n<p>Kelebihan Reusable Block lainnya adalah penggunaannya tak hanya terbatas satu website saja. Tetapi juga bisa menggunakan Reusable Block yang sama dengan website lain tanpa perlu membuatnya dari awal.<\/p>\n<p>Berikut cara menggunakan Reusable Block yang sama di website lain, sebagai berikut :<\/p>\n<ol>\n<li>Klik Add Block di Gutenberg Editor. Lalu, geser ke bawah hingga menemukan menu <strong>Reusable<\/strong>. Klik panah di sampingnya, kemudian pilih <strong>Manage all reusable blocks. <img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3860 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add.png\" alt=\"\" width=\"1454\" height=\"696\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add.png 1454w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-1024x490.png 1024w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-768x368.png 768w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-555x266.png 555w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/add-1110x531.png 1110w\" sizes=\"auto, (max-width: 1454px) 100vw, 1454px\" \/><\/strong><\/li>\n<li>Klik <strong>Export as JSON <\/strong>tepat di bawah reusable blok yang ingin digunakan di website lainnya. Dengan begini, reusable blok tersebut akan disimpan di komputer. <img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3861 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/export.png\" alt=\"\" width=\"1454\" height=\"696\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/export.png 1454w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/export-1024x490.png 1024w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/export-768x368.png 768w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/export-555x266.png 555w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/export-1110x531.png 1110w\" sizes=\"auto, (max-width: 1454px) 100vw, 1454px\" \/><\/li>\n<li>Login ke website lainnya. Ulangi langkah di atas, tapi sekarang harus memilih <strong>Import from JSON<\/strong> alih-alih Export as JSON<strong>. <\/strong>Kemudian pilih reusable blok yang sudah disimpan di komputer tadi melalui <strong>Choose FIle<\/strong>, lalu klik <strong>Import<\/strong>.<img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-3862 aligncenter\" src=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/import.png\" alt=\"\" width=\"1454\" height=\"696\" srcset=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/import.png 1454w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/import-1024x490.png 1024w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/import-768x368.png 768w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/import-555x266.png 555w, https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/import-1110x531.png 1110w\" sizes=\"auto, (max-width: 1454px) 100vw, 1454px\" \/><\/li>\n<\/ol>\n<p>&nbsp;<\/p>\n<\/div>\n<p>&nbsp;<\/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;3848&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;0&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;0&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;0\\\/5 - (0 votes)&quot;,&quot;size&quot;:&quot;22&quot;,&quot;title&quot;:&quot;Cara Menggunakan Reusable Block Gutenberg Pada Wordpress&quot;,&quot;width&quot;:&quot;0&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: 0px;\">\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            <span class=\"kksr-muted\">Jadilah yang pertama untuk memberi nilai<\/span>\n    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p>Sejak update 5.0 di tahun 2018 editor WordPress berubah menjadi Gutenberg yang mengusung Block Based User Interface. Di mana tampilan editor tersusun dari kotak (block) yang bisa dipindah-pindah hanya dengan menggesernya. Salah satu fitur &#8220;rahasia&#8221; Gutenberg banyak orang yang tidak ketahui tentang reusable blok. Apa Itu Reusable Block? Sesuai denan namanya, Reusable Block adalah blok [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":3863,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rop_custom_images_group":[],"rop_custom_messages_group":[],"rop_publish_now":"initial","rop_publish_now_accounts":{"twitter_2392824914_2392824914":""},"rop_publish_now_history":[],"rop_publish_now_status":"pending","_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"enabled":false},"version":2}},"categories":[3],"tags":[1458,1455,1456,1459,1457],"class_list":["post-3848","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","tag-edit-reusable-blocks-wordpress","tag-reusable-blocks-gutenberg","tag-reusable-blocks-wordpress","tag-wordpress-gutenberg-reusable-blocks","tag-wordpress-reusable-blocks-plugin"],"featured_image_src":{"landsacpe":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg-1110x694.png",712,445,true],"list":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg-555x347.png",463,289,true],"medium":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg-300x188.png",300,188,true],"full":["https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png",2880,1800,false]},"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Cara Menggunakan Reusable Block Gutenberg Pada 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\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Cara Menggunakan Reusable Block Gutenberg Pada Wordpress - Hosteko Blog\" \/>\n<meta property=\"og:description\" content=\"Sejak update 5.0 di tahun 2018 editor WordPress berubah menjadi Gutenberg yang mengusung Block Based User Interface. Di mana tampilan editor tersusun dari kotak (block) yang bisa dipindah-pindah hanya dengan menggesernya. Salah satu fitur &#8220;rahasia&#8221; Gutenberg banyak orang yang tidak ketahui tentang reusable blok. Apa Itu Reusable Block? Sesuai denan namanya, Reusable Block adalah blok [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress\" \/>\n<meta property=\"og:site_name\" content=\"Hosteko Blog\" \/>\n<meta property=\"article:published_time\" content=\"2020-07-30T08:24:08+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-10-17T03:33:47+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2880\" \/>\n\t<meta property=\"og:image:height\" content=\"1800\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Risa Y\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Risa Y\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#article\",\"isPartOf\":{\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress\"},\"author\":{\"name\":\"Risa Y\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b\"},\"headline\":\"Cara Menggunakan Reusable Block Gutenberg Pada WordPress\",\"datePublished\":\"2020-07-30T08:24:08+00:00\",\"dateModified\":\"2020-10-17T03:33:47+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress\"},\"wordCount\":711,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#primaryimage\"},\"thumbnailUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png\",\"keywords\":[\"edit reusable blocks wordpress\",\"reusable blocks gutenberg\",\"reusable blocks wordpress\",\"wordpress gutenberg reusable blocks\",\"wordpress reusable blocks plugin\"],\"articleSection\":[\"Blog\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress\",\"url\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress\",\"name\":\"Cara Menggunakan Reusable Block Gutenberg Pada Wordpress - Hosteko Blog\",\"isPartOf\":{\"@id\":\"https:\/\/hosteko.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#primaryimage\"},\"image\":{\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#primaryimage\"},\"thumbnailUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png\",\"datePublished\":\"2020-07-30T08:24:08+00:00\",\"dateModified\":\"2020-10-17T03:33:47+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#primaryimage\",\"url\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png\",\"contentUrl\":\"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png\",\"width\":2880,\"height\":1800},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/hosteko.com\/blog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Cara Menggunakan Reusable Block Gutenberg Pada 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\/c1d3dbd7c27bd3574f8c7042165a660b\",\"name\":\"Risa Y\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/hosteko.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g\",\"caption\":\"Risa Y\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Cara Menggunakan Reusable Block Gutenberg Pada 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\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress","og_locale":"en_US","og_type":"article","og_title":"Cara Menggunakan Reusable Block Gutenberg Pada Wordpress - Hosteko Blog","og_description":"Sejak update 5.0 di tahun 2018 editor WordPress berubah menjadi Gutenberg yang mengusung Block Based User Interface. Di mana tampilan editor tersusun dari kotak (block) yang bisa dipindah-pindah hanya dengan menggesernya. Salah satu fitur &#8220;rahasia&#8221; Gutenberg banyak orang yang tidak ketahui tentang reusable blok. Apa Itu Reusable Block? Sesuai denan namanya, Reusable Block adalah blok [&hellip;]","og_url":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress","og_site_name":"Hosteko Blog","article_published_time":"2020-07-30T08:24:08+00:00","article_modified_time":"2020-10-17T03:33:47+00:00","og_image":[{"width":2880,"height":1800,"url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png","type":"image\/png"}],"author":"Risa Y","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Risa Y","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#article","isPartOf":{"@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress"},"author":{"name":"Risa Y","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/c1d3dbd7c27bd3574f8c7042165a660b"},"headline":"Cara Menggunakan Reusable Block Gutenberg Pada WordPress","datePublished":"2020-07-30T08:24:08+00:00","dateModified":"2020-10-17T03:33:47+00:00","mainEntityOfPage":{"@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress"},"wordCount":711,"commentCount":0,"publisher":{"@id":"https:\/\/hosteko.com\/blog\/#organization"},"image":{"@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#primaryimage"},"thumbnailUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png","keywords":["edit reusable blocks wordpress","reusable blocks gutenberg","reusable blocks wordpress","wordpress gutenberg reusable blocks","wordpress reusable blocks plugin"],"articleSection":["Blog"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#respond"]}]},{"@type":"WebPage","@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress","url":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress","name":"Cara Menggunakan Reusable Block Gutenberg Pada Wordpress - Hosteko Blog","isPartOf":{"@id":"https:\/\/hosteko.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#primaryimage"},"image":{"@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#primaryimage"},"thumbnailUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png","datePublished":"2020-07-30T08:24:08+00:00","dateModified":"2020-10-17T03:33:47+00:00","breadcrumb":{"@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#primaryimage","url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png","contentUrl":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png","width":2880,"height":1800},{"@type":"BreadcrumbList","@id":"https:\/\/hosteko.com\/blog\/cara-menggunakan-reusable-block-gutenberg-pada-wordpress#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/hosteko.com\/blog"},{"@type":"ListItem","position":2,"name":"Cara Menggunakan Reusable Block Gutenberg Pada 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\/c1d3dbd7c27bd3574f8c7042165a660b","name":"Risa Y","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/hosteko.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7eac241dffbc583c56ba1ff19703f5623dab2b6a88bbb0583e815230564dac5e?s=96&d=mm&r=g","caption":"Risa Y"}}]}},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/hosteko.com\/htk-blog\/wp-content\/uploads\/2020\/07\/Reusable-Block-Gutenberg.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/3848","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\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/comments?post=3848"}],"version-history":[{"count":0,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/posts\/3848\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/media\/3863"}],"wp:attachment":[{"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/media?parent=3848"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/categories?post=3848"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hosteko.com\/blog\/wp-json\/wp\/v2\/tags?post=3848"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}