為主題添加原生的設(shè)置選項(xiàng)。不用框架,
也許大部分主題是使用相關(guān)的設(shè)置框架。如果我們的主題只有幾個(gè)選項(xiàng)呢？可以在主題的自定義里面配置。這一節(jié)就教大家如何制作主題的設(shè)置選項(xiàng)。
本站下載該頁歷史版本
customizer-custom-controls-master
提取碼：無
解壓碼：無
我開發(fā)的博客主題Mirages就是使用這個(gè)方法來進(jìn)行主題的設(shè)置。可以下載下來看看（新年前發(fā)布?）。
設(shè)置 API是在 2.7 版本中加入的新功能。它令包含設(shè)置表單的管理頁面實(shí)現(xiàn)“半自動(dòng)工作”，允許您定義整個(gè)管理頁面、選項(xiàng)區(qū)域，甚至具體的欄目。
- 參考主題：詳情
本站下載：
[zrz_file link="https://n.getimg.net/www/2019/01/10eca19b133531.zip" name="colormag.1.3.4" code=""]- 相關(guān)文檔：官方文檔
在主題的functions.php文件中底部添加如下代碼：
//面板、設(shè)置節(jié)、設(shè)置，控件
//添加一個(gè)設(shè)置面板
$wp_customize->add_panel( 'npcink_options', //ID=npcink_options
array(
'capabitity' => 'edit_theme_options', //根據(jù)用戶的權(quán)限級別顯示或隱藏該部分。默認(rèn)為edit_theme_options
'description' => __( 'Npcink出品', 'npcink' ), //可選。顯示在面板頂部的描述隱藏在幫助圖標(biāo)后面。
'priority' => 30, //優(yōu)先級，可選。這將控制此部分在Theme Customizer側(cè)欄中的顯示順序。
'title' => __( 'Lifet主題設(shè)置', 'npcink' ), //面板的可見名稱。
) );
//添加第一個(gè)設(shè)置節(jié)(文本節(jié))
$wp_customize->add_section('sections_text_demo', //id = sections_1
array(
'title' => '第一個(gè)設(shè)置節(jié)', //設(shè)置的可見名稱。
'description' => '第一個(gè)設(shè)置節(jié)詳細(xì)補(bǔ)充', //設(shè)置的詳細(xì)信息
'panel' => 'npcink_options', //加入第一個(gè)設(shè)置面板'npcink_options' => 50//優(yōu)先級
) );
/////////////////////////////////////////////////////////////////////////////////////////////////
//添加第一個(gè)設(shè)置節(jié)的第一個(gè)設(shè)置
$wp_customize->add_setting('aaa',
array(
'default' => 'Npcink出品', //默認(rèn)值
)
);
//添加第一個(gè)設(shè)置節(jié)的第一個(gè)設(shè)置控件
$wp_customize->add_control('aaa',
array(
'label' => '第一個(gè)設(shè)置節(jié)的第一個(gè)設(shè)置標(biāo)題',
'section' => 'sections_text_demo', //填入設(shè)置節(jié)的ID
'type' => 'text',
)
);
///////////////////////////////////////////////////////////////////////////////////////////////////
//添加第一個(gè)設(shè)置節(jié)的第二個(gè)設(shè)置
$wp_customize->add_setting( 'bbb', //（必填）用作ID的唯一類似slug的字符串。默認(rèn)值：無
array(
'default' => '', //可選。如果數(shù)據(jù)庫中沒有值，則關(guān)聯(lián)控件中的默認(rèn)值。默認(rèn)值：空白
'transport' => 'refresh', //可選。定義實(shí)時(shí)預(yù)覽的更新方式。默認(rèn)值：刷新。
'type' => 'theme_mod', // 可選 'theme_mod' or 'option'. 默認(rèn): 'theme_mod'
// 'sanitize_callback' => 'skyrocket_text_sanitization' //可選的。在將輸入數(shù)據(jù)保存到數(shù)據(jù)庫之前將用于清除輸入數(shù)據(jù)的函數(shù)的名稱
)
);
//添加第一個(gè)設(shè)置節(jié)的第二個(gè)設(shè)置的控件
$wp_customize->add_control( 'bbb',//必填：自定義控件對象或**與此控件關(guān)聯(lián)的設(shè)置的ID**。默認(rèn)值：無
array(
'label' => __( '第一個(gè)設(shè)置節(jié)的第二個(gè)設(shè)置標(biāo)題' ), //可選：將顯示設(shè)置的標(biāo)題，默認(rèn)：空白
'description' => esc_html__( '可以輸入的格式見代碼注釋' ),//可選：描述
'section' => 'sections_text_demo', // 必填：填入設(shè)置節(jié)的ID
'priority' => 10, // 必填：確定控件在該部分中的顯示順序。默認(rèn)值：10
'type' => 'text', // 必填：要顯示的控件類型。類型可以是文本，電子郵件，URL，數(shù)字，隱藏或日期。默認(rèn)值："文本"
'capability' => 'edit_theme_options', // 可選：根據(jù)用戶的權(quán)限級別顯示或隱藏控件。通常從設(shè)置的功能派生。默認(rèn)值為"edit_theme_options"
'input_attrs' => array( // 可選：控件輸出的定制輸入屬性列表。僅用于文本區(qū)域和輸入字段。默認(rèn)值：空白
'class' => 'my-custom-class',
'style' => 'border: 1px solid rebeccapurple',
'placeholder' => __( 'Enter name...' ),
),
)
);
///////////////////////////////////////////////////////////////////////////////////////////////////
//添加第二個(gè)設(shè)置節(jié)(文本節(jié))
$wp_customize->add_section('sections_demo',
array(
'title' => '第二個(gè)設(shè)置節(jié)',
'description' => '第二個(gè)設(shè)置節(jié)詳細(xì)補(bǔ)充',
'panel' => 'npcink_options',
) );
/////////////////////////////////////////////////////////////////////////////////////////////////
//添加第二個(gè)設(shè)置節(jié)的第一個(gè)設(shè)置
$wp_customize->add_setting('ccc',
array(
'default' => 'Npcink',
)
);
//添加第二個(gè)設(shè)置節(jié)的第一個(gè)設(shè)置控件
$wp_customize->add_control('ccc',
array(
'label' => '第二個(gè)設(shè)置節(jié)的第二個(gè)設(shè)置標(biāo)題',
'section' => 'sections_demo',
'type' => 'text',
)
);有啥規(guī)律？
面板 → 節(jié) → 設(shè)置、控件
怎么設(shè)置？
請您在主題的自定義中進(jìn)行設(shè)置。
怎么使用呢？
在你需要的地方添加如下代碼：
<?php echo get_theme_mod( 'aaa', 'Npcink榮譽(yù)出品' ); ?>
<br>
<?php echo get_theme_mod( 'bbb', 'Npcink榮譽(yù)出品' ); ?>
<br>
<?php echo get_theme_mod( 'ccc', 'Npcink榮譽(yù)出品' ); ?>
支持哪些控件？
- 輸入控件
- 復(fù)選框控件
- 選擇控件
- 單選按鈕控件
- 下拉頁面控件
- Textarea控件
- 顏色控件
- 媒體控件
- 圖像控件
- 裁剪圖像控件
- 日期時(shí)間控件
添加更多類型請看這里：
- 參考鏈接：詳情
