{"id":11011,"date":"2023-02-10T15:23:00","date_gmt":"2023-02-10T06:23:00","guid":{"rendered":"https:\/\/hanami-web.tokyo.jp\/blog\/?p=11011"},"modified":"2023-02-01T11:57:44","modified_gmt":"2023-02-01T02:57:44","slug":"advance-custom-filed-nocode","status":"publish","type":"post","link":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/","title":{"rendered":"How to output Advance Custom Fields without coding"},"content":{"rendered":"<p>&quot;Advance Custom Field&quot; is a plugin that allows you to add input fields to WordPress. Although the plugin is easy to set up, outputting it requires a bit of advanced settings such as using PHP code. If you use Brizy pro, you can output custom fields without coding, so I will show you how.<\/p>\n\n\n<div class=\"sc af\"><a rel=\"sponsored\" href=\"https:\/\/www.awin1.com\/awclick.php?gid=428374&mid=26663&awinaffid=2558511&linkid=4022446&clickref=\" target=\"_blank\">\r\n\t<p class=\"sc-txt02\">Brizy official website \u2192<\/p>\r\n<\/a><\/div>\r\n<div class=\"sc\"><a href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/nocode-brizy\/\" title=\"Brizy Plugin Explanation Index\">\r\n\t<p class=\"sc-txt01\">Our website is designed using the Brizy plugin.<\/p>\r\n\t<p class=\"sc-txt01\">How to create a no-code WordPress website<\/p>\r\n\t<p class=\"sc-txt02\">Brizy Explanation Index \u2192<\/p>\r\n<\/a><\/div><br>\r\n\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 ez-toc-wrap-center counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">table of contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #000000;color:#000000\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #000000;color:#000000\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewbox=\"0 0 24 24\" version=\"1.2\" baseprofile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#%e3%83%8e%e3%83%bc%e3%82%b3%e3%83%bc%e3%83%89%e3%81%a7advance_custom_field%e3%82%92%e5%87%ba%e5%8a%9b%e3%81%95%e3%81%9b%e3%82%8b%e6%96%b9%e6%b3%95\" >How to output Advance Custom Field without coding<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#advanced_custom_field%e3%83%97%e3%83%a9%e3%82%b0%e3%82%a4%e3%83%b3%e3%82%92%e3%82%a4%e3%83%b3%e3%82%b9%e3%83%88%e3%83%bc%e3%83%ab\" >Install the Advanced Custom Field plugin<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#field%e3%82%b0%e3%83%ab%e3%83%bc%e3%83%97%e3%82%92%e6%96%b0%e8%a6%8f%e4%bd%9c%e6%88%90\" >Create a new Field group<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#%e3%82%ab%e3%82%b9%e3%82%bf%e3%83%a0%e3%83%95%e3%82%a3%e3%83%bc%e3%83%ab%e3%83%89%e9%a0%85%e7%9b%ae%e3%82%92%e4%bd%9c%e6%88%90\" >Create a custom field item<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#%e3%81%a9%e3%81%ae%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%a7%e3%82%ab%e3%82%b9%e3%82%bf%e3%83%a0%e3%83%95%e3%82%a3%e3%83%bc%e3%83%ab%e3%83%89%e3%82%92%e4%bd%bf%e3%81%86%e3%81%8b%e8%a8%ad%e5%ae%9a\" >Set which pages the custom field will be used on<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#%e6%8a%95%e7%a8%bf%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%92%e7%a2%ba%e8%aa%8d\" >Check the submission page<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#%e5%85%a5%e5%8a%9b%e3%83%95%e3%82%a3%e3%83%bc%e3%83%ab%e3%83%89%e3%81%ab%e5%85%a5%e5%8a%9b%e3%81%97%e3%81%a6%e6%9b%b4%e6%96%b0%e3%82%92%e3%81%99%e3%82%8b%e3%81%a8\" >When you enter information into the input field and update it,<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#brizy%e3%82%92%e8%bf%bd%e5%8a%a0\" >Add Brizy<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#%e6%8a%95%e7%a8%bf%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%a7brizy%e3%83%93%e3%83%ab%e3%83%80%e3%83%bc%e3%82%92%e8%b5%b7%e5%8b%95\" >Launch Brizy Builder on your post page<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#brizy%e3%82%92%e4%bd%bf%e3%81%a3%e3%81%a6%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%92%e6%a7%8b%e6%88%90\" >Use Brizy to compose your pages<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#%e3%82%ab%e3%82%b9%e3%82%bf%e3%83%a0%e3%83%95%e3%82%a3%e3%83%bc%e3%83%ab%e3%81%a8%e3%81%ae%e5%87%ba%e5%8a%9b%e3%82%92%e7%a2%ba%e8%aa%8d\" >Check the output with custom fields<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#brizy%e3%81%ae%e3%83%86%e3%83%b3%e3%83%97%e3%83%ac%e3%83%bc%e3%83%88%e3%82%92%e4%bd%bf%e3%81%86%e6%96%b9%e6%b3%95%e3%82%82%e3%81%82%e3%82%8b\" >Alternatively, you can use Brizy templates.<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/hanami-web.tokyo.jp\/blog\/en\/website-running\/nocode\/advance-custom-filed-nocode\/#%e3%81%a9%e3%81%ae%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%ab%e5%8f%8d%e6%98%a0%e3%81%95%e3%81%9b%e3%82%8b%e3%81%8b%e3%81%be%e3%81%9a%e3%81%af%e9%81%b8%e6%8a%9e\" >First, select which page you want to reflect the changes on.<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%e3%83%8e%e3%83%bc%e3%82%b3%e3%83%bc%e3%83%89%e3%81%a7advance_custom_field%e3%82%92%e5%87%ba%e5%8a%9b%e3%81%95%e3%81%9b%e3%82%8b%e6%96%b9%e6%b3%95\"><\/span>How to output Advance Custom Field without coding<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>First, I used the no-code page builder Brizy to output the items set in Advance Custom Field without any coding.<\/p>\n\n\n\n<section class=\"wp-block-uagb-section uagb-section__wrap uagb-section__background-none uagb-block-488a5e3c\"><div class=\"uagb-section__overlay\"><\/div><div class=\"uagb-section__inner-wrap\">\n<p>This is a Brizy Pro feature. Please note that it is not offered in the free version.<\/p>\n<\/div><\/section>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Advanced Custom Fielding<\/li>\n\n\n\n<li>Brizy<\/li>\n<\/ul>\n\n\n\n<p>Using these two plugins, we will create a system that outputs custom fields without any coding.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"advanced_custom_field%e3%83%97%e3%83%a9%e3%82%b0%e3%82%a4%e3%83%b3%e3%82%92%e3%82%a4%e3%83%b3%e3%82%b9%e3%83%88%e3%83%bc%e3%83%ab\"><\/span>Install the Advanced Custom Field plugin<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Plugin<\/li>\n\n\n\n<li>New additions<\/li>\n\n\n\n<li>Enter &quot;Advanced Custom Field&quot; in the keywords<\/li>\n\n\n\n<li>Install now<\/li>\n\n\n\n<li>activation<\/li>\n<\/ul>\n\n\n\n<p>To do.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"333\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-2-1024x333.png\" alt=\"\" class=\"wp-image-11015\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-2-1024x333.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-2-300x98.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-2-768x250.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-2-1536x499.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-2.png 1667w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"field%e3%82%b0%e3%83%ab%e3%83%bc%e3%83%97%e3%82%92%e6%96%b0%e8%a6%8f%e4%bd%9c%e6%88%90\"><\/span>Create a new Field group<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Once you activate the plugin, a new section called \u201cCustom Fields\u201d will be added to the left.<br>First, create a field group.<\/p>\n\n\n\n<p>Click [Add New] or [Add New Group].<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"446\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-3-1024x446.png\" alt=\"\" class=\"wp-image-11016\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-3-1024x446.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-3-300x131.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-3-768x334.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-3-1536x669.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-3.png 1877w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Give it a name.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"485\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-4-1024x485.png\" alt=\"\" class=\"wp-image-11017\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-4-1024x485.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-4-300x142.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-4-768x364.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-4-1536x728.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-4.png 1693w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%e3%82%ab%e3%82%b9%e3%82%bf%e3%83%a0%e3%83%95%e3%82%a3%e3%83%bc%e3%83%ab%e3%83%89%e9%a0%85%e7%9b%ae%e3%82%92%e4%bd%9c%e6%88%90\"><\/span>Create a custom field item<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Once you have named it, you can create your custom field items.<br>this time<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Name \u2013 text field<\/li>\n\n\n\n<li>Teaching Experience - Select Field<\/li>\n\n\n\n<li>Photos - Media upload field<\/li>\n<\/ul>\n\n\n\n<p>I&#039;ll add three items:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"513\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-5-1024x513.png\" alt=\"\" class=\"wp-image-11018\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-5-1024x513.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-5-300x150.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-5-768x385.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-5-1536x770.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-5.png 1620w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Here are the fields I created:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"421\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-6-1024x421.png\" alt=\"\" class=\"wp-image-11019\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-6-1024x421.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-6-300x123.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-6-768x316.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-6-1536x632.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-6.png 1648w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%e3%81%a9%e3%81%ae%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%a7%e3%82%ab%e3%82%b9%e3%82%bf%e3%83%a0%e3%83%95%e3%82%a3%e3%83%bc%e3%83%ab%e3%83%89%e3%82%92%e4%bd%bf%e3%81%86%e3%81%8b%e8%a8%ad%e5%ae%9a\"><\/span>Set which pages the custom field will be used on<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Set which page the created field will be used on. In this example, we will output it to a blog post.<\/p>\n\n\n\n<section class=\"wp-block-uagb-section uagb-section__wrap uagb-section__background-none uagb-block-51e05bfc\"><div class=\"uagb-section__overlay\"><\/div><div class=\"uagb-section__inner-wrap\">\n<p>A common setup is to create a custom post type and output custom fields to the custom post type.<br>The plugin that allows you to create custom post types without coding is &quot;Custom Post Type UI&quot;<\/p>\n<\/div><\/section>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"303\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-7-1024x303.png\" alt=\"\" class=\"wp-image-11020\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-7-1024x303.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-7-300x89.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-7-768x227.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-7-1536x455.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-7.png 1641w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%e6%8a%95%e7%a8%bf%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%92%e7%a2%ba%e8%aa%8d\"><\/span>Check the submission page<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>I&#039;ll check out the submission page.<br>The input fields are being printed.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"547\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-8-1024x547.png\" alt=\"\" class=\"wp-image-11021\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-8-1024x547.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-8-300x160.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-8-768x410.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-8-1536x821.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-8.png 1538w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%e5%85%a5%e5%8a%9b%e3%83%95%e3%82%a3%e3%83%bc%e3%83%ab%e3%83%89%e3%81%ab%e5%85%a5%e5%8a%9b%e3%81%97%e3%81%a6%e6%9b%b4%e6%96%b0%e3%82%92%e3%81%99%e3%82%8b%e3%81%a8\"><\/span>When you enter information into the input field and update it,<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Let&#039;s quickly enter some information into the input fields and refresh the page.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"550\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-9-1024x550.png\" alt=\"\" class=\"wp-image-11022\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-9-1024x550.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-9-300x161.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-9-768x412.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-9.png 1403w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Nothing is displayed...<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"434\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-10-1024x434.png\" alt=\"\" class=\"wp-image-11023\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-10-1024x434.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-10-300x127.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-10-768x326.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-10.png 1372w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<section class=\"wp-block-uagb-section uagb-section__wrap uagb-section__background-none uagb-block-2520709e\"><div class=\"uagb-section__overlay\"><\/div><div class=\"uagb-section__inner-wrap\">\n<p>Normally, if you create a custom field using the Advanced Custom Field plugin, it will not be output unless you modify the PHP file and configure the output.<\/p>\n<\/div><\/section>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"brizy%e3%82%92%e8%bf%bd%e5%8a%a0\"><\/span>Add Brizy<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>I use the page builder plugin Brizy.<br>This is not a plugin just for Advanced Custom Field output!<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Plugin<\/li>\n\n\n\n<li>New additions<\/li>\n\n\n\n<li>Enter &quot;Brizy&quot; in the keyword field.<\/li>\n\n\n\n<li>Install now<\/li>\n\n\n\n<li>activation<\/li>\n<\/ul>\n\n\n\n<p>Please note that Brizy Pro is required to output custom fields.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"323\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-11-1024x323.png\" alt=\"\" class=\"wp-image-11024\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-11-1024x323.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-11-300x95.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-11-768x242.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-11-1536x484.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-11.png 1656w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%e6%8a%95%e7%a8%bf%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%a7brizy%e3%83%93%e3%83%ab%e3%83%80%e3%83%bc%e3%82%92%e8%b5%b7%e5%8b%95\"><\/span>Launch Brizy Builder on your post page<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Reopen the page where you just entered the custom fields and click the [Edit with Brizy] button.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"522\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-12-1024x522.png\" alt=\"\" class=\"wp-image-11025\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-12-1024x522.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-12-300x153.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-12-768x392.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-12.png 1535w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>You will need to load the header and footer, so please change your template back to the default.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"609\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-13-1024x609.png\" alt=\"\" class=\"wp-image-11026\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-13-1024x609.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-13-300x178.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-13-768x457.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-13.png 1443w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"brizy%e3%82%92%e4%bd%bf%e3%81%a3%e3%81%a6%e3%83%9a%e3%83%bc%e3%82%b8%e3%82%92%e6%a7%8b%e6%88%90\"><\/span>Use Brizy to compose your pages<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Click the plus button.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"541\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-14-1024x541.png\" alt=\"\" class=\"wp-image-11027\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-14-1024x541.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-14-300x158.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-14-768x406.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-14-1536x811.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-14.png 1573w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Any part will do, but this time we will use &quot;Create your own&quot;.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"504\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15-1024x504.jpg\" alt=\"\" class=\"wp-image-11028\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15-1024x504.jpg 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15-300x148.jpg 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15-768x378.jpg 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15-1536x756.jpg 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15.jpg 1622w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Drag and drop the text parts you want.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"532\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15-1024x532.png\" alt=\"\" class=\"wp-image-11029\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15-1024x532.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15-300x156.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15-768x399.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-15.png 1381w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>When you enter the half-width characters [#], the name of the custom field you created earlier will appear, so select it.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"516\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-16-1024x516.png\" alt=\"\" class=\"wp-image-11030\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-16-1024x516.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-16-300x151.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-16-768x387.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-16.png 1187w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>The image uses parts of the image.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"378\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-17-1024x378.png\" alt=\"\" class=\"wp-image-11031\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-17-1024x378.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-17-300x111.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-17-768x284.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-17.png 1478w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Click on the three lines and you&#039;ll be able to select the custom field you just created.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"991\" height=\"841\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-18.png\" alt=\"\" class=\"wp-image-11032\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-18.png 991w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-18-300x255.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-18-768x652.png 768w\" sizes=\"(max-width: 991px) 100vw, 991px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%e3%82%ab%e3%82%b9%e3%82%bf%e3%83%a0%e3%83%95%e3%82%a3%e3%83%bc%e3%83%ab%e3%81%a8%e3%81%ae%e5%87%ba%e5%8a%9b%e3%82%92%e7%a2%ba%e8%aa%8d\"><\/span>Check the output with custom fields<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Finally, click the Publish button and you will see that the custom fields have been output.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"526\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-19-1024x526.png\" alt=\"\" class=\"wp-image-11033\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-19-1024x526.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-19-300x154.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-19-768x394.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-19-1536x789.png 1536w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-19.png 1550w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"brizy%e3%81%ae%e3%83%86%e3%83%b3%e3%83%97%e3%83%ac%e3%83%bc%e3%83%88%e3%82%92%e4%bd%bf%e3%81%86%e6%96%b9%e6%b3%95%e3%82%82%e3%81%82%e3%82%8b\"><\/span>Alternatively, you can use Brizy templates.<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>With the method we just introduced, you have to enter the values into the custom fields and set the output each time, but by using Brizy templates, you can automatically output the values of the custom fields.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Brizy<\/li>\n\n\n\n<li>template<\/li>\n<\/ul>\n\n\n\n<p>and configure it.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"391\" height=\"387\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-20.png\" alt=\"\" class=\"wp-image-11034\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-20.png 391w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-20-300x297.png 300w\" sizes=\"(max-width: 391px) 100vw, 391px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%e3%81%a9%e3%81%ae%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%ab%e5%8f%8d%e6%98%a0%e3%81%95%e3%81%9b%e3%82%8b%e3%81%8b%e3%81%be%e3%81%9a%e3%81%af%e9%81%b8%e6%8a%9e\"><\/span>First, select which page you want to reflect the changes on.<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Set which page the template you are about to create will be a template for. In this example, we are assuming that the template will be for the entire blog, so<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>include<\/li>\n\n\n\n<li>Posts<\/li>\n\n\n\n<li>All<\/li>\n<\/ul>\n\n\n\n<p>After that, click Edit with Brizy and create the page in the same way.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"440\" src=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-21-1024x440.png\" alt=\"\" class=\"wp-image-11035\" srcset=\"https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-21-1024x440.png 1024w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-21-300x129.png 300w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-21-768x330.png 768w, https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/image-21.png 1400w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>","protected":false},"excerpt":{"rendered":"<p>WordPress\u3067\u5165\u529b\u9805\u76ee\u3092\u8ffd\u52a0\u3067\u304d\u308b\u300cAdvance Custom Field\u300d\u3067\u3059\u304c\u3001\u30d7\u30e9\u30b0\u30a4\u30f3\u306e\u8a2d\u5b9a\u306f\u7c21\u5358\u306a\u306e\u3067\u3059\u304c\u51fa\u529b\u3059\u308b\u306b\u306fPHP\u30b3\u30fc\u30c9\u3092\u4f7f\u3063\u305f\u308a\u3068\u5c11\u3057\u9ad8\u5ea6\u306a\u8a2d\u5b9a\u306b\u306a\u308a\u307e\u3059\u3002Brizy pro\u3092\u4f7f\u3046\u3068\u30ce\u30fc\u30b3\u30fc [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":11036,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"content-type":"","_uag_custom_page_level_css":"","footnotes":""},"categories":[1474],"tags":[1465],"class_list":["post-11011","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-nocode","tag-brizy"],"blocksy_meta":[],"aioseo_notices":[],"uagb_featured_image_src":{"full":["https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/thumnail-25.png",720,540,false],"thumbnail":["https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/thumnail-25-150x150.png",150,150,true],"medium":["https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/thumnail-25-300x225.png",300,225,true],"medium_large":["https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/thumnail-25.png",720,540,false],"large":["https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/thumnail-25.png",720,540,false],"1536x1536":["https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/thumnail-25.png",720,540,false],"2048x2048":["https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/thumnail-25.png",720,540,false],"trp-custom-language-flag":["https:\/\/hanami-web.tokyo.jp\/blog\/wp-content\/uploads\/2023\/02\/thumnail-25.png",16,12,false]},"uagb_author_info":{"display_name":"\u682a\u5f0f\u4f1a\u793eHanamiWEB \u4ee3\u8868\u53d6\u7de0\u5f79 \u677e\u6d66\u307f\u3055","author_link":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/author\/hanami\/"},"uagb_comment_info":0,"uagb_excerpt":"WordPress\u3067\u5165\u529b\u9805\u76ee\u3092\u8ffd\u52a0\u3067\u304d\u308b\u300cAdvance Custom Field\u300d\u3067\u3059\u304c\u3001\u30d7\u30e9\u30b0\u30a4\u30f3\u306e\u8a2d\u5b9a\u306f&hellip;","brizy_media":[],"_links":{"self":[{"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/posts\/11011","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/comments?post=11011"}],"version-history":[{"count":0,"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/posts\/11011\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/media\/11036"}],"wp:attachment":[{"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/media?parent=11011"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/categories?post=11011"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/hanami-web.tokyo.jp\/blog\/en\/wp-json\/wp\/v2\/tags?post=11011"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}