web-dev-qa-db-ja.com

$ wp_customize customizer_preview_initがJavaScriptの内部で起動しない

カスタマイザで行った変更のライブプレビューをトリガーするために、customizer_preview_initアクションをフックしようとしています。しかし、私の最初のテストは失敗しています。私はちょうど.jsの中で発火するように警告を得ようとしています

私が悪いことをしているという考えはありますか?

//Add customizer.php to admin:
if ( is_admin() ) :
require_once( GENESIS_ADMIN_DIR . '/customizer.php' );

customizer.php:

function mytheme_customizer_live_preview()
{
    wp_enqueue_script(
            'mytheme-themecustomizer',  //Give the script an ID
            get_template_directory_uri().'/framework/admin/customizer.js',//Point to file
            array( 'customize-preview' ),   //Define dependencies
            '', //Define a version (optional)
            true //Put script in footer?
    );
}
add_action( 'customize_preview_init', 'mytheme_customizer_live_preview' );

customizer.js

alert('customizer.js loaded!'); 

( function( $ ) {

    alert('Customizer!');
    //Do Stuff

} )( jQuery );

更新:私のエンキューが失敗しているようです。 customizer.jsファイルは、dev toolsリソースパネルにはありません。

Footer.phpが実際に期待通りにwp_footer()を呼び出すことを確認しました。これは創世記のテーマです、おそらくいくつかのフィルタがエンキューに影響を与えますか?

2
N2Mystic

この場合の問題は、customize.phpスクリプトを追加した方法に関係しています。私はそれをis_admin()チェックの中にロードしていました(上記の更新された質問を参照してください)。

Ottoの投稿 を読んだ後、カスタマイザフックはこの文脈では起動しないことに気付きました。

2
N2Mystic

TwentyForteenをテーマにしたサブサイトでプラグインを実行しながら、ほぼVanillaのマルチサイト/ネットワークインストールであなたの問題を再現するための簡単なプラグインを書きました。これは2つのファイルで構成されています。どちらも同じディレクトリにあります:plugin.phptheme-customizer.js

メインプラグインファイル:

<?php

namespace WPSE;

/** Plugin Name: (#138550) Theme Customizer Register Script */

# add_action( 'customize_preview_init', 'WPSE\registerScript' );
add_action( 'customize_controls_enqueue_scripts', 'WPSE\registerScript' );
function registerScript()
{
    wp_enqueue_script(
        'wpse-theme-customizer',
        plugin_dir_url( __FILE__ ).'theme-customizer.js',
        array(
                'jquery',
                'customize-preview',
            ),
        filemtime( plugin_dir_path( __FILE__ ).'theme-customizer.js' ),
        TRUE
    );
}

JavaScriptテストファイル:

/*globals jQuery */
( function( $ ) {
    "use strict";

    alert( 'Here we go!' );
} )( jQuery );

上記の魅力のように動作します:)

ヒント:テーマで plugin_dir_path()を使用することもできます

編集

上記の@toschoコメントと彼の 回答へのリンク の後、私は一方のフックともう一方のフックをテストすることにしました。そしてサプライズ!! 1! 違いますcustomize_controls_enqueue_scriptsは先に撃ってコアを調べてみると、ランダムな方法では巨大なSingleton/Poor-Mans-Namespaceに隠されていないため、はるかに信頼性が高いようです。

結論:customize_controls_enqueue_scriptsを読み、customize_preview_initを忘れてください。前者のbtwはcustomize_controls_initコールバックがトリガーされた直後に実行されるので、他のコードの干渉の可能性は少なくなります。

1
kaiser