新しいWP_Customize API-内部でどのように機能しますか？

新しい「カスタマイズ」機能で変更を加えた場合、iframeプレビュードキュメント内の別のページに移動すると、変更が保存されていなくても引き続き適用されることに気付きました。

WPは一時的な変更をどこかに保存しているように見え、サイトが「カスタマイズ」モードで表示されている場合、それらをサイトに適用します。

しかし、サイトは、カスタマイズモードにあることをどのように認識しますか？リンクやそのようなものにクエリ引数が追加されていないためです。

ここに適用されるいくつかのビットがありますが、短いのは次のコードですcustomize-preview.js：

this.body.on( 'click.preview', 'a', function( event ) {
    event.preventDefault();
    self.send( 'scroll', 0 );
    self.send( 'url', $(this).prop('href') );
});

event.preventDefaultは、リンクが実際に機能するのを防ぎます。次に、次のコードは、a）ページの上部にスクロールして戻り、b）URLを変更することを伝えるメッセージを上向きに送信します。

ここでメッセージを送信する理由は、iframeが1つだけではなく、2つあるためです。クリックしたページは、実際に（POST実際に）カスタマイザーの設定が追加された別のiframe内にロードされ、フェードエフェクトを使用して古いページがフェードアウトし、新しいページがシームレスにフェードインします。これにより、新しいページに切り替えたときに画面が白くandくなり、点滅するのを防ぎます。

また、テーマコードでフィルタリングなどを行い、ページの外観を潜在的に変更する必要がなくなります。そのため、テーマは内容に大きな変更を加えることなくそのまま表示されます。

フォーム送信がまったく機能しない（何もしない）ようにするために、同様のコードが存在します。

カスタマイザー値をインターセプトおよび処理するためのフィルターはにありclass-wp-customize-setting.phpます。preview()この関数は、入力値を処理するために必要なフィルタを追加する_preview_filter()機能は、そのフィルタです。それは単にget_option()orのget_theme_mod()呼び出しを受け取り、それらが変更されたオプションであることに注意して、代わりに変更された値を返します。

カスタマイザープレビューウィンドウでリンクをクリックすると、生成されるPOSTリクエストは通常​​のリクエストではなくリクエストになりGETます。カスタマイザーは、リンクのクリックをオーバーライドして、POST代わりに次のフォームデータを使用しているように見えます。

wp_customize: on
theme: themename
customized: {json-encoded-options-here}
customize_messenger_channel: preview-1

カスタマイズされたフィールドは、データがあなたのテーマに渡されている場所なので、あなたが変更したオプションが含まれているものです。次に、カスタマイザーコードは、テーマのオプションが要求されたときに（フィルターを介して、どのフィルターを使用するか正確にはわかりません）インターセプトし、カスタマイズされたパラメーターの値に置き換えます。