{"id":4360,"date":"2018-01-06T17:41:00","date_gmt":"2018-01-06T16:41:00","guid":{"rendered":"https:\/\/florianbrinkmann.com\/en\/?p=4360"},"modified":"2020-02-09T10:59:39","modified_gmt":"2020-02-09T09:59:39","slug":"dropdown-pages-control-customize-js-api","status":"publish","type":"post","link":"https:\/\/florianbrinkmann.com\/en\/dropdown-pages-control-customize-js-api-4360\/","title":{"rendered":"Creating dropdown-pages control with Customize JS API"},"content":{"rendered":"\n<p>All base controls from the core can be created with the Customize JS API, except the dropdown pages control, that renders as a select list with all pages of the site. This means, we usually need to create that control via the PHP API at the moment.<\/p>\n\n\n\n<p>As a reaction to <a href=\"https:\/\/wordpress.stackexchange.com\/questions\/286375\/customizer-js-api-adding-a-dropdown-pages-control\">a wordpress.stackexchange.com question<\/a>, Weston Ruter wrote a <a href=\"https:\/\/gist.github.com\/westonruter\/00c351830e0a15cef7672b748720a7ff\">plugin that lets us create the dropdown pages control via the JS API<\/a> (some details on that can be found in his <a href=\"https:\/\/wordpress.stackexchange.com\/a\/286392\/112824\">answer to the question<\/a>). The important part is the <code class=\"lang-php\">print_control_templates()<\/code> method that creates a control template for the JS API to use when it should create a <code class=\"lang-js\">dropdown-pages<\/code> control. This template is included in the customizer with the following call in the <code class=\"lang-php\">init()<\/code> method:<\/p>\n\n\n<pre class=\"wp-block-code lang-php\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"PHP\" data-shcb-language-slug=\"php\"><span><code class=\"hljs language-php\">add_action( <span class=\"hljs-string\">'customize_controls_print_footer_scripts'<\/span>, <span class=\"hljs-keyword\">array<\/span>( <span class=\"hljs-keyword\">$this<\/span>, <span class=\"hljs-string\">'print_control_templates'<\/span> ) );<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">PHP<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">php<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>","protected":false},"excerpt":{"rendered":"<p>All base controls from the core can be created with the Customize JS API, except the dropdown pages control, that renders as a select list with all pages of the site. This means, we usually need to create that control via the PHP API at the moment. As a reaction to a wordpress.stackexchange.com question, Weston [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"wpf_show_in_dewp_planet_feed":false,"flobn_post_versions":"","webmentions_disabled_pings":false,"webmentions_disabled":false,"lazy_load_responsive_images_disabled":false,"footnotes":""},"categories":[42],"tags":[],"class_list":["post-4360","post","type-post","status-publish","format-standard","hentry","category-wordpress-plugins"],"wp-worthy-pixel":{"ignored":false,"public":null,"server":null,"url":null},"wp-worthy-type":"normal","_links":{"self":[{"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/posts\/4360","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/comments?post=4360"}],"version-history":[{"count":2,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/posts\/4360\/revisions"}],"predecessor-version":[{"id":5819,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/posts\/4360\/revisions\/5819"}],"wp:attachment":[{"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/media?parent=4360"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/categories?post=4360"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/florianbrinkmann.com\/en\/wp-json\/wp\/v2\/tags?post=4360"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}