add_theme_support() 用于在我們的當前使用的主題添加一些特殊的功能，函數(shù)一般寫在主題的functions.php文件中，當然也可以再插件中使用鉤子來調(diào)用該函數(shù)，如果是掛在鉤子上，那他必須掛在after_setup_theme鉤子上，因為 init hook 對于一些功能來說，已經(jīng)太遲了.

（在后臺外觀->主題_>點擊自定義）

先看效果截圖：

用法

<?php add_theme_support($feature);?>

參數(shù)說明

$feature

(string) (必須) 需要添加特殊功能名稱，可以是以下參數(shù):

◆‘post-thumbnails’—– 增加縮略圖支持

◆‘a(chǎn)utomatic-feed-links’—–自動輸出RSS

◆‘post-formats’—– 增加文章格式功能

◆‘custom-background’—– 增加自定義背景

◆‘custom-header’—– 增加自定義頂部圖像

◆‘menus’——自定義導航菜單

默認: None

$args：

數(shù)組，功能相關(guān)的額外參數(shù)。

也就是說你可以如下使用：（該函數(shù)必須在主題的 functions.php 文件中調(diào)用）

 add_theme_support('post-thumbnails');add_theme_support('automatic-feed-links');add_theme_support('post-formats', array( 'aside', 'gallery', 'link', 'image', 'quote', 'status', 'video', 'audio', 'chat'));add_theme_support('custom-background',array('default-color'=>'0B3B41','default-image'=> get_template_directory_uri().'/images/bg.jpg',));
add_theme_support('custom-header');

Post Thumbnails(啟用文章特色圖片縮略圖功能)

從WordPress2.9版本開始，可以給模板添加文章特色圖片縮略圖功能。操作方法很簡單，只需要把下面的代碼添加到functions.php里面。

示例：

// 特色圖像
add_theme_support( 'post-thumbnails' ); // 所有輸出內(nèi)容支持特色圖像
add_theme_support( 'post-thumbnails', array( 'page' ) ); // 僅 page 類型支持特色圖像
add_theme_support( 'post-thumbnails', array( 'post' ) ); // 僅 post 類型支持特色圖像
add_theme_support( 'post-thumbnails', array( 'post', 'movie' ) ); // 僅 post 和 movie 類型支持特色圖像

注意：示例代碼中 movie 為通過 register_post_type() 函數(shù)注冊的文章類型。

register_post_type( string $post_type, array|string $args = array() )

通過 WordPress 輸出內(nèi)容時，如果選擇了特色圖像，系統(tǒng)會在 wp_postmeta 表下創(chuàng)建一個對應(yīng) post_id 的 _thumbnail_id 字段用于存儲當前 Post 內(nèi)容的特色圖像。

判斷是否有文章縮略圖

has_post_thumbnail( int|WP_Post $post = null )

獲取文章縮略圖

if ( has_post_thumbnail()){the_post_thumbnail();
}

設(shè)置縮略圖大小

set_post_thumbnail_size(120,120, true );

1. //前面兩個參數(shù)分別為-寬、高

2. //后面參數(shù)為是否裁剪圖片到這么大 true為裁剪

注意，設(shè)置了縮略圖大小之后，并不是說你輸出特色圖像的時候就直接輸出這個大小，這個代碼的功能只是在你設(shè)置縮略圖的時候?qū)⒛莻€圖片生成了一個你設(shè)定大小的圖片。輸出特色圖像的時候還是要加上大小，不然就會輸出原圖。

Custom-logo （自定義主題LOGO）

加主題自定義網(wǎng)站Logo圖標支持，會在“主題后臺/外觀/自定義/站點身份”中添加一個自定義標志的選項。

示例：

// 標志
add_theme_support( 'custom-logo', array('height' => 100,
'width' => 400,
'flex-height' => true,
'flex-width' => true,
'header-text' => array( 'site-title', 'site-description' ),
) );

Custom Background（自定義主題背景）

3.4 版本引進讓主題支持定義背景。添加自定義網(wǎng)站背景圖像支持，會在“主題后臺/外觀/自定義/背景圖像”中添加圖像上傳功能。

1. add_theme_support('custom-background');

設(shè)置默認背景的參數(shù)：

// 背景圖像$defaults = array(
'default-image' => '',
'default-preset' => 'default', // 'default', 'fill', 'fit', 'repeat', 'custom'
'default-position-x' => 'left', // 'left', 'center', 'right'
'default-position-y' => 'top', // 'top', 'center', 'bottom'
'default-size' => 'auto', // 'auto', 'contain', 'cover'
'default-repeat' => 'repeat', // 'repeat-x', 'repeat-y', 'repeat', 'no-repeat'
'default-attachment' => 'scroll', // 'scroll', 'fixed'
'default-color' => '',
'wp-head-callback' => '_custom_background_cb',
'admin-head-callback' => '',
'admin-preview-callback' => '',
);
add_theme_support( 'custom-background', $defaults );

注意：無論你填加了custom-header 或者 custom-background 支持，系統(tǒng)都會默認顯示出顏色小節(jié)選項，用于配置頁眉文字及背景顏色。

無論是 custom-logo 、 custom-header 還是 custom-background 都會將其配置數(shù)據(jù)存儲在 wp_options 表下的 theme_mod_主題名 字段下。

Custom Header（支持自定義頭部圖像）

3.4 版本引進的讓主圖支持自定義頭圖。添加自定義網(wǎng)站頭部圖像支持，會在“主題后臺/外觀/自定義/頁眉圖像”中添加圖像上傳功能。

請注意您可以添加的默認參數(shù)列表:

$defaults = array('default-image'=>'',     //默認圖像'random-default'=> false,  //是否默認隨機'width'=>0,      //寬度'height'=>0,      //高度'flex-height'=> false,'flex-width'=> false,'default-text-color'=>'',     //默認文本顏色'header-text'=> true,   //頂部文本開關(guān)'uploads'=> true,   //是否允許上傳'wp-head-callback'=>'','admin-head-callback'=>'','admin-preview-callback'=>'','video' => false,'video-active-callback' => 'is_front_page',);add_theme_support('custom-header', $defaults );

Automatic Feed Links（頭部自動生成 RSS 地址）

這個功能讓 WordPress 自動在主題 head 添加 日志和留言的 RSS feed links。這個功能是在 3.0 版本引進的。自動生成頁面 feed 鏈接，需要在主題 header.php 文件中調(diào)用 <?php wp_head();?> 。

示例:

// 自動添加 feed 鏈接
add_theme_support( 'automatic-feed-links' );

customize-selective-refresh-widgets(修改實時預覽效果）

添加此功能支持后可以配置一些小工具或自定義設(shè)置中，修改設(shè)置后頁面自動刷新實時預覽效果

示例

// 小工具選中自動刷新
add_theme_support( 'customize-selective-refresh-widgets' );

html5

對主題中的搜索表單，評論表單，評論列表，畫廊和標題等內(nèi)容添加 HTML5 標簽支持。

/ HTML5 支持add_theme_support(
'html5',
array(
'comment-form',
'comment-list',
'gallery',
'caption',
'style',
'script',
'navigation-widgets',
)
);

添加完成后，輸出的內(nèi)容就都是符合 html5 標準的標簽了。

title-tag

自動生成頁面標題，老版本需要使用 wp-title() 獲取對應(yīng)標題，新版本只需要在主題 header.php 文件中調(diào)用 <?php wp_head();?> 即可自動生成title 標簽。

示例

// 標題標簽
add_theme_support( 'title-tag' );

responsive-embeds

WordPress 支持 Embed 功能，就是它可以將一些文章、視頻、音頻等鏈接以卡片式顯示的方式自動嵌入到你的文章中去，但是這種嵌入的方式可能會導致嵌入的內(nèi)容超出容器寬度，啟用 responsive-embeds 支持可以讓 WordPress 自動自適應(yīng)包裹容器大小，已盡可能好地顯示嵌入內(nèi)容。

// 自適應(yīng)嵌入內(nèi)容
add_theme_support( 'responsive-embeds' );

align-wide

添加該功能，WordPress 會自動識別全幅或?qū)挿鶊D片，并自動將其居中對齊以實現(xiàn)更好的顯示效果。注意：只有設(shè)置了 full 或 wide 的圖片才有效。

// 全幅或?qū)挿鶊D片居中對齊
add_theme_support( 'align-wide' );

wp-block-styles

添加主題塊樣式支持

// 塊樣式支持
add_theme_support( 'wp-block-styles' );

editor-styles

允許自定義主題編輯器樣式，需配合 add_editor_style() 使用，以引入相應(yīng)樣式文件。自定義編輯器樣式可很好地實現(xiàn)所見即所得。

示例

// 修改編輯器樣式
add_theme_support( 'editor-styles' );// 添加編輯器樣式文件
add_editor_style( array|string $stylesheet = 'editor-style.css' )

dark-editor-style

啟用編輯器深色模式。默認編輯器字體顏色為黑色，如果自定義編輯器樣式的顏色偏暗會影響用戶編輯，合適的時候啟用深色模式可很好解決這一問題。

// 啟用深色模式
add_theme_support( 'dark-editor-style' );

修改 edit-styles 后如下：

disable-custom-font-sizes

編輯器字體大小可以由用戶自定義，使用 disable-custom-font-sizes 可以禁止用戶字體大小。

示例

// 禁用編輯器自定義字號
add_theme_support( 'disable-custom-font-sizes' );

editor-font-sizes

添加自定義字體大小選擇的支持，傳入字體數(shù)據(jù)可控制下拉選擇中的字號項目。

示例

// 自定義字體大小選擇add_theme_support('editor-font-sizes', array(
array(
'name' => __('Small', 'twentynineteen') ,
'shortName' => __('S', 'twentynineteen') ,
'size' => 14,
'slug' => 'small',) ,array(
'name' => __('Normal', 'twentynineteen') ,
'shortName' => __('M', 'twentynineteen') ,
'size' => 20,
'slug' => 'normal',) ,array(
'name' => __('Large', 'twentynineteen') ,
'shortName' => __('L', 'twentynineteen') ,
'size' => 38,
'slug' => 'large',) ,));

disable-custom-colors

編輯器字體顏色及背景顏色默認可以由用戶自定義，使用 disable-custom-colors 可以禁止用戶自定義顏色。

示例

// 禁用編輯器自定義顏色
add_theme_support( 'disable-custom-colors' );

editor-color-palette

添加自定義編輯器調(diào)色板的支持，傳入顏色數(shù)據(jù)可控制調(diào)色板上默認顯示的顏色。

示例

// 自定義顏色面板add_theme_support('editor-color-palette', array(
array('name' => __('Dark Gray', 'qgg') ,
'slug' => 'dark-gray',
'color' => '#111',),array('name' => __('Light Gray', 'qgg') ,
'slug' => 'light-gray',
'color' => '#767676',),array('name' => __('White', 'qgg') ,
'slug' => 'white',
'color' => '#FFF',),array('name' => __('Pink', 'qgg') ,
'slug' => 'pink',
'color' => '#f78da7',),array('name' => __('Green', 'qgg') ,
'slug' => 'green',
'color' => '#00d084',),array('name' => __('Cyan', 'qgg') ,
'slug' => 'cyan',
'color' => '#8ed1fc',),array('name' => __('Yellow', 'qgg') ,
'slug' => 'yellow',
'color' => '#fcb900',),array('name' => __('Red', 'qgg') ,
'slug' => 'red',
'color' => '#cf2e2e',),));