您可能已經(jīng)知道,主題開發(fā)人員可以使用WordPress Customizer API?為其主題創(chuàng)建設(shè)置,從而允許網(wǎng)站所有者微調(diào)配色方案、背景圖像和其他自定義選項(xiàng)等內(nèi)容,并實(shí)時(shí)查看這些更改的預(yù)覽。

由于我們永遠(yuǎn)不應(yīng)該信任用戶輸入,因此定制器 API 需要為每個(gè)設(shè)置定義一個(gè)回調(diào)函數(shù)來(lái)驗(yàn)證和清理輸入。下面的代碼示例將演示如何為各種數(shù)據(jù)類型定義清理回調(diào)函數(shù)。為了方便起見,代碼還包括在主題定制器中添加部分和設(shè)置的方法。
清理單選框
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//radio box sanitization function
function theme_slug_sanitize_radio( $input, $setting ){
//input must be a slug: lowercase alphanumeric characters, dashes and underscores are allowed only
$input = sanitize_key($input);
//get the list of possible radio box options
$choices = $setting->manager->get_control( $setting->id )->choices;
//return input if valid or return default option
return ( array_key_exists( $input, $choices ) ? $input : $setting->default );
}
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_radio',
array(
'sanitize_callback' => 'theme_slug_sanitize_radio'
)
);
$wp_customize->add_control(
'theme_slug_customizer_radio',
array(
'label' => esc_html__( 'Your Setting with Radio Box', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'radio',
'choices' => array(
'one' => esc_html__('Choice One','theme_slug'),
'two' => esc_html__('Choice Two','theme_slug'),
'three' => esc_html__('Choice Three','theme_slug')
)
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理多選框
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//checkbox sanitization function
function theme_slug_sanitize_checkbox( $input ){
//returns true if checkbox is checked
return ( isset( $input ) ? true : false );
}
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_checkbox',
array(
'default' => '',
'sanitize_callback' => 'theme_slug_sanitize_checkbox'
)
);
$wp_customize->add_control(
'theme_slug_customizer_checkbox',
array(
'label' => esc_html__( 'Your Setting with Checkbox', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'checkbox'
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理 select 選項(xiàng)
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//select sanitization function
function theme_slug_sanitize_select( $input, $setting ){
//input must be a slug: lowercase alphanumeric characters, dashes and underscores are allowed only
$input = sanitize_key($input);
//get the list of possible select options
$choices = $setting->manager->get_control( $setting->id )->choices;
//return input if valid or return default option
return ( array_key_exists( $input, $choices ) ? $input : $setting->default );
}
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_select',
array(
'sanitize_callback' => 'theme_slug_sanitize_select'
)
);
$wp_customize->add_control(
'theme_slug_customizer_select',
array(
'label' => esc_html__( 'Your Setting with select', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'select',
'choices' => array(
'' => esc_html__('Please select','theme_slug'),
'one' => esc_html__('Choice One','theme_slug'),
'two' => esc_html__('Choice Two','theme_slug'),
'three' => esc_html__('Choice Three','theme_slug')
)
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理單行文本和多行文本域
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_text',
array(
'sanitize_callback' => 'wp_filter_nohtml_kses' //removes all HTML from content
)
);
$wp_customize->add_control(
'theme_slug_customizer_text',
array(
'label' => esc_html__( 'Your Setting with text input', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'text'
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理郵箱地址
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_email',
array(
'sanitize_callback' => 'sanitize_email' //removes all invalid characters
)
);
$wp_customize->add_control(
'theme_slug_customizer_email',
array(
'label' => esc_html__( 'Your Setting with email input', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'email'
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理網(wǎng)址
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_url',
array(
'sanitize_callback' => 'esc_url_raw' //cleans URL from all invalid characters
)
);
$wp_customize->add_control(
'theme_slug_customizer_url',
array(
'label' => esc_html__( 'Your Setting with URL input', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'url'
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理數(shù)字
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_number',
array(
'sanitize_callback' => 'absint' //converts value to a non-negative integer
)
);
$wp_customize->add_control(
'theme_slug_customizer_number',
array(
'label' => esc_html__( 'Your Setting with number input', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'number'
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理下拉頁(yè)面
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_dropdown_pages',
array(
'sanitize_callback' => 'absint' //input value is a page ID so it must be a positive integer
)
);
$wp_customize->add_control(
'theme_slug_customizer_dropdown_pages',
array(
'label' => esc_html__( 'Your Setting with dropdown_pages input', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'dropdown-pages'
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理文件上傳
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//file input sanitization function
function theme_slug_sanitize_file( $file, $setting ) {
//allowed file types
$mimes = array(
'jpg|jpeg|jpe' => 'image/jpeg',
'gif' => 'image/gif',
'png' => 'image/png'
);
//check file type from file name
$file_ext = wp_check_filetype( $file, $mimes );
//if file has a valid mime type return it, otherwise return default
return ( $file_ext['ext'] ? $file : $setting->default );
}
//add select setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_file',
array(
'sanitize_callback' => 'theme_slug_sanitize_file'
)
);
$wp_customize->add_control(
new WP_Customize_Upload_Control(
$wp_customize,
'theme_slug_customizer_file',
array(
'label' => __( 'Your Setting with file input', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section'
)
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理 CSS
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_css',
array(
'sanitize_callback' => 'wp_strip_all_tags' //strip all HTML tags including script and style
)
);
$wp_customize->add_control(
'theme_slug_customizer_css',
array(
'label' => esc_html__( 'Your Setting with CSS input', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'textarea'
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理 HTML 顏色代碼
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_color',
array(
'default' => '#000000',
'sanitize_callback' => 'sanitize_hex_color' //validates 3 or 6 digit HTML hex color code
)
);
$wp_customize->add_control(
new WP_Customize_Color_Control(
$wp_customize,
'theme_slug_customizer_color',
array(
'label' => __( 'Your Setting with color input', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section'
)
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
清理 HTML 代碼
使用wp_kses_post()僅保留帖子內(nèi)容中允許的 HTML 標(biāo)簽的功能。
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_html_code',
array(
'sanitize_callback' => 'wp_kses_post' //keeps only HTML tags that are allowed in post content
)
);
$wp_customize->add_control(
'theme_slug_customizer_html_code',
array(
'label' => esc_html__( 'Your Setting with HTML code', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'textarea'
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
或者,您可以使用wp_kses()函數(shù)來(lái)定義允許的 HTML 標(biāo)記和屬性,如下所示:
$allowed_html = array(
'a' => array(
'href' => array(),
'title' => array()
),
'br' => array(),
'em' => array(),
'strong' => array(),
);
wp_kses($input, $allowed_html);
清理 JAVASCRIPT 代碼
我們正在使用base64_encode()函數(shù)將腳本正確保存在數(shù)據(jù)庫(kù)中,并使用base64_decode()函數(shù)來(lái)轉(zhuǎn)義自定義程序中 textarea 的腳本。還可以在前端使用base64_decode()函數(shù)來(lái)回顯腳本。
function theme_slug_customizer( $wp_customize ) {
//your section
$wp_customize->add_section(
'theme_slug_customizer_your_section',
array(
'title' => esc_html__( 'Your Section', 'theme_slug' ),
'priority' => 150
)
);
//script input sanitization function
function theme_slug_sanitize_js_code($input){
return base64_encode($input);
}
//output escape function
function theme_slug_escape_js_output($input){
return esc_textarea( base64_decode($input) );
}
//add setting to your section
$wp_customize->add_setting(
'theme_slug_customizer_js_code',
array(
'sanitize_callback' => 'theme_slug_sanitize_js_code', //encode for DB insert
'sanitize_js_callback' => 'theme_slug_escape_js_output' //ecape script for the textarea
)
);
$wp_customize->add_control(
'theme_slug_customizer_js_code',
array(
'label' => esc_html__( 'Your Setting with JS code', 'theme_slug' ),
'section' => 'theme_slug_customizer_your_section',
'type' => 'textarea'
)
);
}
add_action( 'customize_register', 'theme_slug_customizer' );
WordPress 清理函數(shù)列表
以下是WordPress清理函數(shù)列表。也許其中之一更適合您的項(xiàng)目。
- absint()?– 將值轉(zhuǎn)換為正整數(shù),對(duì)數(shù)字、ID 等有用。
- esc_url_raw()?– 用于在數(shù)據(jù)庫(kù)中安全插入 URL
- sanitize_email()?– 去除電子郵件地址中不允許出現(xiàn)的所有字符
- sanitize_file_name()?– 刪除某些操作系統(tǒng)上文件名中非法的特殊字符
- sanitize_hex_color()?– 返回 3 或 6 位十六進(jìn)制顏色,帶 #,或不返回
- sanitize_hex_color_no_hash()?– 與上面相同,但沒有 #
- sanitize_html_class()?– 清理 HTML 類名以確保它只包含有效字符
- sanitize_key()?– 允許使用小寫字母數(shù)字字符、破折號(hào)和下劃線
- sanitize_mime_type()?– 用于在數(shù)據(jù)庫(kù)中保存 mime 類型,例如上傳文件的類型
- sanitize_option()?– 清理update_option()和add_option()等對(duì)各種選項(xiàng)類型所做的值。以下是可用選項(xiàng)列表:https ://codex.wordpress.org/Function_Reference/sanitize_option#Notes
- sanitize_sql_orderby()?– 確保字符串是有效的 SQL order by 子句
- sanitize_text_field()?– 刪除所有 HTML 標(biāo)記以及多余的空格,只留下純文本
- sanitize_title()?– 返回值適合在 URL 中使用
- sanitize_title_for_query()?– 用于從 URL 查詢數(shù)據(jù)庫(kù)中的值
- sanitize_title_with_dashes()?– 與上面相同,但它不替換特殊的重音字符
- sanitize_user()?– 清理用戶名,去除不安全的字符
- wp_filter_post_kses(), wp_kses_post()?– 它只保留在帖子內(nèi)容中允許的 HTML 標(biāo)簽
- wp_kses()?– 僅允許您指定的 HTML 標(biāo)記和屬性
- wp_kses_data()?– 使用允許的 HTML Kses 規(guī)則清理內(nèi)容
- wp_rel_nofollow()?– 將 rel nofollow 字符串添加到內(nèi)容中的所有 HTML A 元素
還有一些 PHP 函數(shù)來(lái)填補(bǔ)一些空白。
- filter_var($variable, $filter)?– 使用特定過濾器過濾變量
- strlen()?– 獲取字符串長(zhǎng)度,用于郵政編碼、電話號(hào)碼
注:本文出自 divpusher.com ,由 WordPress大學(xué) 翻譯整理。




