WordPress文章插入自定义HTML方法_详解

在 WordPress 中插入自定义 HTML 到或页面有几种方法，你可以根据自己的需求选择合适的方式：

方法一：使用“自定义 HTML”区块（Gutenberg 编辑器）

1. 编辑/页面：

   • 打开你要编辑的或页面。

2. 添加区块：

   • 在编辑器中，点击“+”按钮以添加新区块。
   • 搜索并选择“自定义 HTML”区块。

3. 插入 HTML 代码：

   • 在“自定义 HTML”区块中，直接输入或粘贴你的 HTML 代码。

4. 保存或发布：

   • 完成编辑后，保存草稿或发布/页面。

方法二：使用“文本”模式（经典编辑器）

如果你使用的是经典编辑器（TinyMCE），可以切换到“文本”模式来插入 HTML：

1. 编辑/页面：

   • 打开你要编辑的或页面。

2. 切换到文本模式：

   • 在编辑器上方，点击“文本”选项卡以切换到 HTML 编辑模式。

3. 插入 HTML 代码：

   • 直接在文本区域中输入或粘贴你的 HTML 代码。

4. 保存或发布：

   • 完成编辑后，保存草稿或发布/页面。

方法三：使用短代码（如果 HTML 需要复用）

如果你有一段 HTML 代码需要在多个地方使用，可以考虑创建一个短代码：

1. 创建短代码：

   • 在主题的 functions.php 文件中，添加一个函数来定义短代码。例如：

     function my<em>custom</em>html<em>shortcode() {
         return '<div class="custom-html">你的 HTML 代码</div>';
     }
     add</em>shortcode('custom<em>html', 'my</em>custom<em>html</em>shortcode');
     

2. 使用短代码：

   • 在或页面中，使用 [custom_html] 来插入你的自定义 HTML。

注意事项

• 验证 HTML 代码：确保你的 HTML 代码是有效的，以避免破坏页面布局。
• 安全性：避免插入不可信来源的 HTML，以防止 XSS 攻击。
• 主题兼容性：某些主题或插件可能会影响自定义 HTML 的显示，确保测试在不同环境下的表现。

通过以上方法，你可以在 WordPress 中灵活地插入自定义 HTML 代码。