Wordpress Customizer 内容特定控件

Question

我在为 Wordpress 自定义主题时面临一项挑战。我想在我的主题定制器中使用特定于内容的控件。我知道有选项 "active_callback"，但这不足以满足我的目的，我阅读了 2 篇关于定制器的文档文章和这篇 https://make.wordpress.org/core/2014/07/08/customizer-improvements-in-4-0/ 文章，但仍然没有任何线索，这就是我想要实现的目标：

例如，我想要 "show sidebar" 复选框，但是这个复选框应该更符合上下文。例如，当我在主页上时，只有一个复选框 "Show sidebar default" 但是当我进入一些 post 时，我希望有 3 个复选框：

"Show sidebar default" - id="show_sidebar"
"Show sidebar in Post archive page" - id="show_sidebar_archive_{post_type}"
"Show sidebar for this post" - id="show_sidebar_singular_{post_id}"

所以当我想要这种特定的控件ID时，仅active_callback是不够的，因为它只能show/hide控件，当[=45时我无法创建新的=] 在 iframe 中更改。

可能有两种解决方案： 1. 更好 - 当我能以某种方式 create/remove 通过上下文控制时，这将是最好的解决方案。如果定制器 API 有某种可能，请给我一些提示 2. 不好，但足够了 - 至少有可能以某种方式重新加载整个 /wp-admin/customize.php?url= 用新的点击 url?这可能够用一段时间了

感谢任何建议！

Answer 1

好的，我找到了第二个解决方案，这是代码。现在对我来说足够了。

'use strict';

(function ($) {

  /**
   * This is important fix for Theme Customizer
   * It will change whole customizer url, because we need to load
   * all controls ahan for new url, because of hierarchical options
   */
  if ( /\/customize\.php$/.test( window.location.pathname ) ) {
    wp.customize.bind( 'preview-ready', function() {
      var body = $( 'body' );
      body.off( 'click.preview' );
      body.on( 'click.preview', 'a[href]', function( event ) {
        var link, isInternalJumpLink;
        link = $( this );
        isInternalJumpLink = ( '#' === link.attr( 'href' ).substr( 0, 1 ) );
        event.preventDefault();

        if ( isInternalJumpLink && '#' !== link.attr( 'href' ) ) {
          $( link.attr( 'href' ) ).each( function() {
            this.scrollIntoView();
          } );
        }

        /*
         * Note the shift key is checked so shift+click on widgets or
         * nav menu items can just result on focusing on the corresponding
         * control instead of also navigating to the URL linked to.
         */
        if ( event.shiftKey || isInternalJumpLink ) {
          return;
        }
        //self.send( 'scroll', 0 );
        //self.send( 'url', link.prop( 'href' ) );

        var newUrl = link.prop( 'href' );
        var currentUrl = window.location.href;

        var customizeUrl = currentUrl.substring(0, currentUrl.indexOf("?url=") + 5) + newUrl;

        // Reload whole customizer for new url
        window.parent.location.replace(customizeUrl);
      });
    } );
  }
})(jQuery);
//# sourceMappingURL=customizer.js.map

Wordpress Customizer 内容特定控件

Wordpress Customizer content specific controls

javascript

php

wordpress

wordpress-theming