当前位置: 首页 > news >正文

WordPress 函数:add_theme_support() 开启主题自定义功能(全面)

add_theme_support() 用于在我们的当前使用的主题添加一些特殊的功能,函数一般写在主题的functions.php文件中,当然也可以再插件中使用钩子来调用该函数,如果是挂在钩子上,那他必须挂在after_setup_theme钩子上,因为 init hook 对于一些功能来说,已经太迟了.

(在后台外观->主题_>点击自定义)

先看效果截图:

用法

<?php add_theme_support($feature);?>

参数说明

$feature

(string) (必须) 需要添加特殊功能名称,可以是以下参数:

◆‘post-thumbnails’—– 增加缩略图支持

◆‘automatic-feed-links’—–自动输出RSS

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

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

◆‘custom-header’—– 增加自定义顶部图像

◆‘menus’——自定义导航菜单

默认: None

$args:

数组,功能相关的额外参数。

也就是说你可以如下使用:(该函数必须在主题的 functions.php 文件中调用)

 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' ); // 所有输出内容支持特色图像
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() 函数注册的文章类型。

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

通过 WordPress 输出内容时,如果选择了特色图像,系统会在 wp_postmeta 表下创建一个对应 post_id 的 _thumbnail_id 字段用于存储当前 Post 内容的特色图像。

判断是否有文章缩略图

has_post_thumbnail( int|WP_Post $post = null )

获取文章缩略图

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

设置缩略图大小

set_post_thumbnail_size(120,120, true );

  1. //前面两个参数分别为-宽、高

  1. //后面参数为是否裁剪图片到这么大 true为裁剪

注意,设置了缩略图大小之后,并不是说你输出特色图像的时候就直接输出这个大小,这个代码的功能只是在你设置缩略图的时候将那个图片生成了一个你设定大小的图片。输出特色图像的时候还是要加上大小,不然就会输出原图。

Custom-logo (自定义主题LOGO)

加主题自定义网站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 版本引进让主题支持定义背景。添加自定义网站背景图像支持,会在“主题后台/外观/自定义/背景图像”中添加图像上传功能。

  1. add_theme_support('custom-background');

设置默认背景的参数:

// 背景图像$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 支持,系统都会默认显示出颜色小节选项,用于配置页眉文字及背景颜色。

无论是 custom-logo 、 custom-header 还是 custom-background 都会将其配置数据存储在 wp_options 表下的 theme_mod_主题名 字段下。

Custom Header(支持自定义头部图像)

3.4 版本引进的让主图支持自定义头图。添加自定义网站头部图像支持,会在“主题后台/外观/自定义/页眉图像”中添加图像上传功能。

请注意您可以添加的默认参数列表:

$defaults = array('default-image'=>'',     //默认图像'random-default'=> false,  //是否默认随机'width'=>0,      //宽度'height'=>0,      //高度'flex-height'=> false,'flex-width'=> false,'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', $defaults );

Automatic Feed Links(头部自动生成 RSS 地址)

这个功能让 WordPress 自动在主题 head 添加 日志和留言的 RSS feed links。这个功能是在 3.0 版本引进的。自动生成页面 feed 链接,需要在主题 header.php 文件中调用 <?php wp_head();?> 。

示例:

// 自动添加 feed 链接
add_theme_support( 'automatic-feed-links' );

customize-selective-refresh-widgets(修改实时预览效果)

添加此功能支持后可以配置一些小工具或自定义设置中,修改设置后页面自动刷新实时预览效果

示例

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

html5

对主题中的搜索表单,评论表单,评论列表,画廊和标题等内容添加 HTML5 标签支持。

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

添加完成后,输出的内容就都是符合 html5 标准的标签了。

title-tag

自动生成页面标题,老版本需要使用 wp-title() 获取对应标题,新版本只需要在主题 header.php 文件中调用 <?php wp_head();?> 即可自动生成title 标签。

示例

// 标题标签
add_theme_support( 'title-tag' );

responsive-embeds

WordPress 支持 Embed 功能,就是它可以将一些文章、视频、音频等链接以卡片式显示的方式自动嵌入到你的文章中去,但是这种嵌入的方式可能会导致嵌入的内容超出容器宽度,启用 responsive-embeds 支持可以让 WordPress 自动自适应包裹容器大小,已尽可能好地显示嵌入内容。

// 自适应嵌入内容
add_theme_support( 'responsive-embeds' );

align-wide

添加该功能,WordPress 会自动识别全幅或宽幅图片,并自动将其居中对齐以实现更好的显示效果。注意:只有设置了 full 或 wide 的图片才有效。

// 全幅或宽幅图片居中对齐
add_theme_support( 'align-wide' );

wp-block-styles

添加主题块样式支持

// 块样式支持
add_theme_support( 'wp-block-styles' );

editor-styles

允许自定义主题编辑器样式,需配合 add_editor_style() 使用,以引入相应样式文件。自定义编辑器样式可很好地实现所见即所得。

示例

// 修改编辑器样式
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

添加自定义字体大小选择的支持,传入字体数据可控制下拉选择中的字号项目。

示例

// 自定义字体大小选择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

添加自定义编辑器调色板的支持,传入颜色数据可控制调色板上默认显示的颜色。

示例

// 自定义颜色面板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',),));

相关文章:

WordPress 函数:add_theme_support() 开启主题自定义功能(全面)

add_theme_support() 用于在我们的当前使用的主题添加一些特殊的功能&#xff0c;函数一般写在主题的functions.php文件中&#xff0c;当然也可以再插件中使用钩子来调用该函数&#xff0c;如果是挂在钩子上&#xff0c;那他必须挂在after_setup_theme钩子上&#xff0c;因为 i…...

Winform控件开发(16)——Timer(史上最全)

前言: Timer控件的作用是按用户定义的时间间隔引发事件的计时器,说的直白点就是,他就像一个定时炸弹一样到了一定时间就爆炸一次,区别在于定时炸弹炸完了就不会再次爆炸了,但是Timer这个计时器到了下一个固定时间还会触发一次,上面那张图片就是一个典型的计时器,该定时器…...

游戏高度可配置化:通用数据引擎(data-e)及其在模块化游戏开发中的应用构想图解

游戏高度可配置化&#xff1a;通数据引擎在模块化游戏开发中的应用构想图解 ygluu 码客 卢益贵 目录 一、前言 二、模块化与插件 1、常规模块化 2、插件式模块化&#xff08;插件开发&#xff09; 三、通用数据引擎理论与构成 1、名字系统&#xff08;数据类型&#xf…...

CountDownLatch与CyclicBarrier原理剖析

1.CountDownLatch 1.1 什么是CountDownLatch CountDownLatch是一个同步工具类&#xff0c;用来协调多个线程之间的同步&#xff0c;或者说起到线程之间的通信&#xff08;而不是用作互斥的作用&#xff09;。 CountDownLatch能够使一个线程在等待另外一些线程完成各自工作之…...

NLP中的对话机器人——预训练基准模型

引言 本文是七月在线《NLP中的对话机器人》的视频笔记&#xff0c;主要介绍FAQ问答型聊天机器人的实现。 场景二 上篇文章中我们解决了给定一个问题和一些回答&#xff0c;从中找到最佳回答的任务。 在场景二中&#xff0c;我们来实现&#xff1a; 给定新问题&#xff0c;从…...

C语言学习及复习笔记-【14】C文件读写

14 C文件读写 14.1打开文件 您可以使用 fopen( ) 函数来创建一个新的文件或者打开一个已有的文件&#xff0c;这个调用会初始化类型 FILE 的一个对象&#xff0c;类型 FILE包含了所有用来控制流的必要的信息。下面是这个函数调用的原型&#xff1a; FILE *fopen( const char…...

模拟退火算法优化灰色

clc; clear; close all; warning off; %% tic T01000; % 初始温度 Tend1e-3; % 终止温度 L200; % 各温度下的迭代次数&#xff08;链长&#xff09; q0.9; %降温速率 X[16.4700 96.1000 16.4700 94.4400 20.0900 92.5400 22.3900 93.3700 25.…...

Pandas怎么添加数据列删除列

Pandas怎么添加数据列 1、直接赋值 # 1、直接赋值df.loc[:, "最高气温"] df["最高气温"].str.replace("℃", "").astype("int32")df.loc[:, "最低气温"] df["最低气温"].str.replace("℃"…...

C++类和对象:构造函数和析构函数

目录 一. 类的六个默认成员函数 二. 构造函数 2.1 什么是构造函数 2.2 编译器自动生成的默认构造函数 2.3 构造函数的特性总结 三. 析构函数 3.1 什么是析构函数 3.2 编译器自动生成的析构函数 3.3 析构函数的特性总结 一. 类的六个默认成员函数 对于任意一个C类&…...

【Stata】从入门到精通.零基础小白必学的教程,一学就fei

视频教程移步&#xff1a;https://www.bilibili.com/video/BV1hK4y1d714/?p4&spm_id_frompageDriver&vd_sourcecc8074e9c81a225f214226065db53d32P3 第二讲 Stata处理数据全流程&#xff08;上&#xff09; P3 - 01:37&#xfeff;内置数据 file example datasets使用…...

【RuoYi优化】调整JVM启动内存

📔 笔记介绍 大家好,千寻简笔记是一套全部开源的企业开发问题记录,毫无保留给个人及企业免费使用,我是作者星辰,笔记内容整理并发布,内容有误请指出,笔记源码已开源,前往Gitee搜索《chihiro-notes》,感谢您的阅读和关注。 作者各大平台直链: GitHub | Gitee | CSD…...

[架构模型]MVC模型详细介绍,并应用到unity中

简介&#xff1a; MVC模式是一种软件架构模式&#xff0c;它将应用程序分为三个主要部分&#xff1a;模型&#xff08;Model&#xff09;、视图&#xff08;View&#xff09;和控制器&#xff08;Controller&#xff09;。MVC模式的目标是实现应用程序的松耦合&#xff0c;以便…...

?? JavaScript 双问号(空值合并运算符)

?? JavaScript 双问号&#xff08;空值合并运算符) 一、简述 在网上浏览 JavaScript 代码时或者学习其他代码时&#xff0c;可能会发现有的表达式用了两个问号&#xff08;??&#xff09;如下所示&#xff1a; let username; console.log(username ?? "Guest"…...

作业2.25----通过操作Cortex-A7核,串口输入相应的命令,控制LED灯进行工作

1.通过操作Cortex-A7核&#xff0c;串口输入相应的命令&#xff0c;控制LED灯进行工作 例如在串口输入led1on,开饭led1灯点亮 2.例如在串口输入led1off,开饭led1灯熄灭 3.例如在串口输入led2on,开饭led2灯点亮 4.例如在串口输入led2off,开饭led2灯熄灭 5.例如在串口输入led…...

0101基础概念-图-数据结构和算法(Java)

文章目录1 图1.1 定义1.2 4种图模型2 无向图2.1 定义2.2 术语后记1 图 1.1 定义 图是一种非线性的数据结构&#xff0c;表示多对多的关系。 图&#xff08;Graph&#xff09;是由顶点的有穷非空集合和顶点之间边的集合组成&#xff0c;通常表示为&#xff1a;G(V, E)&#xf…...

Linux基础命令和工具使用详解

Linux基础命令和工具使用详解一、grep搜索字符二、find查找文件三、ls 显示文件四、wc命令计算字数五、uptime机器启动时间负载六、ulimit用户资源七、curl http八、scp远程拷贝九、dos2unix和unix2dos十、sed 行处理10.1、简单模式10.2、替换模式十一、awk 列处理11.1、打印某…...

一个好的python文件可以有几种用途?

大家好鸭&#xff01;我是小熊猫~ 这次来带大家浅浅回顾一点python小知识~ 源码资料电子书:点击此处跳转文末名片获取 python文件总共有两种用途&#xff1a; 一种是执行文件另一种是被当做模块导入 编写好的一个python文件可以有两种用途&#xff1a; 1. 脚本&#xff0c;…...

HDFS优化

单节点多块磁盘数据均衡 生成HDFS块均衡计划 hdfs diskbalancer -plan node1 执行均衡计划,node1.plan.json均衡计划文件 hdfs diskbalancer -execute node1.plan.json 查看当前均衡任务的执行情况 hdfs diskbalancer -query node1 取消均衡任务hdfs diskbalancer -cancel nod…...

行测-判断推理-图形推理-样式规律-黑白运算

黑白元素个数不同&#xff0c;优先考虑黑白运算白白白黑黑白黑白黑选A考试时&#xff0c;这种题不要先把规律全部推出来&#xff0c;再去做题&#xff0c;太慢了直接看要推的图&#xff0c;通过排除法选答案黑白元素个数不同&#xff0c;优先考虑黑白运算白白白黑黑白黑白黑选B…...

java+springboot+vue高校学生医疗保险管理系统

医保管理系统是对与职工健康息息相关的档案进行的系统化、自动化的管理&#xff0c;主要是对职工办理的医疗保险的管理&#xff0c;本系统能够很好的适应社会的需求&#xff0c;最大化的为城镇职工提供服务。医疗保险是国家社会保障体系的重要组成部分&#xff0c;也是社会保险…...

浏览器访问 AWS ECS 上部署的 Docker 容器(监听 80 端口)

✅ 一、ECS 服务配置 Dockerfile 确保监听 80 端口 EXPOSE 80 CMD ["nginx", "-g", "daemon off;"]或 EXPOSE 80 CMD ["python3", "-m", "http.server", "80"]任务定义&#xff08;Task Definition&…...

c++ 面试题(1)-----深度优先搜索(DFS)实现

操作系统&#xff1a;ubuntu22.04 IDE:Visual Studio Code 编程语言&#xff1a;C11 题目描述 地上有一个 m 行 n 列的方格&#xff0c;从坐标 [0,0] 起始。一个机器人可以从某一格移动到上下左右四个格子&#xff0c;但不能进入行坐标和列坐标的数位之和大于 k 的格子。 例…...

WordPress插件:AI多语言写作与智能配图、免费AI模型、SEO文章生成

厌倦手动写WordPress文章&#xff1f;AI自动生成&#xff0c;效率提升10倍&#xff01; 支持多语言、自动配图、定时发布&#xff0c;让内容创作更轻松&#xff01; AI内容生成 → 不想每天写文章&#xff1f;AI一键生成高质量内容&#xff01;多语言支持 → 跨境电商必备&am…...

【服务器压力测试】本地PC电脑作为服务器运行时出现卡顿和资源紧张(Windows/Linux)

要让本地PC电脑作为服务器运行时出现卡顿和资源紧张的情况&#xff0c;可以通过以下几种方式模拟或触发&#xff1a; 1. 增加CPU负载 运行大量计算密集型任务&#xff0c;例如&#xff1a; 使用多线程循环执行复杂计算&#xff08;如数学运算、加密解密等&#xff09;。运行图…...

自然语言处理——循环神经网络

自然语言处理——循环神经网络 循环神经网络应用到基于机器学习的自然语言处理任务序列到类别同步的序列到序列模式异步的序列到序列模式 参数学习和长程依赖问题基于门控的循环神经网络门控循环单元&#xff08;GRU&#xff09;长短期记忆神经网络&#xff08;LSTM&#xff09…...

【C++从零实现Json-Rpc框架】第六弹 —— 服务端模块划分

一、项目背景回顾 前五弹完成了Json-Rpc协议解析、请求处理、客户端调用等基础模块搭建。 本弹重点聚焦于服务端的模块划分与架构设计&#xff0c;提升代码结构的可维护性与扩展性。 二、服务端模块设计目标 高内聚低耦合&#xff1a;各模块职责清晰&#xff0c;便于独立开发…...

vue3+vite项目中使用.env文件环境变量方法

vue3vite项目中使用.env文件环境变量方法 .env文件作用命名规则常用的配置项示例使用方法注意事项在vite.config.js文件中读取环境变量方法 .env文件作用 .env 文件用于定义环境变量&#xff0c;这些变量可以在项目中通过 import.meta.env 进行访问。Vite 会自动加载这些环境变…...

深度学习习题2

1.如果增加神经网络的宽度&#xff0c;精确度会增加到一个特定阈值后&#xff0c;便开始降低。造成这一现象的可能原因是什么&#xff1f; A、即使增加卷积核的数量&#xff0c;只有少部分的核会被用作预测 B、当卷积核数量增加时&#xff0c;神经网络的预测能力会降低 C、当卷…...

20个超级好用的 CSS 动画库

分享 20 个最佳 CSS 动画库。 它们中的大多数将生成纯 CSS 代码&#xff0c;而不需要任何外部库。 1.Animate.css 一个开箱即用型的跨浏览器动画库&#xff0c;可供你在项目中使用。 2.Magic Animations CSS3 一组简单的动画&#xff0c;可以包含在你的网页或应用项目中。 3.An…...

WebRTC从入门到实践 - 零基础教程

WebRTC从入门到实践 - 零基础教程 目录 WebRTC简介 基础概念 工作原理 开发环境搭建 基础实践 三个实战案例 常见问题解答 1. WebRTC简介 1.1 什么是WebRTC&#xff1f; WebRTC&#xff08;Web Real-Time Communication&#xff09;是一个支持网页浏览器进行实时语音…...