{"id":3164,"date":"2023-02-23T18:16:00","date_gmt":"2023-02-23T09:16:00","guid":{"rendered":"https:\/\/kanehara.net\/forestcafe-block\/?p=3164"},"modified":"2023-03-14T14:34:48","modified_gmt":"2023-03-14T05:34:48","slug":"%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e3%83%bb%e3%83%95%e3%83%83%e3%82%bf%e3%83%bc%e3%81%ae%e5%b7%ae%e3%81%97%e6%9b%bf%e3%81%88%e3%83%bb%e3%82%ab%e3%82%b9%e3%82%bf%e3%83%9e%e3%82%a4%e3%82%ba%e6%96%b9","status":"publish","type":"post","link":"https:\/\/full-site-patterner.com\/en\/how-to-use\/3164\/","title":{"rendered":"How to replace and c\u2026"},"content":{"rendered":"\n<p>&#8221;&nbsp;<strong>FullSitePatterner<\/strong>&nbsp;&#8221;&nbsp;provides&nbsp;<strong>various block patterns such as headers, footers, buttons and boxes .<\/strong><\/p>\n\n\n\n<p>Here,&nbsp;we will explain how to replace&nbsp;<strong>the header<\/strong>&nbsp;from&nbsp;the theme-specific&nbsp;<strong>default setting (header-navbar) to&nbsp;<\/strong><strong>the WordPress default navigation (header-WP-navigation: design is customized) .<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized has-custom-border\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030220-2-1-1024x471.jpg\" alt=\"\" class=\"has-border-color has-black-border-color wp-image-3419\" style=\"border-width:1px\" width=\"768\" height=\"353\" srcset=\"https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030220-2-1-1024x471.jpg 1024w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030220-2-1-300x138.jpg 300w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030220-2-1-768x353.jpg 768w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030220-2-1.jpg 1347w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<p>Open the page with the header you want to change from&nbsp;<strong>the Appearance &#8211; Editor menu .<\/strong><br>Here it is the &#8221;&nbsp;<strong>front page<\/strong>&nbsp;&#8220;.<\/p>\n\n\n\n<p>Since it is related to the structure and design of the page, it is better to insert it first and then delete the block before replacement when inserting it in the same hierarchy as before replacement so that mistakes such as display collapse do not&nbsp;<strong>occur<\/strong>&nbsp;. I think.<\/p>\n\n\n\n<p>Here,&nbsp;<strong>the header after replacement is inserted before the header before replacement<\/strong>&nbsp;.<br>Since the header before replacement will be deleted eventually,&nbsp;it does not matter whether it is&nbsp;<strong>before or after .<\/strong><\/p>\n\n\n\n<p>When you add a block, an empty paragraph is displayed, and to insert the block pattern here,&nbsp;click&nbsp;<strong>the &#8220;+&#8221; mark on the right side of the paragraph.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized has-custom-border\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030222-1-1-1024x471.jpg\" alt=\"\" class=\"has-border-color has-black-border-color wp-image-3412\" style=\"border-width:1px\" width=\"768\" height=\"353\" srcset=\"https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030222-1-1-1024x471.jpg 1024w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030222-1-1-300x138.jpg 300w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030222-1-1-768x354.jpg 768w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030222-1-1.jpg 1349w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<p>You can search for the&nbsp;<strong>header to be inserted<\/strong>&nbsp;on the screen above, but if you click the &#8221;&nbsp;<strong>Show All &#8221; button for blocks and patterns,&nbsp;<\/strong><strong>the &#8220;Blocks&#8221; and &#8220;Patterns&#8221; menu<\/strong>&nbsp;will be displayed on the left.<\/p>\n\n\n\n<p>Theme-specific headers, footers, and other parts can be found&nbsp;<strong>under Patterns<\/strong>&nbsp;.<br>Patterns&nbsp;are categorized&nbsp;<strong>by categories such as &#8220;header&#8221; and &#8220;button&#8221;.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized has-custom-border\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030224-1-1-1024x471.jpg\" alt=\"\" class=\"has-border-color has-black-border-color wp-image-3413\" style=\"border-width:1px\" width=\"768\" height=\"353\" srcset=\"https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030224-1-1-1024x471.jpg 1024w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030224-1-1-300x138.jpg 300w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030224-1-1-768x353.jpg 768w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030224-1-1.jpg 1346w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<p><strong>Select a header category from the drop-down menu<\/strong>&nbsp;and click the thumbnail-displayed&nbsp;<strong>header after replacement<\/strong>&nbsp;to insert the block pattern in the location selected with the&nbsp;<strong>&#8220;+&#8221; button<\/strong>&nbsp;earlier .<\/p>\n\n\n\n<p><strong>There is also a header before replacement<\/strong>&nbsp;, so the header is duplicated.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized has-custom-border\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030226-1-1-1024x475.jpg\" alt=\"\" class=\"has-border-color has-black-border-color wp-image-3415\" style=\"border-width:1px\" width=\"768\" height=\"356\" srcset=\"https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030226-1-1-1024x475.jpg 1024w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030226-1-1-300x139.jpg 300w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030226-1-1-768x356.jpg 768w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030226-1-1.jpg 1346w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<p>Delete the header before replacement.<br>To avoid display collapse,&nbsp;it is locked to&nbsp;<strong>prohibit movement<\/strong>&nbsp;, but&nbsp;<strong>it can be deleted&nbsp;<\/strong>.<strong><\/strong><\/p>\n\n\n\n<p><strong>Click the three vertical dots to<\/strong>&nbsp;display the menu for operating the block, and&nbsp;there is&nbsp;<strong>a &#8220;Delete&#8221; menu at the bottom .<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized has-custom-border\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030228-1-1024x466.jpg\" alt=\"\" class=\"has-border-color has-black-border-color wp-image-3290\" style=\"border-width:1px\" width=\"768\" height=\"350\" srcset=\"https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030228-1-1024x466.jpg 1024w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030228-1-300x136.jpg 300w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030228-1-768x349.jpg 768w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030228-1.jpg 1366w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<p>After deleting the header before replacement, the replacement of the header is completed as shown below.<\/p>\n\n\n\n<p><strong>Click the &#8220;Save&#8221; button at the top right of the editor screen<\/strong>&nbsp;to insert the block pattern for the entire page and save the replaced template.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized has-custom-border\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030230-1-1-1024x470.jpg\" alt=\"\" class=\"has-border-color has-black-border-color wp-image-3416\" style=\"border-width:1px\" width=\"768\" height=\"353\" srcset=\"https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030230-1-1-1024x470.jpg 1024w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030230-1-1-300x138.jpg 300w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030230-1-1-768x352.jpg 768w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030230-1-1.jpg 1351w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n\n\n\n<p>View the site and check, the header has changed.<br>Although it is difficult to understand in the screen below, the hamburger menu displayed on smartphones is particularly different.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized has-custom-border\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030232-1-1-1024x458.jpg\" alt=\"\" class=\"has-border-color has-black-border-color wp-image-3417\" style=\"border-width:1px\" width=\"768\" height=\"344\" srcset=\"https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030232-1-1-1024x458.jpg 1024w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030232-1-1-300x134.jpg 300w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030232-1-1-768x344.jpg 768w, https:\/\/full-site-patterner.com\/en\/wp-content\/uploads\/2023\/03\/2023030232-1-1.jpg 1345w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>&#8221;&nbsp;FullSitePatterner&nbsp;&#8221;&nbsp;provides&nbsp;various block patterns such as headers, footers, buttons and boxes . Here,&nbsp;we will explain how to replace&nbsp;the header&nbsp;from&nbsp;the theme-specific&nbsp;default setting (header-navbar) to&nbsp;the WordPress default navigation (header-WP-navigation: design is customized) . Open the page with the header you want to change\u2026<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[],"class_list":["post-3164","post","type-post","status-publish","format-standard","hentry","category-how-to-use"],"_links":{"self":[{"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/posts\/3164","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/comments?post=3164"}],"version-history":[{"count":1,"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/posts\/3164\/revisions"}],"predecessor-version":[{"id":4418,"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/posts\/3164\/revisions\/4418"}],"wp:attachment":[{"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/media?parent=3164"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/categories?post=3164"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/full-site-patterner.com\/en\/wp-json\/wp\/v2\/tags?post=3164"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}