惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

G
Google Developers Blog
F
Fortinet All Blogs
Microsoft Azure Blog
Microsoft Azure Blog
腾讯CDC
Vercel News
Vercel News
Recent Announcements
Recent Announcements
博客园 - Franky
小众软件
小众软件
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
The Cloudflare Blog
宝玉的分享
宝玉的分享
I
InfoQ
博客园 - 聂微东
Jina AI
Jina AI
J
Java Code Geeks
V
V2EX
U
Unit 42
Stack Overflow Blog
Stack Overflow Blog
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
阮一峰的网络日志
阮一峰的网络日志
L
LangChain Blog
T
The Blog of Author Tim Ferriss
量子位

周良 Len

先做成一门生意,再谈增长 给朋友们的 AI 使用建议 内部分享 PPT 与文档:浅析 SEO 排名优化技巧 内部分享 PPT 与文档:浅析 SEO 排名优化技巧 使用 Cloudflare Workers 为 Bento.me 设置自定义域名 使用 Cloudflare Workers 为 Bento.me 设置自定义域名 Crypto 阅读列表 Crypto 阅读列表 Atomicals 挖矿程序部署与钱包管理 Atomicals 挖矿程序部署与钱包管理 Starknet 早期社区成员计划申请指南 Starknet 早期社区成员计划申请指南 如何绕过烦人的 hCaptcha 验证 如何绕过烦人的 hCaptcha 验证 白话比特币原理及运作机制 白话比特币原理及运作机制 什么是产品人? 什么是产品人? 独立博客三大乐趣:主题、域名、建站程序 独立博客三大乐趣:主题、域名、建站程序 麻将 麻将 2020.10.15 杂记:有钱人的定义、iOS 工作日智能闹钟、iPhone 12 2020.10.15 杂记:有钱人的定义、iOS 工作日智能闹钟、iPhone 12 公司五行论与组织六元拟人指标 公司五行论与组织六元拟人指标 修真世界 修真世界 玩法分析:让人停不下来的抽奖活动 玩法分析:让人停不下来的抽奖活动
WordPress 文章内容自动为 a、p 等标签插入指定 Class 方法
周良 Len · 2020-07-31 · via 周良 Len

上周在写个主题,因为引用了开源的 CSS 框架,各类前端标签添加 Class 就行,比较简单。但写到文章内容的时候就有问题了,内容都是 WP 自己输出的,我控制不了所使用的 Class。

问了一下 @desin(我爱水煮鱼博客作者) 有没有不写 js 去添加 class 的方式,desin 提到可以看一下 content 的文档。研究了一下,问题解决。

代码丢上来,仅供大家参考,复制下面的代码丢到主题 function.php 文件的 <?php 下面一行即可 :

# 文章内 img 标签自动添加 img-res Class
function img_paragraph($content){
    return preg_replace('/<img([^>]+)?>/', '<img$1 class="img-res">', $content);
}
add_filter('the_content', 'img_paragraph');

同理,你要控制 p 标签的话,代码如下:

# 文章内 p 标签自动添加 mt1em mb1em lh-180 三个 Class
function p_paragraph($content){
    return preg_replace('/<p([^>]+)?>/', '<p$1 class="mt1em mb1em lh-180">', $content);
}
add_filter('the_content', 'p_paragraph');