这问题我碰到过好多次！WordPress默认对SVG的安全限制比较严格，直接贴代码不显示大概率是下面这几个原因：

• 编辑器自动过滤：不管是Gutenberg还是经典编辑器，都会默认过滤掉可能存在安全风险的SVG代码，尤其是直接在可视化模式或者普通段落区块里粘贴时，代码会被转义或者部分元素被移除，导致SVG无法渲染。
• 主题/安全插件的额外限制：很多安全插件（比如Wordfence、Sucuri）或者部分主题会加强内容过滤，直接拦截SVG代码，防止潜在的XSS攻击。
• MIME类型限制：WordPress默认不允许上传SVG文件，虽然你是直接贴代码，但有些场景下编辑器会识别SVG的MIME类型并拦截。

下面是几个靠谱的解决办法，按安全优先级排序：

1. 使用自定义HTML区块（最简单安全） #

如果是用Gutenberg编辑器，添加一个「自定义HTML」区块，然后把你的SVG代码直接粘贴进去；如果是经典编辑器，切换到「文本」模式（别用可视化模式）再粘贴代码。这样能避免编辑器把SVG代码当成普通文本转义。

你的代码粘贴后应该是这样的（在自定义HTML区块里）：

<svg height="80" width="300"> 
  <g fill="none" stroke="black" stroke-width="6"> 
    <path stroke-linecap="butt" d="M5 20 l215 0" /> 
    <path stroke-linecap="round" d="M5 40 l215 0" /> 
    <path stroke-linecap="square" d="M5 60 l215 0" /> 
  </g> 
</svg>

2. 自定义短代码（适合重复使用） #

如果这个SVG你要在多篇文章里用，不如写个短代码，彻底绕过编辑器过滤：

1. 打开主题的functions.php文件（可以在WordPress后台「外观」→「主题文件编辑器」里找到，或者用FTP修改）；
2. 粘贴下面的代码：

function stroke_caps_svg_render() {
    return '<svg height="80" width="300"> <g fill="none" stroke="black" stroke-width="6"> <path stroke-linecap="butt" d="M5 20 l215 0" /> <path stroke-linecap="round" d="M5 40 l215 0" /> <path stroke-linecap="square" d="M5 60 l215 0" /> </g> </svg>';
}
add_shortcode('stroke_caps_svg', 'stroke_caps_svg_render');

3. 保存后，在文章里直接插入[stroke_caps_svg]就能显示SVG了。

3. 允许SVG并安全过滤（谨慎使用） #

如果需要频繁插入各种SVG，上面的方法太麻烦，可以安装专门的Safe SVG插件，它会自动扫描SVG里的恶意代码，同时允许你上传和嵌入SVG，既安全又方便。

要是不想装插件，也可以手动修改代码解除限制（仅推荐给技术人员，且确保所有SVG都是安全的）：
在functions.php里添加：

// 允许SVG上传
function allow_svg_mimes($mimes) {
    $mimes['svg'] = 'image/svg+xml';
    $mimes['svgz'] = 'image/svg+xml';
    return $mimes;
}
add_filter('upload_mimes', 'allow_svg_mimes');

// 仅管理员可直接嵌入SVG（避免普通用户上传恶意代码）
function disable_svg_content_filter($content) {
    if(current_user_can('administrator')) {
        remove_filter('the_content', 'wp_filter_content_tags');
    }
    return $content;
}
add_filter('the_content', 'disable_svg_content_filter', 0);

⚠️ 注意：这个方法会降低站点安全性，只在你完全控制内容、确保没有恶意SVG的情况下使用。

内容的提问来源于stack exchange，提问作者himanshu chandan