新手指南：如何将网页代码片段粘贴到 WordPress 中

你是否曾经在网上找到过一段很有用的代码片段，但却担心将其添加到你的 WordPress 网站中？你并不孤单。

对于经验丰富的用户来说，在 WordPress 主题文件中复制粘贴代码似乎很容易，但对于初学者来说却可能令人望而生畏。

在 WPBeginner，我们发布了大量 WordPress 教程 ，指导读者如何在网站上添加代码片段。因此，我们经常收到用户的提问，他们担心自己会搞砸，这完全可以理解。

这就是我们编写本指南的原因。在本文中，我们将向您展示如何从网络复制代码片段并粘贴到 WordPress 中，而不会破坏您的网站。

为什么要向 WordPress 网站添加代码片段？

WordPress之所以能成为全球最佳网站搭建平台，是因为它提供了极大的灵活性。添加新功能非常便捷，几乎可以搭建任何类型的网站。

我们会分享各种技巧和窍门，帮助您改进网站。其中一些技巧需要您向 WordPress 添加代码。

虽然向网站添加自定义代码片段是可选的，而且通常可以找到插件来完成相同的任务，但有时简单的代码片段效率更高。

通常，添加代码片段可以轻松修复许多常见的 WordPress 错误，提高WordPress 安全性，并为您的网站添加新功能。

接下来，让我们来看看如何安全地向 WordPress 网站添加代码片段。

在 WordPress 中添加代码片段的最佳方法有哪些？

需要特别说明的是，在开始向 WordPress 网站添加代码片段之前，您应该安装并使用WordPress 备份插件。

这样可以确保您的 WordPress 网站安全，万一出现任何问题，您都可以随时从备份中恢复。

在向 WordPress 添加代码片段时，您可能会找到将它们添加到 WordPress 主题模板文件（例如index.php、single.php等）的说明。

这些代码片段仅对这些特定的主题文件有用，因此您必须直接添加它们或创建一个 WordPress 子主题。

然而，大多数代码片段都会添加到 WordPress 主题的functions.php文件中。有些教程可能会建议直接添加到该文件中，但还有更好的方法，可以确保你的更改在未来仍然有效。

这样，即使您以后更换主题，您的自定义功能也不会被移除。

根据您选择哪种方法向WordPress 博客或网站添加自定义代码片段，编辑 WordPress 文件的方法也各不相同。

接下来，让我们来看看在 WordPress 中添加自定义代码片段的一些最适合初学者的方法。

方法一：使用 WPCode 插件添加自定义代码（简单）

使用代码片段插件是向 WordPress 添加代码最安全、最适合初学者的方式。

WPCode插件让您可以轻松地在网站上添加和管理自定义代码片段，而无需编辑主题文件。

它配备了智能代码片段验证功能，可帮助您避免常见的代码错误。这可以保护您在添加代码片段时不会破坏您的网站。

WPCode 还内置了一个代码库，方便用户查找所有最常用的 WordPress 代码片段。只需点击几下，即可添加这些专家编写的代码片段。

最棒的是，它允许你在一个中心屏幕上管理所有代码片段，你甚至可以使用标签来组织它们。

免费版 WPCode包含了在 WordPress 中添加自定义代码所需的一切。WPCode Pro 则提供更高级的功能，例如私有云代码片段库、转化像素、定时代码片段等等。

注意： WPCode 方法适用于需要添加到functions.php文件中的代码片段。如果要求您将代码片段添加到其他主题文件中，则此方法无效。

如何使用 WPCode 编辑和添加 WordPress 代码

如果您要使用 WPCode 插件向 WordPress 添加代码，那么您将直接在 WordPress 管理面板中添加代码。

首先，您需要安装并激活免费的WPCode插件。更多详情，请参阅我们的WordPress插件安装入门指南。

激活后，只需在 WordPress 管理后台中转到“代码片段”»“+ 添加代码片段”，然后点击“添加新代码片段”按钮即可。

这将带您进入一个屏幕，您可以在其中从预制库中选择一个代码片段，或者添加您自己的自定义代码。

要添加自定义代码，请点击“添加自定义代码（新代码段）”选项下的“+ 添加自定义代码段”按钮。

然后，从屏幕上出现的选项中选择所需的代码类型。

在本教程中，我们将选择“PHP 代码片段”选项。

在下一个屏幕上，首先给你的代码片段起个名字，以便你记住它。

然后，将代码粘贴到“代码预览”框中。

接下来，向下滚动到“插入”部分。

在这里，您可以选择将代码片段用作短代码，然后手动复制并粘贴到您网站的任何位置。

或者，您可以选择“自动插入”方法，选择一个位置（WordPress 功能），代码片段将自动插入到该位置。

您可以选择的显示位置包括：全部显示、仅前端显示、仅后台显示、全站头部显示、文章后显示、文章间显示、段落前显示等等。

WPCode 最棒的地方在于，除了各种自动插入选项外，它还提供了对初学者友好的条件逻辑选项。

这样您可以选择代码何时加载。

添加完代码后，将右上角的开关从“非活动”切换到“活动”。

然后，点击“保存代码片段”按钮。

代码片段激活后，将根据您选择的插入方式自动添加或显示为短代码。

有关详细说明，请参阅我们关于如何在 WordPress 中轻松添加自定义代码片段的指南。

如何向 WordPress 头部和底部添加代码

有时您可能只需要向主题文件中添加代码header.php。WPCodefooter.php插件也可以帮助您轻松完成这项工作。

当您需要向网站添加Google Analytics、Google AdSense、Facebook Pixel、TikTok Pixel等跟踪代码时，这将非常有用。

此外，它还允许您在一个地方管理所有页眉和页脚代码，防止任何手动错误，并让您升级或更改主题而不用担心。

注意：此方法最适用于跟踪脚本、自定义 CSS 和JavaScript 代码。

转到“代码片段”»“页眉和页脚”，然后将您的代码片段输入到您网站的页眉、正文或页脚部分。

请务必点击“保存更改”按钮，您的代码片段就会在您的网站上生效。

更多详情请参阅我们关于如何在 WordPress 中添加页眉和页脚代码的指南。

方法二：在特定站点的 WordPress 插件中添加自定义代码

另一种灵活的选择是使用网站专属的 WordPress 插件。这是一种您可以为自己的网站创建的自定义插件，用于保存所有自定义代码。

这种方法的优点在于，您的代码不依赖于主题，即使更换主题，它也能保持有效。此外，它也不会受到网站WordPress 更新的影响。

注意：此方法仅适用于需要添加到functions.php文件中的代码片段。

如果您使用的是特定站点的插件，则可以使用 WordPress 内置的插件编辑器添加自定义代码。

首先，您需要转到“插件”»“插件编辑器”，然后从标有“选择要编辑的插件：”的下拉菜单中选择您的插件。

编辑器会加载您网站的专属插件。然后，您只需将代码添加到页面即可。

完成后，请务必点击“更新文件”按钮保存更改。

如果你的代码中缺少某些内容或者某些内容可能会导致网站崩溃，那么插件编辑器会自动撤销你的更改。

您还可以通过 FTP 向特定站点的插件添加自定义代码。更多详情，请参阅我们的WordPress FTP 文件上传入门指南。

只需使用您喜欢的FTP 客户端打开您的网站，然后右键单击插件文件并选择“查看/编辑”选项即可。

这将打开文件，以便您添加代码片段。保存并再次上传文件后，更改将自动显示。

方法三：向 Functions.php 或其他主题模板添加自定义代码

最后，直接将代码片段添加到主题functions.php文件中也是可以的。但是，我们建议使用上述其他方法，因为这种方法存在一些缺点。

首先，如果您更新了WordPress 主题，那么您所做的所有更改都将丢失。

其次，你添加的代码只有在使用该特定主题时才会生效。

话虽如此，我们还是来看看如何正确复制粘贴代码片段，避免破坏您的网站。

如果您要将代码片段直接添加到主题文件或任何其他页面模板中，则可以在 WordPress 管理面板中导航至“外观”»“主题编辑器”functions.php来添加代码。

然后，您可以从右侧栏中选择文件，它将在编辑器中打开。

你正在学习的教程会告诉你应该在哪里添加代码片段，但如果没有，那么你需要将代码添加到文件底部，位于所有现有代码的下方。

另一种方法是使用WordPress主机的文件管理器通过 FTP 向主题文件添加自定义代码。

只需使用 FTP 客户端连接到您的网站，然后转到wp-content » themes » your-theme-folder，右键单击需要编辑的文件。

然后，点击“查看/编辑”选项，在文本编辑器中打开文件并添加代码片段。

添加自定义代码时 PHP 错误排查

初学者在向WordPress 网站添加自定义代码片段时常犯一些错误。幸运的是，大多数此类错误都可以轻松避免和修复。

让我们一起来看看这些错误以及最佳的解决方法。

1. PHP 开始和结束标签使用不当

WordPress 主要使用PHP编程语言编写，PHP 具有特定的语法，用于告知服务器接下来的代码需要由 PHP 处理。以下是一个典型的 PHP 代码片段示例：

// PHP Begin Tag
<?php
   
// Rest of the code goes here
   
// PHP End Tag
?>

所有的 PHP 代码都需要放在 `<head>`<?php和 `<body> ?>` 标签内。

在PHP和HTML之间频繁切换的文件中，PHP结束标签非常重要。这包括大多数同时使用PHP标签和HTML的WordPress主题文件。

如果您将代码粘贴到 PHP 起始标签未闭合的位置，则需要确保添加代码时不包含 PHP 起始标签。

<?php
// Some pre-existing code
  
// your custom code
  
?>

如果您将自定义代码粘贴到 PHP 结束标记之外或之后，则还需要添加 PHP 开始标记。

<?php
// Some pre-existing code
?> 
  
// Your custom code snippet
<?php 
  
?>

几乎 90% 的错误都是由 PHP 开始或结束标签位置不正确引起的。查看您的代码可以帮助您了解是否需要在自定义代码片段中添加 PHP 开始或结束标签。

然而，许多 WordPress 主题文件functions.php可能根本没有 PHP 结束标签。这意味着您可以将代码添加到文件末尾，而无需添加开始标签或结束标签。

以下是一个例子。

<?php
// Lots of code in your theme's functions.php file
//
//
// Your custom code
function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_loginlogo');

请记住，有些教程可能假定您已经知道如何使用 PHP 的开始标签和结束标签。因此，它们可能只会向您展示一段没有这些标签的代码片段。

function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_loginlogo');

有时给出的代码片段可能会被添加到多个位置，因此不会包含 PHP 的结束标签和开始标签。

在主题文件中添加此类代码片段时，需要确保它位于 PHP 标签内。

2. 嵌套错误

PHP 对函数、条件逻辑和循环有一套特定的语法。这种语法依赖于花括号，花括号用于指示函数的开始和结束。

例如，以下是一个简单的 PHP 函数：

<?php
function wpbeginner_tutorial() {
echo "Hello World!";
}
?>

现在，如果您想添加一段与此函数无关的自定义代码片段，则需要将其放在此函数之外，如下所示：

// Pre-existing code in your theme file
<?php
function wpbeginner_tutorial() {
echo "Hello World!";
}
// Your custom code
function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
</style>';
}
?>

如果缺少起始或结束花括号，代码就会出错，最终会出现错误页面。

了解 WordPress 中的 PHP 错误

在 WordPress 中添加自定义代码时，如果出现错误，通常会生成详细的错误信息。其中大多数是语法错误、解析错误或由于包含意外字符而导致的致命错误。

好消息是，这些错误会告诉你代码中哪一行导致了错误。

然后，你就可以跳转到那一行代码进行检查，找出你遗漏了什么。

为此，我们建议使用专业的文本编辑器进行代码编辑，因为它们具有行号和语法高亮显示功能，可以帮助您轻松解决问题。

如果您使用的是WPCode插件，它还带有精确的错误报告功能，可以显示发生错误的确切代码行。

当 WPCode 发现可能导致您无法访问网站管理区域的错误时，它会自动禁用代码片段，以便您可以安全地修复该问题。

当您的 WordPress 网站无法访问时该怎么办？

首先，深呼吸，不要惊慌。你网站的所有文件都还在，你可以访问它们。

只需使用FTP 客户端或WordPress 主机帐户cPanel 中的文件管理器应用程序连接到您的网站即可。

接下来，找到你添加了导致错误的代码的文件，并打开它进行编辑。

然后，您可以尝试修复代码片段中的问题。如果无法修复这些问题，只需删除您添加的代码片段并保存更改即可。

现在，您的网站应该恢复正常了。如果仍然出现错误，请下载一份全新的 WordPress 主题文件，并将压缩文件解压到您的电脑上。

之后，找到你之前修改过的文件，并将其上传到你的服务器，同时覆盖旧文件。

如需了解更多解决这些问题的方法，请参阅我们关于最常见的 WordPress 错误及其修复方法的指南。如果问题仍然存在，请按照我们的WordPress 故障排除指南进行分步诊断。

希望本文能帮助您学习如何将网页上的代码片段粘贴到 WordPress 中。