美好的明天
分享改变,记录生活
美好的明天
当前位置: 首页 > CoreNext, WordPress > 正文

WordPress 强制转义code标签里的字符 避免代码被执行

前言

在 WordPress 开发中,我们常常会遇到需要在文章或页面中展示代码片段的情况。为了准确地展示这些代码,我们通常会使用 <code> 标签,使用代码高亮插件将代码包裹起来。然而,当代码中包含一些特殊字符,如 [、]、< 和 > 时,可能会引发一些问题,因为这些字符在 HTML 中有特殊的含义,可能会被浏览器错误地解析。本文将详细介绍如何使用 PHP 代码在 WordPress 的 functions.php 文件中处理这些特殊字符,确保它们能正确地作为普通文本显示。

效果演示

修改前

在文章编辑器里有代码

前端页面会执行导致错位

在正常情况下,如果不进行特殊处理,WordPress CoreNext主题 使用代码高亮的 <pre class="corepress-code-pre"><code></code></pre><code></code> 标签,若在代码高亮功能中添加类似于 [adminonlyshow] 和 [/adminonlyshow] 则会被识别为短代码并执行,而不是将其作为普通的代码文本显示。同样,代码中可能包含的 < 和 > 字符也可能会被浏览器解析为 HTML 标签,其实这部分只是用于代码高亮展示,但不修改会导致代码显示混乱,或代码复制出错。

修改后

功能测试专用文章
提取码 本页面最后更新于:'. $updated_date.',如有链接失效,您可在下方评论区留言。 本页面最 […]

修改后 code 标签内的相关代码已经可以在代码高亮插件中正常显示

通过修改后短代码仍会正常执行,但 code 标签内的相关代码已经可以在代码高亮插件中正常显示,不会被错误执行;

修改步骤

注意事项

以下修改方法仅适用于 CoreNext 的子主题 CoreNext-Child,安装方法点此查看,此处不再赘述。

由于不同主题的代码结构、样式设定以及功能逻辑存在显著差异,此方法无法确保在其他主题上直接可用。

倘若你希望在其他主题中应用,务必依据对应主题的特性自行修改、适配代码,以实现预期效果。

在操作前,请务必备份好原文件,以免出现不可挽回的错误,导致网站显示异常或功能缺失。

1 修改functions.php

复制以下代码,按图片所示,将代码放置于/CoreNext-Child/functions.php文件<?php后;

复制以下代码,按图片所示,将代码放置于/CoreNext-Child/functions.php文件<?php后;

这段代码的主要功能是在 WordPress 文章内容中,将 <code> 标签内的 [ 和 ] 、 < 和 > 字符替换为对应的 HTML 实体编码,从而避免这些字符被解析执行,而是作为普通文本显示。

代码通过正则表达式匹配所有的 <code> 标签及其内部内容,然后对内部内容进行字符替换,最后将替换后的内容重新构建 <code> 标签并替换原标签。最后通过 add_filter 函数将这个处理函数添加到 the_content 过滤器中,确保文章内容在显示前会经过此处理。

历史版本

历史版本,仅为博主保留备份,请使用上方最新版本;

强制转义文章里code标签出现的短代码等字符 v1.1 25-01-25

v1.1 25-01-25 此版本已弃用,实际使用发现短代码仍有被执行。

本内容未公开,仅限 管理员 才能查看

此部分内容可能还在编辑或修改中,暂不可访问

请稍后再试,或联系博主。


强制转义文章里code标签出现的短代码等字符 v1.0 25-01-05

v1.0 25-01-05 此版本已弃用,实际使用发现有代码被误转义,导致复制代码时无法使用。

本内容未公开,仅限 管理员 才能查看

此部分内容可能还在编辑或修改中,暂不可访问

请稍后再试,或联系博主。


温馨提示

本页面最后更新于:2025-02-05,距今已 128 天,若有链接失效或教程无效,欢迎留言反馈。

THE END

猜你喜欢

目前有 2 条评论

  1. 半夏
    板凳
    半夏

    [f=shuai]

    2025-01-27 01:30 来自:安徽
  2. CF673X
    沙发
    CF673X

    密码是什么

    2025-01-26 17:09 来自:云南

发表评论