本文主要是整合WordPress块主题与经典主题功能配置及编辑器配置推荐的实现。打包了一些笔者认为最佳的配置代码。并且详细整合了一些关于WordPress块主题与经典主题功能配置及编辑器配置有关的各个功能的实现和取舍建议。
注意：本文所有内容均已 WordPress 6.8.3 版本为背景整理。
【块主题推荐】配置整合
你可以复制下面这段代码使用，这段代码整合WordPress主题常见的、主要的配置（本站推荐）。
if ( ! function_exists( 'zzw_theme_setup' ) ) {
function zzw_theme_setup(){
//禁用区块样板中默认提供的样板模式（洁癖专属）
remove_theme_support( 'core-block-patterns' );
//添加对块编辑器中全幅和宽幅对齐的支持
add_theme_support( 'align-wide' );
//启动编辑器深色背景
add_theme_support( 'dark-editor-style' );
//在块编辑器中加载自定义的CSS样式表
add_editor_style( 'assets/css/editor-style.css' );
}
}
add_action('after_setup_theme','zzw_theme_setup');【经典主题推荐】配置整合
推荐配置：（需要将其中部分修改为自己的真实需求数据）
if ( ! function_exists( 'zzw_theme_setup' ) ) {
function zzw_theme_setup(){
//对主题中默认 Gutenberg 块样式的支持
add_theme_support( 'wp-block-styles' );
//添加对全幅和宽幅对齐图片的支持
add_theme_support( 'align-wide' );
//禁用区块样板中默认提供的样板模式（洁癖专属）
remove_theme_support( 'core-block-patterns' );
//添加缩略图，并设置缩略图尺寸
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 360, 360 );
//HTML5支持
add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption', 'style', 'script' ) );
//导航配置
register_nav_menus(
array(
'mainnav' => esc_html__( '网站主导航'),
'footernav' =>esc_html__( '底部导航'),
'diynav' => esc_html__( '自定义' ),
)
);
//自定义网站Logo图标
add_theme_support( 'custom-logo', array(
'height' => 60,
'width' => 400,
'flex-height' => true,
'flex-width' => true,
'header-text' => array( 'site-title', 'site-description' ),
'unlink-homepage-logo' => true,
)
);
//或者：
//add_theme_support( 'custom-logo' );
//页眉启动项
$header_defaults = array(
'default-image' => '',
'random-default' => false,
'width' => 300,
'height' => 60,
'flex-height' => true,
'flex-width' => true,
'default-text-color' => '',
'header-text' => true,
'uploads' => true,
'wp-head-callback' => '',
'admin-head-callback' => '',
'admin-preview-callback' => '',
'video' => false,
'video-active-callback' => 'is_front_page',
);
add_theme_support( 'custom-header', $header_defaults );
//或者：
//add_theme_support( 'custom-header' );
//自定义网站背景
$bg_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' => 'ffffff',
'wp-head-callback' => '_custom_background_cb',
'admin-head-callback' => '',
'admin-preview-callback' => '',
);
add_theme_support( 'custom-background', $bg_defaults );
//或者：
//add_theme_support( 'custom-background' );
//选择性刷新
add_theme_support( 'customize-selective-refresh-widgets' );
//自定义行高
add_theme_support( 'custom-line-height' );
//外观工具
add_theme_support( 'appearance-tools' );
//边框
add_theme_support( 'border' );
//链接颜色
add_theme_support( 'link-color' );
//基于块的模板部分
add_theme_support( 'block-template-parts' );
//从旧版 RSS 小部件中删除源图标链接
add_filter( 'rss_widget_feed_link', '__return_false' );
//编辑器：配置块编辑器样式
add_theme_support( 'editor-styles' );
//编辑器：启动编辑器深色背景
add_theme_support( 'dark-editor-style' );
//编辑器：在块编辑器中加载自定义的CSS样式表
//add_editor_style( 'assets/css/editor-style.css' );
}
}
add_action('after_setup_theme','zzw_theme_setup');区块主题默认支持配置
源：wp-includes/theme.php
具体位置在：function _add_default_theme_supports() {…}函数中
在触发 ‘after_setup_theme’ 动作时，WordPress系统为区块主题添加默认主题支持包括以下内容：
//添加缩略图 add_theme_support( 'post-thumbnails' ); //自适应嵌入内容 add_theme_support( 'responsive-embeds' ); //配置块编辑器样式 add_theme_support( 'editor-styles' ); //HTML5支持 add_theme_support( 'html5', array( 'comment-form', 'comment-list', 'search-form', 'gallery', 'caption', 'style', 'script' ) ); //Feed Links add_theme_support( 'automatic-feed-links' ); //分离核心区块资源 add_filter( 'should_load_separate_core_block_assets', '__return_true' ); //按需加载区块资源 add_filter( 'should_load_block_assets_on_demand', '__return_true' ); /* 当区块主题激活时，移除自定义工具的菜单面板。 */ add_filter( 'customize_panel_active', static function ( $active, WP_Customize_Panel $panel ) { if ( 'nav_menus' === $panel->id && ! current_theme_supports( 'menus' ) && ! current_theme_supports( 'widgets' ) ) { $active = false; } return $active; }, 10, 2 );
使主题可用于翻译
/*
Make theme available for translation.
Translations can be filed in the /languages/ directory.
If you're building a theme based on Twenty Twenty-One, use a find and replace
to change 'twentytwentyone' to the name of your theme in all the template files.
使主题可用于翻译。
翻译可以在 /languages/ 目录中提交。
如果要基于 Twenty Twenty-One 构建主题，请使用查找和替换将“twentytwentyone”更改为所有模板文件中主题的名称。
如果你的主题仅仅计划自己使用，这里是无关紧要的，可以不考虑使用
*/
load_theme_textdomain( 'twentytwentyone', get_template_directory() . '/languages' );Feed Links（5.9版本开始，块主题中默认启用）
/*
从版本 5.9 开始，块主题中默认启用，所以这里不再启动
该功能支持在文章和评论的头部添加Automatic Feed Links，该功能在3.0版本中引入，用它来替代已经不推荐使用的automatic_feed_links()方法。
Add default posts and comments RSS feed links to head.
"Automatic Feed Links" 是什么？干什么用？
在WordPress中，"Automatic Feed Links" 是一个功能选项，它允许网站自动生成并提供RSS或Atom格式的订阅源链接。这些订阅源可以让用户通过RSS阅读器来订阅你的博客内容，从而在有新文章发布时自动接收更新。
当你启用这个功能时（默认情况下是开启的），WordPress会在你的网站的 `<head>` 部分添加一些特殊的链接标签，指向你的站点提供的各种类型的订阅源。例如，它会为整个站点、分类目录以及作者生成相应的RSS和/或Atom订阅链接。
对于访问者来说，如果他们使用支持RSS或Atom的浏览器或其他订阅工具，就可以轻松地发现并订阅你的内容。这有助于提高用户的参与度，并且可以让你的内容更容易被分享和传播。
如果你不希望让访客轻易找到并订阅你的RSS或Atom feed，你可以选择关闭这个功能。关闭的方式是在WordPress后台进入“设置”->“阅读”，然后取消勾选“通过多种协议公开文章Feed”。
请注意，即使你禁用了自动feed链接，仍然可以通过直接访问特定的URL来获取feed，除非你采取额外的措施来阻止这种行为。例如，你可以使用插件来进一步控制feed的可用性或对其进行定制。
*/
add_theme_support( 'automatic-feed-links' );主题预设演示内容
/*
add_theme_support( 'starter-content' ) 是WordPress中一个用于支持主题启动内容（Starter Content）的功能。这个功能允许主题开发者定义一组默认的演示内容，包括文章、页面、菜单、小工具设置等，以便用户在安装新主题时能够快速看到主题的样式和布局效果。这对于展示主题如何使用以及提供给用户一个良好的起点非常有用。
启用这个功能通常需要在主题的 functions.php 文件中添加如下代码：
示例：
add_theme_support( 'starter-content', array(
// 这里可以定义你的启动内容
'posts' => array(
'home' => array(
'title' => __( 'Home', 'mytheme' ),
'content' => '<!-- wp:paragraph -->' . __('Welcome to our site!', 'mytheme') . '<!-- /wp:paragraph -->',
),
'about' => array(
'title' => __( 'About', 'mytheme' ),
'content' => '<!-- wp:paragraph -->' . __('Learn more about us.', 'mytheme') . '<!-- /wp:paragraph -->',
),
),
'attachments' => array(
'logo' => '%s/logo.png',
),
'nav_menus' => array(
'primary' => array(
'name' => __( 'Primary Menu', 'mytheme' ),
'items' => array(
'page_home',
'page_about',
),
),
),
'widgets' => array(
'sidebar-1' => array(
'text_about' => array(
'text' => 'About Us Widget',
),
),
),
'options' => array(
'show_on_front' => 'page',
'page_on_front' => '{{home}}',
'page_for_posts' => '{{blog}}',
),
) );
示例说明：
在这个例子中，函数通过 add_theme_support( 'starter-content' ) 来注册启动内容，并且指定了几个关键部分的内容，如文章、附件、导航菜单、小工具和选项。这些内容将帮助用户快速了解主题是如何工作的，并且为他们提供了一个基础的网站结构来开始他们的工作。
请注意，这里的示例是简化的，实际应用中可能需要根据具体需求进行调整。此外，%s 是用来指向主题目录的占位符，而 {{home}} 和 {{blog}} 是特殊占位符，分别代表了首页和博客页面的ID，在实际使用时会被替换为相应的页面ID。
启用此功能后，当用户安装并激活支持该功能的主题时，可以选择导入这组预设的内容，从而立即看到主题的实际效果。这对于提升用户体验和快速搭建网站非常有帮助。
*/禁用区块样板中默认提供的样板模式（洁癖专属）
它的作用非常明确：禁用（或称为取消注册）由WordPress核心自带的那些预定义区块样板-8。
工作原理：WordPress默认提供一系列官方的区块样板（例如分栏布局、号召性用语等）。这个函数通过移除对 'core-block-patterns' 的特性支持，来关闭这些核心样板的加载和显示-8。
使用场景：这个功能通常是为了简化后台界面，或者在开发自定义主题时，希望用户只使用主题提供的特定样板，避免核心样板造成干扰。
使用方法：你需要将这段代码添加到当前主题的 functions.php 文件中。
/*
禁用区块样板中默认提供的样板模式。
系统默认区块样板是启动状态的。
WordPress内置了许多块模式，主题可以选择退出捆绑模式。
它的作用非常明确：禁用（或称为取消注册）由WordPress核心自带的那些预定义区块样板。
如果你仅仅希望区块样板中展示你的自定义的样板模式，你应该选择启用 remove_theme_support( 'core-block-patterns' );。
在WordPress中，remove_theme_support( 'core-block-patterns' ) 是一个函数调用，用于移除对核心块模式（Core Block Patterns）的支持。块模式是预定义的块组合，它们可以被用户轻松地添加到页面或文章中，以快速创建特定的设计布局。这些模式有助于加快内容创作过程，并提供一致的设计元素。
如果你的主题之前通过 add_theme_support( 'core-block-patterns' ) 启用了对核心块模式的支持，但后来你决定不再需要这些默认提供的块模式，你可以使用 remove_theme_support( 'core-block-patterns' ) 来取消支持。这通常会在主题的 functions.php 文件中进行设置。
*/
remove_theme_support( 'core-block-patterns' );请注意：务必通过 after_setup_theme 钩子在适当的时机执行，以确保在WordPress处理主题支持之前，你的移除操作已经生效。
块编辑器中全幅和宽幅的支持（强烈推荐启动）
add_theme_support( 'align-wide' ) 是一个有用的功能，但它并非默认启用，需要你手动在主题中添加。
虽然 add_theme_support( 'align-wide' ) 不是块主题开发中的强制性要求，但如果你想充分利用WordPress的现代布局能力，它是一个非常推荐加入的功能。
/**
Add support for full and wide align images.
添加对块编辑器中全幅和宽幅的支持
（启用对块编辑器中 align full 和 align wide 选项的主题支持）
启用对块编辑器中 align full 和 align wide 选项的主题支持，使用add_theme_support( 'align-wide' );
add_theme_support( 'align-wide' ) 是WordPress中用于启用宽对齐和全宽对齐支持的一个函数调用。这个功能允许你在块编辑器（Gutenberg编辑器）中使用宽对齐和全宽对齐的布局选项，从而让你的内容在视觉上更加丰富和灵活。这对于创建具有现代设计感的页面非常有用。
这段代码告诉WordPress你的主题支持宽对齐和全宽对齐的功能。一旦启用了这项支持，用户就可以在块编辑器中选择“宽宽”或“全宽”的对齐方式来布局内容。
*/
add_theme_support( 'align-wide' );文章形式分类（不建议启动）
默认状态：WordPress系统默认状态下是没有启动 post-formats（文章形式类型）的。
不启动可以让普通人更容易使用，后台更简洁一些，更不容易出现和预设的模板搞得错乱。
/*
post formats
文章形式分类
就是文章形式分类：图库、图片、标准、引语、日志、状态、聊天、视频、音频、链接 ....
在WordPress中，add_theme_support( 'post-formats' ) 是一个函数调用，用于启用对特定文章格式（Post Formats）的支持。文章格式允许你为不同类型的文章内容指定特殊的样式或布局，例如视频、音频、图片、引用等。这可以让你以更加多样化的形式展示你的内容，并且根据内容类型提供更丰富的用户体验。
standard：标准文章格式。这是默认的文章格式，如果你没有选择其他格式，文章将使用这个格式。
aside：旁白或短消息。通常用于简短的状态更新或注释。
chat：聊天记录或对话。适用于展示文本对话的形式。
gallery：图片画廊。适合展示一系列图片。
link：链接。主要用于突出显示一个外部链接。
image：以一张图片为主导的文章。
quote：引用。用于展示引用文字，可以包括来源。
status：状态更新。类似于社交媒体上的状态更新，通常非常简短。
video：视频。适合以视频为主导的文章。
audio：音频。适合以音频文件为主导的文章。
一旦启用了这些文章格式，在撰写新文章时，你会看到一个新的“格式”选项，允许你选择相应的文章格式。然后，你可以根据所选的格式自定义文章的显示方式，通常是通过CSS来实现不同的样式效果。
如果你的主题不支持某些特定的文章格式，你可以从数组中移除它们，或者完全不使用 add_theme_support( 'post-formats' ) 来禁用这项功能。同样，如果你需要取消之前添加的文章格式支持，可以使用 remove_theme_support( 'post-formats' ) 函数。
记得在启用文章格式后，你还需要确保你的主题模板文件能够正确处理这些不同格式的文章，以便它们能够按照预期的方式显示。这通常涉及到在模板文件中加入条件判断语句来应用不同的样式和布局。
注意：如果有必要就使用；如果没必要，不建议启动
（不启动可以让普通人更容易使用，后台更简洁一些，更不容易出现和预设的模板搞得错乱）；
*/
add_theme_support( 'post-formats', array(
'standard',
'aside',
'chat',
'gallery',
'link',
'image',
'quote',
'status',
'video',
'audio'
) );自动生成页面标题信息（争议，建议舍弃）
注意：这个 wp_title() 标签未来可能被取消，不推荐使用，所以这里建议舍弃。
/*
自动生成页面标题信息，需调用。
注意：这个 wp_title() 标签未来可能被取消，不推荐使用，所以这里取消使用
Let WordPress manage the document title.
This theme does not use a hard-coded <title> tag in the document head,WordPress will provide it for us.
----------------------------------------------------------------------------------
后端：（使用：就是添加在这个函数中）
add_theme_support( 'title-tag' );
----------------------------------------------------------------------------------
前端向后兼容：（PHP起始标签被去除了）
if ( ! function_exists( '_wp_render_title_tag' ) ) :
function theme_slug_render_title() {
<title> wp_title( '|', true, 'right' );</title>
}
add_action( 'wp_head', 'theme_slug_render_title' );
endif;
-----------------------------------------------------------------------------------
*/
add_theme_support( 'title-tag' );分离核心区块资源（从版本 5.9 开始，块主题中默认启用）
/*
分离核心区块资源
从版本 5.9 开始，块主题中默认启用
作用：将 WordPress 核心区块的 CSS 和 JavaScript 文件分开加载，而不是打包成一个大的资源文件。
效果：
每个核心区块（如段落、标题、图片等）都有自己的独立资源文件
只有页面实际使用的区块才会加载对应的资源
减少不必要的资源加载，提升页面性能
*/
add_filter( 'should_load_separate_core_block_assets', '__return_true' );按需加载区块资源（从版本 5.9 开始，块主题中默认启用）
/*
按需加载区块资源
从版本 5.9 开始，块主题中默认启用
作用：启用区块资源的按需加载机制。
效果：
只有在页面中确实使用了某个区块时，才会加载该区块的资源
对于未使用的区块，其 CSS 和 JS 文件不会被加载
进一步优化资源加载，减少 HTTP 请求
*/
add_filter( 'should_load_block_assets_on_demand', '__return_true' );添加缩略图（5.9版本开始，块主题中默认启用）
/*
从版本 5.9 开始，块主题中默认启用
post thumbnail
添加缩略图，并设置缩略图尺寸
你也可以指定posttype：
add_theme_support( 'post-thumbnails' );
add_theme_support( 'post-thumbnails', array( 'post' ) ); // Posts only
add_theme_support( 'post-thumbnails', array( 'page' ) ); // Pages only
add_theme_support( 'post-thumbnails', array( 'post', 'movie' ) ); // Posts and Movies
也可以在这里启动并设置缩略图剪切尺寸
缩略图剪切尺寸也可以在WordPress后台直接设置
*/
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 360, 360 );HTML5支持（5.9版本开始，块主题中默认启用）
/*
从版本 5.9 开始，块主题中默认启用
HTML5 support
HTML5支持。
解释：
在WordPress中，add_theme_support( 'html5' ) 是一个函数调用，用于告知WordPress你的主题支持HTML5的某些特性。这个函数通常被放置在主题的 functions.php 文件中。当这个函数被调用时，它会激活一些HTML5的功能，并且让WordPress在生成某些内容时使用更现代的HTML5标签，而不是过时的XHTML标签。
具体来说，当你在主题中添加了 add_theme_support( 'html5' )，WordPress将会自动将以下元素转换为HTML5标记：
.搜索表单 (search-form)
.评论表单 (comment-form)
.评论列表 (comment-list)
.画廊 (gallery)
.捕获工具 (caption)
例如，如果你启用了对评论表单的支持，那么WordPress将会使用<article>、<footer>等HTML5语义化标签来替代原来的<div>和<p>标签。
// 正确：传递数组
add_theme_support('html5', array('search-form', 'comment-form', 'comment-list', 'gallery', 'caption'));
// 错误：传递字符串
add_theme_support('html5', 'search-form'); // 会返回 false
// 不传参数：使用默认值
add_theme_support('html5'); // 等同于 array('comment-list', 'comment-form', 'search-form')
*/
add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption', 'style', 'script' ) );还可以自定义区块样板吗？
完全可以。 这一点非常重要。
remove_theme_support( 'core-block-patterns' ) 仅仅移除了WordPress官方提供的核心样板。它不会影响以下任何形式的自定义区块样板：
- 你的主题注册的区块样板：如果你在开发主题，你通过
register_block_pattern函数或PHP文件注册的样板会正常显示。 - 插件添加的区块样板：任何插件注册的样板都不会被影响。
- 用户自己创建的样板：你从WordPress官方样板目录（Pattern Directory）复制并粘贴的样板，或者在站点的“可重用块”中创建并转换为“不同步模式”的样板（在较新版本中），都将继续正常工作。
简单来说，这个函数只针对“官方的”核心样板，对你“自己的”样板毫无影响。
添加对自定义单位的支持（这在WordPress 5.6中删除了）
/*
添加对自定义单位的支持。
这在WordPress 5.6中删除了。但如果你使用的是WordPress 5.5或更早的版本，则仍需要正确支持。
*/
add_theme_support( 'custom-units' );导航配置（经典主题强烈推荐）
/*
导航配置
register_nav_menus() 是 WordPress 中的一个函数，用于注册一个或多个导航菜单。这个函数允许主题开发者定义可以在 WordPress 后台中创建和管理的自定义导航菜单位置。这些菜单可以被放置在主题中的不同位置，比如头部、侧边栏或页脚等。
块主题开发中，则为可选！（块主题中可以不在这里配置导航）
示例：
register_nav_menus( array(
'primary' => __( 'Primary Menu', 'mytheme' ),
'footer' => __( 'Footer Menu', 'mytheme' ),
));
在这个例子中：
'primary' 和 'footer' 是唯一的标识符，你可以根据需要命名。
__( 'Primary Menu', 'mytheme' ) 和 __( 'Footer Menu', 'mytheme' ) 是菜单位置的描述性名称，它们将显示在 WordPress 后台的“外观” -> “菜单”页面中。__ 是一个翻译函数，确保文本可以被本地化；'mytheme' 是文本域，用于指定哪个主题或插件正在使用这个翻译字符串。
一旦你注册了菜单，你就可以在主题模板文件中通过以下方式来输出这些菜单：
wp_nav_menu(
array(
'theme_location' => 'primary',
'menu_id' => 'primary-menu',
)
);
*/
register_nav_menus(
array(
'mainnav' => esc_html__( '网站主导航'),
'footernav' =>esc_html__( '底部导航'),
'diynav' => esc_html__( '自定义' ),
)
);自定义网站背景
/*
自定义网站背景内容。
该功能让主题支持自定义背景（Custom Background），在3.4版本中引入。替换原来的add_custom_background()方法。
可以这样启动：
add_theme_support( 'custom-background' );
也可以这样使用以下方法添加默认参数：
*/
$bg_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' => 'ffffff',
'wp-head-callback' => '_custom_background_cb',
'admin-head-callback' => '',
'admin-preview-callback' => '',
);
add_theme_support( 'custom-background', $bg_defaults );页眉启动项（经典主题强烈推荐）
/*
custom header
页眉启动项
此功能启用对主题的Custom_Headers支持自定义网站页眉图片设置的启动项
可以这样使用：
add_theme_support( 'custom-header' );
也可以这样使用以下方法添加默认参数：
**/
$header_defaults = array(
'default-image' => '',
'random-default' => false,
'width' => 300,
'height' => 60,
'flex-height' => true,
'flex-width' => true,
'default-text-color' => '',
'header-text' => true,
'uploads' => true,
'wp-head-callback' => '',
'admin-head-callback' => '',
'admin-preview-callback' => '',
'video' => false,
'video-active-callback' => 'is_front_page',
);
add_theme_support( 'custom-header', $header_defaults );自定义网站Logo图标（经典主题强烈推荐）
/*
custom logo
自定义网站Logo图标。
此功能在 Version_4.5 中首次引入，可实现对主题的Theme_Logo支持。
经典主题推荐始终启动，块主题可以选择不添加
add_theme_support( 'custom-logo' );
也可以这样：使用以下方法添加默认参数：
add_theme_support( 'custom-logo', array(
'height' => 100,
'width' => 400,
'flex-height' => true,
'flex-width' => true,
'header-text' => array( 'site-title', 'site-description' ),
'unlink-homepage-logo' => true,
) );
*/
add_theme_support( 'custom-logo', array(
'height' => 60,
'width' => 400,
'flex-height' => true,
'flex-width' => true,
'header-text' => array( 'site-title', 'site-description' ),
'unlink-homepage-logo' => true,
)
);选择性刷新（仅经典主题推荐）
/*
refresh widgest
选择性刷新。
仅对经典主题有用：
add_theme_support( 'customize-selective-refresh-widgets' ) 是一个为了提升经典主题中小工具在自定义器里体验的功能。而块主题从根本上不再使用传统的小工具系统，所以这个功能也就失去了用武之地。
选择性刷新是一种混合预览机制，具有不必刷新整个预览窗口的性能优势。这以前在 JS 应用的预览中可用，但选择性刷新还可以提高预览更改的准确性，同时减少必须编写的代码量;它还使以前几乎不可能的高性能预览成为可能。
小部件的选择性刷新是 4.5 中定制器中小部件管理的关键可用性体验改进。但是，由于对网站标题和标语的实时更新需要支持主题代码，因此小部件也需要主题支持；
导航菜单的选择性刷新在 4.3 中默认启用。
add_theme_support( 'customize-selective-refresh-widgets' ) 是WordPress中用于启用自定义选择性刷新小工具（widgets）的支持。这个功能允许在定制器（Customizer）中对小工具进行实时预览，并且当用户更改小工具设置时，只有受影响的部分会被重新加载，而不是整个页面。这提高了用户体验，因为用户可以即时看到他们的更改效果，而不需要等待整个页面的刷新。
可以这样启动：
add_theme_support( 'customize-selective-refresh-widgets' );
这将告诉WordPress你的主题支持选择性刷新小工具的功能。一旦启用了这项支持，用户在定制器中编辑小工具时，可以立即看到变化，而不会影响到页面的其他部分。
虽然 add_theme_support( 'customize-selective-refresh-widgets' ) 启用了选择性刷新的支持，但要使特定的小工具区域能够实际利用这一功能，你可能还需要在主题模板文件中为每个小工具区域添加相应的JavaScript代码。通常，这涉及到使用 wp.customize.selectiveRefresh API 来指定哪些元素应该被刷新。有关选择性刷新的工作原理和方式的更多信息，请阅读实现对 Widget 的选择性刷新支持：
https://make.wordpress.org/core/2016/03/22/implementing-selective-refresh-support-for-widgets/
*/
add_theme_support( 'customize-selective-refresh-widgets' );【编辑器】启动编辑器深色背景（个性）
/*
启动编辑器深色背景
如果编辑器样式依赖于深色背景，则可以添加以下内容来调整UI的颜色，使其适用于深色背景：
在WordPress中，add_theme_support( 'dark-editor-style' ) 是一个用于启用暗色编辑器样式的函数调用。这个功能允许你在块编辑器（Gutenberg 编辑器）中提供一个暗色主题选项，从而改善夜间或低光环境下的用户体验。这使得编辑器界面更加舒适，并且可以减少眼睛疲劳。
*/
add_theme_support( 'dark-editor-style' );【编辑器】禁用块编辑器自定义颜色
/*
禁用块编辑器自定义颜色。
默认情况下，块可用的调色板允许用户选择与编辑器或主题默认颜色不同的自定义颜色。主题可以通过 add_theme_support( 'disable-custom-colors' ) 的方式禁用此功能。
在WordPress中，add_theme_support( 'disable-custom-colors' ) 是一个用于禁用自定义颜色选项的功能。这个功能允许主题开发者在块编辑器（Gutenberg 编辑器）中禁用用户自定义颜色的功能。禁用自定义颜色可以确保内容的视觉一致性，并防止用户选择与主题设计不匹配的颜色。
*/
add_theme_support( 'disable-custom-colors' );禁用自定义梯度
主题可以通过以下代码禁用自定义渐变的功能：
add_theme_support( 'disable-custom-gradients' );设置后，用户将被限制使用块编辑器中默认的渐变或主题支持设置提供的渐变。editor-gradient-presets
禁用基础布局样式（极不推荐）
注意：自 WordPress 6.1 以来。
主题可以选择不使用生成的块布局样式，这些样式为核心块提供默认结构样式，包括组、列、按钮和社交图标。通过使用以下代码，这些主题承诺提供自己的结构样式，因为使用此功能会导致核心块在编辑器和网站前端中错误显示：
add_theme_support( 'disable-layout-styles' );禁用块编辑器自定义字体大小
/*
禁用块编辑器自定义字体大小。
设置后，用户将被限制为块编辑器中默认的大小或主题支持设置中的大小。
在WordPress中，add_theme_support( 'disable-custom-font-sizes' ) 是一个用于禁用自定义字体大小选项的功能。这个功能允许主题开发者在块编辑器（Gutenberg 编辑器）中禁用用户自定义字体大小的功能。禁用自定义字体大小可以确保内容的视觉一致性，并防止用户选择与主题设计不匹配的字体大小。
*/
add_theme_support( 'disable-custom-font-sizes' );配置字体大小
块可以允许用户配置他们使用的字体大小，例如段落块。该块提供默认的字体大小，但主题可以覆盖并提供自己的字体大小。
对于块主题，强烈推荐使用 theme.json 实现。所以对于完全使用 theme.json 的现代块主题，这个传统函数已不再是必须的。
那么，这里我们主要针对经典主题来讲，实现方式如下。
在WordPress中，add_theme_support( ‘editor-font-sizes’ ) 是一个用于向块编辑器（Gutenberg 编辑器）添加自定义字体大小选项的功能。这个功能允许主题开发者定义一组预设的字体大小，用户可以在编辑器中选择这些预设的字体大小来应用到他们的内容上。这有助于保持内容的一致性和设计风格。
add_theme_support( 'editor-font-sizes', array(
array(
'name' => esc_attr__( 'Small', 'themeLangDomain' ),
'size' => 12,
'slug' => 'small'
),
array(
'name' => esc_attr__( 'Regular', 'themeLangDomain' ),
'size' => 16,
'slug' => 'regular'
),
array(
'name' => esc_attr__( 'Large', 'themeLangDomain' ),
'size' => 36,
'slug' => 'large'
),
array(
'name' => esc_attr__( 'Huge', 'themeLangDomain' ),
'size' => 50,
'slug' => 'huge'
)
) );字体大小会按照主题提供的顺序在字体大小选择器上渲染。
主题负责创建应用正确字体大小样式的类。
类名构建时，会加上“has-”，然后是使用kebab大写的字体大小名称，结尾为 -font-size 。
以常规字体大小为例，主题可能提供以下类别。
.has-regular-font-size {
font-size: 16px;
}注意：“默认”和“自定义”这两个词缀是保留的，不能被主题使用。
从 WordPress 5.9 开始，为了覆盖核心定义的字体大小，没有 theme.json 的主题必须通过 CSS –wp–preset–font-size–<slug> 自定义属性设置值，而不是提供类。CSS 自定义属性使用以下命名方式。
:root {
--wp--preset--font-size--small: <new_value>;
--wp--preset--font-size--large: <new_value>;
}对主题中默认 Gutenberg 块样式的支持（经典主题强烈推荐）
/*
Add support for Block Styles.
声明对 Block Styles 的支持。
这将启用对主题中默认 Gutenberg 块样式的支持。
这是一个主要针对经典主题的服务配置！
经典主题推荐开启。
////官方说明-start/////////////////////////
块编辑器允许主题在前端选择稍微更有主见的风格。这些样式的一个例子是块引号左侧的默认颜色条。如果你想在经典主题中使用这些主观风格，请添加支持：wp-block-styles
对于块主题或提供theme.json文件的主题，不建议使用该主题支持。相反，为了确保全局样式规则和块样式之间没有样式冲突，可以将所需的块样式添加到主题theme.json文件中。
////官方说明-end/////////////////////////
核心块包括默认的结构样式。默认情况下，这些都加载在编辑器和前端中。这些样式的一个示例是为列块提供基本的CSS布局支持，没有这些CSS规则，编辑器的块布局将会错乱。
这些将启用对主题中默认古腾堡块样式的支持。
声明对块样式的支持。
*/
add_theme_support( 'wp-block-styles' );自定义行高（经典主题推荐）
/*
Add support for custom line height controls.
添加对自定义行高控件的支持。
目前没有明确的官方文档显示 add_theme_support( 'custom-line-height' ) 是WordPress核心直接支持的函数参数
且
在现代化的块主题开发中，实现和管理行高设置通常有更推荐的方法：使用 theme.json
*/
add_theme_support( 'custom-line-height' );从旧版 RSS 小部件中删除源图标链接（经典主题推荐）
/*
主题可以使用于 删除图标链接。
从旧版 RSS 小部件中删除源图标链接。
Remove feed icon link from legacy RSS widget.
在纯粹的块主题中，这行代码通常没有必要。
如果您是主题开发者，为了确保使用您主题的用户在任何情况下都不会看到这个图标（无论他们使用块还是经典小工具），保留它算是一种防御性的兼容措施。
代码的本来用途
这行代码用于移除WordPress的经典小工具（Classic Widget）——“RSS” 小工具标题旁边那个橙色的RSS订阅图标链接。这个功能通过一个过滤器实现，从WordPress 5.9版本开始引入。
*/
add_filter( 'rss_widget_feed_link', '__return_false' );色彩调色板（推荐用于经典主题）
不同的块可以自定义颜色。块编辑器提供默认调色板，但主题可以覆盖该调色板并提供自己的调色板。
对于块主题，强烈推荐通过 theme.json 来实现自己的调色板。所以这里我们重点是讲经典主题的情形。
对于经典主题，可以通过以下方式：
add_theme_support( 'editor-color-palette', array(
array(
'name' => esc_attr__( 'strong magenta', 'themeLangDomain' ),
'slug' => 'strong-magenta',
'color' => '#a156b4',
),
array(
'name' => esc_attr__( 'light grayish magenta', 'themeLangDomain' ),
'slug' => 'light-grayish-magenta',
'color' => '#d0a5db',
),
array(
'name' => esc_attr__( 'very light gray', 'themeLangDomain' ),
'slug' => 'very-light-gray',
'color' => '#eee',
),
array(
'name' => esc_attr__( 'very dark gray', 'themeLangDomain' ),
'slug' => 'very-dark-gray',
'color' => '#444',
),
) );
/*
name：是一个人类可读的标签（如上所示），出现在提示中，为用户提供了有意义的颜色描述。对于依赖屏幕阅读器或难以辨认颜色的人来说，这一点尤为重要。
slug：是颜色的唯一标识符，用于生成块编辑器色彩调色板中使用的CSS类。
color：是用于指定颜色的十六进制代码。
*/有些颜色会动态变化——比如“原色”和“次色”——比如《二十一九》主题曲，无法用程序性描述。尽管如此，仍建议在适用时至少为默认值提供有意义的s。name
颜色会按顺序在调色板上显示，且颜色数量没有限制。
主题负责创建在不同情境下应用颜色的类。核心块使用“颜色”、“背景色”和“边框颜色”上下文。所以要正确地将“强烈品红色”应用到核心模块的所有上下文中，主题应该实现这些职业本身。类名后加上“has-”，后面用kebab大写字母，最后以上下文名称结尾。
.has-strong-magenta-color {
color: #a156b4;
}
.has-strong-magenta-background-color {
background-color: #a156b4;
}
.has-strong-magenta-border-color {
border-color: #a156b4;
}从 WordPress 5.9 开始，为了覆盖核心定义的颜色值，没有 theme.json 的主题必须通过 CSS –wp–preset–color–<slug> 自定义属性设置值，而不是提供类。CSS 自定义属性使用以下命名。
:root {
--wp--preset--color--cyan-bluish-gray: <new_value>;
--wp--preset--color--pale-pink: <new_value>;
}块梯度预设（推荐用于经典主题）
不同的块可以从预设梯度列表中选择。块编辑器提供默认渐变预设，但主题可以覆盖它们并提供自己的。
对于块主题，强烈推荐通过 theme.json 来实现自己的调色板。所以这里我们重点是讲经典主题的情形。
对于经典主题，可以通过以下方式：
add_theme_support(
'editor-gradient-presets',
array(
array(
'name' => esc_attr__( 'Vivid cyan blue to vivid purple', 'themeLangDomain' ),
'gradient' => 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)',
'slug' => 'vivid-cyan-blue-to-vivid-purple'
),
array(
'name' => esc_attr__( 'Vivid green cyan to vivid cyan blue', 'themeLangDomain' ),
'gradient' => 'linear-gradient(135deg,rgba(0,208,132,1) 0%,rgba(6,147,227,1) 100%)',
'slug' => 'vivid-green-cyan-to-vivid-cyan-blue',
),
array(
'name' => esc_attr__( 'Light green cyan to vivid green cyan', 'themeLangDomain' ),
'gradient' => 'linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%)',
'slug' => 'light-green-cyan-to-vivid-green-cyan',
),
array(
'name' => esc_attr__( 'Luminous vivid amber to luminous vivid orange', 'themeLangDomain' ),
'gradient' => 'linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%)',
'slug' => 'luminous-vivid-amber-to-luminous-vivid-orange',
),
array(
'name' => esc_attr__( 'Luminous vivid orange to vivid red', 'themeLangDomain' ),
'gradient' => 'linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%)',
'slug' => 'luminous-vivid-orange-to-vivid-red',
),
)
);name：是一个人类可读的标签（如上文所示），出现在提示中，为用户提供了梯度的有意义描述。对于依赖屏幕阅读器或难以辨认颜色的人来说，这一点尤为重要。
gradient：是应用于块背景图像的梯度CSS值。有效梯度类型的详细信息可在 Mozilla 文档中找到。
slug：是梯度的唯一标识符，用于生成块编辑器使用的CSS类。
主题负责创建应用梯度的类别。因此，要正确应用“鲜艳青蓝到鲜艳紫”，主题应实现以下类：
.has-vivid-cyan-blue-to-vivid-purple-gradient-background {
background: linear-gradient(
135deg,
rgba( 6, 147, 227, 1 ) 0%,
rgb( 155, 81, 224 ) 100%
);
}从 WordPress 5.9 开始，为了覆盖核心定义的渐变值，没有 theme.json 的主题必须通过 CSS –wp–preset–gradient–<slug> 自定义属性设置值，而不是提供类。CSS 自定义属性使用以下命名方式。
:root {
--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: <new_value>;
--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: <new_value>;
}强烈建议舍弃的配置
无论是对于块主题还是经典主题，笔者认为以下配置已经没有用武之地：
1、add_theme_support( 'custom-line-height' );//自定义行高
2、add_theme_support( ‘custom-units’, array() ); //自定义单位
除了像素，用户还可以使用其他单位来定义尺寸、填充……可选单位有：px、em、rem、VH、VW。主题可以通过以下代码禁用对此功能的支持：
add_theme_support( 'custom-units', array() );主题还可以筛选可用的自定义单元。
add_theme_support( 'custom-units', 'rem', 'em' );【编辑器】配置块编辑器样式（从版本 5.9 开始，块主题中默认启用）
/*
Add support for editor styles.
配置块编辑器样式。
从版本 5.9 开始，块主题中默认启用
为块编辑器启用对 align full 和 align wide 选项的主题支持，请使用：add_theme_support( 'editor-styles' );
建议添加，这将实现前后台的样式统一配置块编辑器样式。
add_theme_support( 'editor-styles' ) 是WordPress中用于启用编辑器样式支持的一个函数调用。这个功能允许你在块编辑器（Gutenberg编辑器）中应用自定义的CSS样式，从而让编辑器中的内容预览更加接近前端实际显示的效果。这对于提高用户体验和确保所见即所得（WYSIWYG）非常有帮助。
*/
add_theme_support( 'editor-styles' );【编辑器】在块编辑器中加载自定义的CSS样式表（强烈推荐）
/*
add_editor_style()
在块编辑器中加载自定义的CSS样式表
注意：这项配置使用前，务必启动：add_theme_support( 'editor-styles' );
允许主题开发人员将自定义样式表文件链接到 TinyMCE 可视化编辑器。该函数针对当前主题目录测试作为 $stylesheet 参数给出的相对路径是否存在，并在成功时链接文件。如果未指定 $stylesheet 参数，该函数将针对当前主题目录测试是否存在默认编辑器样式表文件 editor-style.css，并在成功时链接该文件。
如果使用子主题，则会同时测试当前子主题目录和父主题目录，并且具有相同相对路径的两个文件（如果找到）都将与此单个调用链接。
要从当前主题目录以外的位置链接样式表文件，例如在你的插件目录下，请改用附加到 mce_css 钩子的过滤器。
add_editor_style() 是WordPress中的一个函数，用于在块编辑器（Gutenberg 编辑器）中加载自定义的CSS样式表。这使得编辑器中的内容预览更加接近前端实际显示的效果，从而实现所见即所得（WYSIWYG）的编辑体验。
如果你将样式文件保存在子目录（例如 css）中，你可以使用以下命令添加编辑器样式：
add_editor_style( trailingslashit( get_template_directory_uri() ) . 'css/editor-style.css' );
add_editor_style( get_stylesheet_directory_uri() . '/css/editor-style-' . $my_post_type . '.css' );
也可以用在“admin_init”钩子上，也可以用在'after_setup_theme'上
使用举例：
根目录css中的调取：
add_editor_style( '/css/bootstrap.min.css' );
// 载入bootstrap样式，必须网站前台同时使用了方可载入
add_editor_style( '/css/style.css' );
//这个是网站前台自定义样式表（前台全部自定义样式都在这里）
remove_editor_styles( '/css/bootstrap.min.css' );
// 移除
add_editor_style( '/css/my-editor-view.css' );
//自定义样式表，使得后台编辑可视化界面与网页前台保持一致
主题中assets文件夹下调取：
add_editor_style( 'assets/css/editor-style.css' );
*/【编辑器】调整颜色（强烈推荐）
你可以像其他网页一样对编辑器进行样式调整。以下是将背景色和字体颜色改为蓝色的方法：
body {
background-color: #d3ebf3;
color: #00005d;
}具体方法：
1、 将这段代码添加到 `style-editor.css` 样式表中
2、将样式表添加到编辑器：
add_editor_style( 'style-editor.css' );【编辑器】调整编辑器宽度（强烈推荐）
要更改编辑器的主栏宽度，请在 ：style-editor.css
/* Main column width */
.wp-block {
max-width: 720px;
}
/* Width of "wide" blocks */
.wp-block[data-align='wide'] {
max-width: 1080px;
}
/* Width of "full-wide" blocks */
.wp-block[data-align='full'] {
max-width: none;
}
然后再使用 add_editor_style( ‘style-editor.css’ ); 的方法将样式表添加到编辑器即可实现。
你可以用这些编辑器宽度来匹配你主题中的宽度。你可以使用任何 CSS 宽度单位，包括 % 或 px 。
响应式嵌入式内容（5.9版本开始，块主题中默认启用）
在WordPress中，add_theme_support( ‘responsive-embeds’ ) 是一个用于启用响应式嵌入的功能。这个功能确保了从其他网站嵌入的内容（例如视频、推文等）能够根据用户的屏幕大小自动调整其尺寸，从而提供更好的用户体验，尤其是在移动设备上。
嵌入块会自动对嵌入内容应用样式，以反映嵌入 iFrame 中内容的宽高比。采用宽高比响应式样式的块会像这样：
<figure class="wp-embed-aspect-16-9 wp-has-aspect-ratio">...</figure>要让内容调整大小并保持其宽高比，元素需要该类。这不是默认设置的，需要主题选择加入该功能：<body>wp-embed-responsiveresponsive-embeds
add_theme_support( 'responsive-embeds' );//从版本 5.9 开始，块主题中默认启用间距控制（不明）
对于现代块主题，请在 theme.json 文件中通过 spacingSizes 等设置来定义和管理间距。
有些块可以有填充控制。默认情况下关闭，主题必须通过声明支持来选择：
add_theme_support( 'custom-spacing' );首先，发布本文时，官方显示“custom-spacing”功能还处于开发中，按照当前块主题和块编辑器的功能情况来推测，该“custom-spacing”功能可能是为经典主题也能享受同样便捷而提供的，具体真实情况请以官方为准。
当前情况下，建议不使用 add_theme_support( ‘custom-spacing’ )。要实现自定义间距：
对于经典主题或过渡性主题，块编辑器通常已提供基础间距控制。
链接颜色控制
链接支持已在 WordPress 5.8 中实现稳定。默认情况下是这样，主题可以通过theme.json文件启用：false
{
"settings": {
"color": {
"link": true
}
}
}或者，启用 Gutenberg 插件时，旧的遗留支持也能正常使用。当 Gutenberg 插件要求最低版本为 WordPress 5.9 时，这个备份将被移除。add_theme_support( 'experimental-link-color' )
当用户设置某个块的链接颜色时，会添加一个新的样式，形式如下：
.wp-elements-<uuid> a {
color: <link-color> !important;
}哪里
<uuid>是一个随机数<link-color>是（如果用户选择了预设值），又是原始颜色值（如果用户选择了自定义值）var(--wp--preset--color--slug)
该模块会连接到该类别。.wp-elements-<uuid>
外观工具（经典主题推荐）
使用此设置启用以下全局样式设置：
- 边框：颜色、半径、样式、宽度
- 颜色：链接
- 间距：区间间隙、边距、填充
- 字体：线高
- 尺寸：aspectRatio，最小高度
- 位置：粘性
根据 WordPress 官方的开发记录，appearance-tools 功能并非默认启用，需要主题开发者通过代码手动开启。
它主要是针对经典主题，而非块主题。
appearance-tools 主要是为了让经典主题（Classic Themes） 也能让用户享用到类似的设计灵活性。
add_theme_support( 'appearance-tools' );边框（经典主题推荐）
关于 add_theme_support( 'border' )，它不是默认启用的，需要主题主动声明支持。
它主要是针对经典主题，而非块主题。
此功能主要是为了让经典主题也能享用区块编辑器的边框设计工具。
要为经典主题（非区块主题）启用边框设置支持，你需要在主题的 functions.php 文件中添加以下代码：
add_theme_support( 'border' );链接颜色（经典主题推荐）
此功能主要是为了让经典主题也能享用块编辑器的链接颜色设计工具。
要为经典主题启用链接颜色设置支持，你需要在主题的 functions.php 文件中添加以下代码：
add_theme_support( 'link-color' );基于块的模板部分（经典主题推荐）
基于块的模板部分允许管理员使用块编辑网站的部分。默认情况下关闭，主题必须通过声明支持来选择：
add_theme_support( 'block-template-parts' );此功能仅适用于非块式主题（也就是说仅适用于经典主题），因为块主题已支持基于块的模板部分作为网站编辑器的一部分。
独立模板部分编辑器不允许编辑者创建新模板或删除现有模板部分。这是因为主题需要手动在PHP模板中包含模板部分。