カテゴリー
WordPress

WordPress Twenty Nineteen 子テーマ作成。カスタマイザーの 色 > アイキャッチ画像にメインカラーのフィルターを適用する のチェックをデフォルトで無しにするコードをリファクタリングして超ダイエットした

はじめに

WordPress Twenty Nineteen 子テーマ作成。カスタマイザーの 色 > アイキャッチ画像にメインカラーのフィルターを適用する のチェックをデフォルトで無しにする方法 – oki2a24 にて作ったコードは、動くには動きました。けれども、必要な部分が少しだけで残りはコピペ、メンテナンス性も悪い状態でした><。

今回、この状態を改善しましたのでノートします。

改善まとめ

以前は親テーマで customize_register にフックしたメソッドをを打ち消して子テーマで作成したメソッドを登録し直していました。

そうではなく、 優先度を低くして、親テーマの後に子テーマのメソッドが実行されるようにしました。

改善にあたって学習したこと

customize_register アクションにフックした関数は、子テーマ -> 親テーマ、の順に実行されます。したがって、内容が重複していると親テーマの内容で子テーマの内容が上書きされてしまいます。

実行の順番に関係なく、親テーマのメソッドを打ち消して子テーマのメソッドをフックするようにしたのが以前の投稿でした。

本投稿では、親テーマ -> 子テーマの順に customize_register アクションにフックした関数を実行させるようにしました。

ポイントとなるのは、 add_action メソッドの 3 番目の引数 $priority です。これは値が小さいほどフックした関数がはじめに実行され、未設定の場合のデフォルト値は 10 というものです。

親テーマの customize_register アクションにフックした関数の $priority は設定されておらず、つまり 10 でしたので、子テーマではこれよりも大きな値を設定すれば解決です♪

親テーマ -> 子テーマの順でフックした関数が実行されたことを確認したあとは、子テーマで上書きしたい部分とそのほかに必要な部分のみを残すように削っていきました。

結果としては、上書きしたい部分のみを残せばよかったので、これでやりたいことは実現できました♪

差分

子テーマの functions.php はダイエットの結果こうなりました。

$ git diff 6026d41 bf39610
diff --git a/functions.php b/functions.php
index 80cda2e..c0db5c4 100644
--- a/functions.php
+++ b/functions.php
@@ -46,83 +46,12 @@ function add_search_box_to_menu( $items, $args ) {
 add_filter( 'wp_nav_menu_items', 'add_search_box_to_menu', 10, 2);
 
 /**
- * Add postMessage support for site title and description for the Theme Customizer.
- * 色 > アイキャッチ画像にメインカラーのフィルターを適用する のチェックなしをデフォルトにします。
- * 上記の以外は、 Twenty Nineteen をほぼそのまま上書きするもので、バージョンは以下です。
- * バージョン: 1.3
+ * テーマカスタマイザーの、色 > アイキャッチ画像にメインカラーのフィルターを適用する
+ * のチェックなしをデフォルトにします。
  *
  * @param WP_Customize_Manager $wp_customize Theme Customizer object.
  */
 function child_twentynineteen_customize_register( $wp_customize ) {
-  $wp_customize->get_setting( 'blogname' )->transport         = 'postMessage';
-  $wp_customize->get_setting( 'blogdescription' )->transport  = 'postMessage';
-  $wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage';
-
-  if ( isset( $wp_customize->selective_refresh ) ) {
-    $wp_customize->selective_refresh->add_partial(
-      'blogname',
-      array(
-        'selector'        => '.site-title a',
-        'render_callback' => 'twentynineteen_customize_partial_blogname',
-      )
-    );
-    $wp_customize->selective_refresh->add_partial(
-      'blogdescription',
-      array(
-        'selector'        => '.site-description',
-        'render_callback' => 'twentynineteen_customize_partial_blogdescription',
-      )
-    );
-  }
-
-  /**
-   * Primary color.
-   */
-  $wp_customize->add_setting(
-    'primary_color',
-    array(
-      'default'           => 'default',
-      'transport'         => 'postMessage',
-      'sanitize_callback' => 'twentynineteen_sanitize_color_option',
-    )
-  );
-
-  $wp_customize->add_control(
-    'primary_color',
-    array(
-      'type'     => 'radio',
-      'label'    => __( 'Primary Color', 'twentynineteen' ),
-      'choices'  => array(
-        'default' => _x( 'Default', 'primary color', 'twentynineteen' ),
-        'custom'  => _x( 'Custom', 'primary color', 'twentynineteen' ),
-      ),
-      'section'  => 'colors',
-      'priority' => 5,
-    )
-  );
-
-  // Add primary color hue setting and control.
-  $wp_customize->add_setting(
-    'primary_color_hue',
-    array(
-      'default'           => twentynineteen_get_default_hue(),
-      'transport'         => 'postMessage',
-      'sanitize_callback' => 'absint',
-    )
-  );
-
-  $wp_customize->add_control(
-    new WP_Customize_Color_Control(
-      $wp_customize,
-      'primary_color_hue',
-      array(
-        'description' => __( 'Apply a custom color for buttons, links, featured images, etc.', 'twentynineteen' ),
-        'section'     => 'colors',
-        'mode'        => 'hue',
-      )
-    )
-  );
-
   // Add image filter setting and control.
   $wp_customize->add_setting(
     'image_filter',
@@ -132,27 +61,8 @@ function child_twentynineteen_customize_register( $wp_customize ) {
       'transport'         => 'postMessage',
     )
   );
-
-  $wp_customize->add_control(
-    'image_filter',
-    array(
-      'label'   => __( 'Apply a filter to featured images using the primary color', 'twentynineteen' ),
-      'section' => 'colors',
-      'type'    => 'checkbox',
-    )
-  );
-}
-
-/**
- * 親テーマのアクションを子テーマのアクションに入れ替えます。
- */
-function setup_after_parent_theme() {
-  // 子テーマのアクションを追加し、親テーマのアクションを削除
-  add_action( 'customize_register', 'child_twentynineteen_customize_register' );
-  remove_action( 'customize_register', 'twentynineteen_customize_register' );
 }
-// 親テーマの後に実行
-add_action( 'after_setup_theme', 'setup_after_parent_theme', 20 );
+add_action( 'customize_register', 'child_twentynineteen_customize_register', 100 );
 
 /**
  * デフォルトのサイトアイコンを設定します。
$ 

おわりに

"add_action メソッドの 3 番目の引数 $priority" の使い方に気が付いたのは、次の実践でした。

回り道をした感覚はありますけれども、結果としては全て自分の力となりましたので、とても嬉しく思います♪

以上です。

コメントを残す