カスタマイザー デフォルト

ビルトインセクション

Title ID Priority (Order)
Site Title & Tagline title_tagline 20
Colors colors 40
Header Image header_image 60
Background Image background_image 80
Navigation nav 100
Widgets (Panel) widgets 110
Static Front Page static_front_page 120
default 160

Theme Customizer Default Sections

変数

setting

  • public $manager;
  • public $id;
  • public $type= 'theme_mod';
  • public $capability= 'edit_theme_options';
  • public $theme_supports = '';
  • public $default = '';
  • public $transport = 'refresh';
  • public $sanitize_callback = '';
  • public $sanitize_js_callback= '';
  • public $dirty= false;
  • protected $id_data= array();

control

  • protected static $instance_count= 0;
  • public $instance_number;
  • public $manager;
  • public $id;
  • public $settings;
  • public $setting= 'default';
  • public $priority= 10;
  • public $section= '';
  • public $label= '';
  • public $description= '';
  • public $choices= array();
  • public $input_attrs= array();
  • public $json= array();
  • public $type= 'text';
  • public $active_callback= '';

カスタマイザー権限の設定

$textdomain_theme_mod_args= array(

'text-domain _max_width' => array(

'default' => 'Static Value',

'label' => __( 'Page Max Width', 'text-domain' ),

'description' => __( 'Responsive Max Width', 'text-domain ' ),

'sanitize_callback' => [radio| text| range| email| password| textarea| date| select| dropdown-pages ],

'type' => [radio|text|range|email|password|textarea|date|select|dropdown-pages]

'choices' => [radio| text| range| email| password| textarea| date| select| dropdown-pages| Number ],

'mode' => [hue(version 4.7) ],

'unit' => 'px',

'section' => 'Section',

'priority' => 10,

'capability' => 'edit_theme_options',

'data_type' => [option|theme_mod]

'input_attrs' => array(), // associative array of 'attr'=> 'value'

'active_callback'=> 'callback_function_name'

'mime_type' => '', //image audio

'transport' => '[refresh|…]', //image audio

'setting' => '[default|…]', //image audio

'dirty' => '[false|…]', //image audio

),

);

赤 必須
緑 デフォルト値あり

動作確認用のコードは、テーマまたはチャイルドテーマのfunctions.phpのPHP区間内に記述してください(<?php コード ?>)
ここに記述したコードは、WordPress 4.2.2 + twentytwelve のチャイルドテーマでテストしました。

カスタマイザーの設定値の利用方法

テンプレートなどで、以下のように記述すると表示できます

設定値の選択肢の記述

 

Radio ボタンの選択肢

  • 動作確認用コード

テキストフィールド

  • 動作確認用コード

レンジ フィールド

  • 動作確認用コード

2017/2/20 訂正
誤:

正:

Eメールフィールド

  • 動作確認用コード

パスワードフィールド

  • 動作確認用コード

テキストエリア

  • 動作確認用コード

日付フィールド

date-field

  • 動作確認用コード

セレクトボックス

  • 動作確認用コード

Number

customizer-number-control

input_attrsは、動作しない模様です。(4.2.2)なので、sanitize_callbackで入力値をチェックできたとしても、ユーザー操作では範囲外の入力ができてしまいます

  • 動作確認用コード

ドロップダウンページ

  • 動作確認用コード

派生クラスによるコントロール

Color Picker

  • 動作確認用コード

画像

customizer-image-control

  • 動作確認用コード

radio-icon-customizer

image example1
image example1
image example1

  • 動作確認用コード

ver4.7

color-hue-control

CSS3 hsl colorのためのカラーピッカーで、0-359 の整数を返します。

  • 動作確認用コード

sanitize_callback hook


tenman.info