如何在 WordPress 中创建自定义登录页面（3 种方法）

默认情况下，访问者在您网站上看到的登录页面与管理员使用的登录页面相同。 虽然这个页面很实用，但它的设计非常基本，有很多空白区域和 WordPress 标志的正面和中心。 它对支持您的品牌或为访问者提供用户友好的体验没有多大作用。

创建自定义登录页面是您可以对 WordPress 网站进行的相对简单的改进。 根据您运行的网站类型，您的许多访问者可能会在某些时候与此页面进行交互，因此自定义 WordPress 登录页面提供了改善他们体验的机会。

在本文中，我们将讨论 WordPress 自定义登录页面的优势，介绍几种创建方法，并探讨一些用户体验和安全性的最佳实践。

为什么您可能需要自定义 WordPress 登录页面

自定义您的 WordPress 登录页面不一定是一个复杂的项目。 像将 WordPress 徽标换成自己的徽标和更改背景一样简单的调整可以大有帮助。

自定义登录页面可以更多：

• 方便使用的
• 专业的
• 视觉上吸引人
• 内容丰富
• 安全的

此外，进行这些改进既快速又简单。 通过现在花一点时间，您可以为将来使用它的每个访问者改进您的登录页面。

自定义 WordPress 登录页面的好处

现在，让我们仔细看看我们上面概述的一些优势，这样您就会明白为什么这是值得的。 默认的 WordPress 登录页面非常简单：

如果您是唯一看到它的人，那么默认登录页面就可以了。 但是，如果您的观众经常使用它来登录，那么您肯定可以进行一些快速升级。

将品牌添加到登录页面会让人感觉它属于您的网站，并提供更专业的外观。 访问者应该认识到它是您网站的自然和有意构建的部分 - 而不是事后的想法。

此页面也是与您的受众分享新闻和其他信息的绝佳机会。 例如，您可以包含一个部分，您可以在其中发布更新供访问者在登录时浏览——有关您的组织的新闻、新产品、推荐信或您想分享的有关您公司的任何其他内容。

一个好的登录页面的重要特征

虽然一个网站的登录页面可能看起来与另一个网站非常不同，但它们都倾向于共享一些共同的功能。 显然，所有登录页面都需要访问者登录的方式，无论是通过传统的用户名和密码组合还是第三方身份验证。

拥有重置密码或查找用户名的链接也是标准做法。 此链接通常会将人们带到不同的页面，他们可以在其中输入他们的电子邮件地址以接收检索或重置其信息的说明。 忘记密码？ 链接通常位于数据输入字段和登录按钮附近。

为了保护您和您的访客，设置一些基本的安全功能也是明智之举。 例如，您可能希望更改管理员登录您网站的方式，以防止未经授权的尝试。

如果您的网站从其用户那里收集任何个人信息，您需要特别注意保护这些帐户免受机器人和黑客的攻击。 CAPTCHA 技术、双重身份验证 (2FA) 和反网络钓鱼通知是您可以采取的一些措施来保护您的用户。 稍后我们将更详细地讨论这些选项。

如何创建自定义 WordPress 登录页面（3 种方法）

幸运的是，创建 WordPress 自定义登录页面比您想象的要容易得多。 在几分钟内，您可以添加您的徽标并进行其他简单的更改。 在几个小时内，您就可以拥有一个完全自定义的登录页面，这将改善您的访问者的体验。

以下是创建自定义 WordPress 登录页面的三种流行方法：

1. 使用 SeedProd 创建一个 WordPress 自定义登录页面

SeedProd 插件是一种自定义登录页面的直观方式。 您还可以创建自定义 404 页面、维护模式页面、“即将推出”页面和其他登录页面。

请注意，404 页面和登录页面模块需要 SeedProd Pro 计划。 要构建您的登录页面，只需按照以下步骤操作：

第 1 步：安装并激活 SeedProd Pro

首先，转到仪表板中的Plugins页面，然后选择Add New 。 搜索 SeedProd 并免费安装。 安装完成后，点击激活按钮。

接下来，您需要升级到高级计划。 为此，请单击SeedProd选项卡中的Get Pro 。 这会将您重定向到他们的网站，您可以在其中购买高级版的激活密钥。

第 2 步：使用登录页面模板创建登录页面

激活 SeedProd Pro 后，将鼠标悬停在SeedProd选项卡上并选择Landing Pages 。 在以下屏幕上，您将看到四个模板。

选择设置登录页面以使用预构建的模板自定义您的新登录页面。 然后您将被带到编辑器，您可以在其中设计新的登录页面。

SeedProd 编辑器的行为很像 WordPress 块编辑器，允许您轻松添加和修改页面的各个方面。 由于您选择了登录页面模块，因此您已经拥有内置登录页面的所有必要功能。

其中包括用户名和密码输入框、记住我复选框、密码重置链接、图像和背景。

您可以使用块编辑器添加其他文本、图像、表单等，就像使用普通帖子一样。 只需根据自己的喜好自定义此页面，然后单击屏幕右上角的保存按钮。

第 3 步：激活您的新登录页面

保存设计后，退出编辑屏幕并返回仪表板中的SeedProd Landing Pages屏幕。 将“登录页面”模块中的开关切换到“活动”，以用新设计的登录页面替换默认登录页面。

现在，注销并返回以查看它的运行情况！ 在重新登录之前测试重置密码链接和其他功能。假设您是新访问者，并考虑是否可以采取任何措施来进一步改善体验。

其他注意事项

SeedProd 使添​​加图像和其他元素变得非常容易，就像使用块编辑器一样。 重要的是要考虑所有可用的选项，看看是否有任何元素对您的登录页面有效。

您的登录屏幕也不必随着时间的推移保持不变。 您可以考虑定期发布更新的销售图片或特色内容建议。 当人们返回登录时，您可以利用这个机会推荐新的或流行的内容。

当然，您还需要使用公司的调色板和字体来使所有内容与您网站的其他部分保持一致。 使用 SeedProd，您可以轻松地更换页面的背景，因此可以随意创建一些设计并根据季节或您认为合适的方式轮换它们以保持新鲜感。

2. 使用 LoginPress 修改您的登录页面

如果您正在寻找对预算更友好且更直接的东西，LoginPress 是一个方便的免费插件，您可以使用它来自定义您的登录页面。 它缺少 SeedPod Pro 的一些功能和润色，但向 WordPress 全站点编辑器添加了功能，可以轻松自定义您的登录页面。 只需按照以下步骤使用它：

第 1 步：安装并激活 LoginPress 插件

从仪表板的插件页面中，选择添加新并搜索“LoginPress”。 安装并激活插件以开始使用。

在此阶段无需升级 LoginPress，但您可以稍后选择加入一些高级功能。 对于大多数登录页面，免费版本就足够了。

第 2 步：使用定制器修改您的登录页面

安装并激活 LoginPress 后，您将在 WordPress 仪表板的左侧看到一个新选项卡。 将鼠标悬停在LoginPress选项卡上并选择Customizer以修改您的登录页面。

您将被直接带到完整站点编辑器中的登录页面。 您将看到以下功能的图标：

• 更改徽标
• 自定义表单（用户名和密码）
• 自定义按钮（登录）
• 自定义导航（丢失密码？）
• 更改页脚
• 更改模板
• 换背景

只需选择相应的铅笔或画笔图标即可修改该元素。 您只需点击几下即可轻松更换徽标、上传自己的背景或更改表单和登录按钮。

您不会像使用 SeedProd Pro 中的块编辑器那样拥有编辑此页面的完全自由，但这对于绝大多数登录页面来说应该是足够的自定义。 在左侧菜单中，您会注意到完整站点编辑器中的一个新LoginPress选项卡，它添加了更多功能。

第 3 步：探索其他功能并考虑升级

某些功能仅适用于 LoginPress 高级计划，例如 reCAPTCHA 模块。 对于大多数中小型 WordPress 网站，免费版本足以创建自定义登录页面。

所提供的功能使您可以轻松快速地更改登录页面的许多方面，而无需任何编码。 您将来始终可以选择升级到 Pro 版本，因此请随时从免费版本开始，看看它是否适合您的需求。

建议的修改

如果您选择这种自定义登录页面的方法，那么更换徽标可能是您要做的第一件事。 只需单击默认徽标旁边的蓝色铅笔图标即可上传您自己的徽标。

接下来，您可以尝试其他一些模板，看看它们是否适合您的风格。 如果没有，您可以随时上传自己的或使用您品牌的原色创建背景。

然后您可能会考虑更改实际表单中的字体或文本以与您网站的其余部分保持一致。 您还需要确保所有链接都正常工作。

3.使用自定义代码修改您的登录页面

最后，如果您不想使用插件，您还可以使用代码自定义登录页面。 这需要更多的技术知识，但确实提供了最大的灵活性。

究竟如何使用自定义代码调整登录页面取决于您。 让我们看一个您可能想要进行的简单更改的示例。

假设您想用自己的图形手动替换登录屏幕上的 WordPress 徽标。 这对于初学者来说可能看起来很吓人，但对于任何熟悉访问其网站文件和基本代码操作的人来说并不难。 只需按照以下步骤操作：

第 1 步：备份您的网站

每当您手动修改站点上的文件或文件夹时，最好创建一个备份。 一次意外按键可能会破坏您的网站。

定期进行全站点备份总是一个好主意，尽管您至少应该为您计划修改的任何文件制作副本。 在这种情况下，您将对functions.php文件进行更改。

第 2 步：创建并上传您的徽标

当然，您将需要您的徽标图像来替换默认图像。 将您希望使用的图像上传到您的媒体库。

虽然理论上您可以将图像设置为任意大小，但大约 300 像素宽的尺寸非常适合默认登录表单。 我们将使用 300×300 像素的示例来制作方形占位符图像。

您可以在 WordPress 之外调整图像大小，或在媒体库中这样做。 要执行后者，只需在图像上传后单击图像，然后选择右侧缩略图附近的编辑图像。 您可以选择尺寸并单击缩放以调整其大小。 然后保存图像并继续。

下一步您将需要图像的 URL，因此单击将 URL 复制到剪贴板按钮或保持此窗口打开。

第三步：修改functions.php文件

接下来，您需要找到您的functions.php文件。 为此，请通过文件传输协议 (FTP) 访问您的主题文件夹。 此文件夹应与您的主题同名，并位于您网站的wp-content文件夹中。

要在登录屏幕上交换 WordPress 徽标，请将此代码添加到其中的functions.php文件中。 为了避免把它放在另一个脚本的中间，你可以简单地将这个片段插入到文件的最后部分代码的下面：

 function wpb_login_logo() { ?> <style type="text/css"> #login h1 a, .login h1 a { background-image: url(YOUR IMAGE URL HERE); height:300px; width:300px; background-size: 300px 300px; background-repeat: no-repeat; padding-bottom: 10px; } </style> <?php } add_action( 'login_enqueue_scripts', 'wpb_login_logo' );

将您从上一步复制的 URL 粘贴到此处的“您的图像 URL”占位符的位置。 这将用您的图像替换 WordPress 徽标。 进行这些更改后，请务必保存functions.php文件。

第 4 步：访问您的登录页面

注销以返回您的登录页面。 如果您已经在登录屏幕上，则需要重新加载页面才能看到更改。

您应该看到您的徽标代替旧徽标。 如果尺寸看起来不合适，您可以通过更改代码片段中的高度、宽度和背景 px 值轻松调整尺寸尺寸。

如果有任何问题，只需恢复备份即可恢复更改。 您还可以使用之前创建的备份副本覆盖您的functions.php文件。

如何保护您的 WordPress 登录页面

在实施自定义登录页面时，您需要注意一些事项，以确保您网站的安全和健康。 登录页面是黑客和机器人的主要目标，因此将其牢牢锁定至关重要。 这里有几种方法可以做到这一点：

双重身份验证 (2FA)

双因素身份验证（也称为 2FA）大大降低了帐户被黑的机会。 使用 2FA，除了需要用户名和密码外，当访问者尝试从新设备或未注册设备登录时，还需要第二种形式的身份验证。

例如，如果黑客能够获取您的一个用户的登录凭据，他们可以简单地登录到该帐户并造成严重破坏。 有时，黑客只能根据用户名猜测密码。 实施 2FA 后，还需要第二种形式的验证。

通常这是以电子邮件或文本的形式发送给帐户持有人，以确认他们正在尝试登录。由于黑客不太可能也可以访问用户的电子邮件或设备，所以这一切都只是确保用户是真实的。

2FA 通常可以通过允许用户注册设备来加速，因此来自该来源的登录尝试不需要每次都进行验证。 有许多可用的插件可让您在您的网站上设置 2FA。 如果您的网站处理任何类型的敏感或财务信息，这一点尤其重要。

验证码和重新验证码

猜测登录凭据的一种方法是使用机器人蛮力攻击您的网站。 换句话说，程序会自动尝试猜测常见的用户名和密码组合，直到成功。 这对人类来说似乎是一项艰巨的任务，但机器人可以快速自动地完成这项工作，无需人工干预就能猜出数千个常见密码。

验证码的目的是阻止这些机器人进行登录尝试。 您可能已经遇到过这些测试。 它们过去常常以扭曲的词的形式出现，你必须破译并输入一个盒子。

更现代的验证码涉及选择包含特定对象（如汽车或烟囱）的图片。 这些测试对于机器人来说很难解决，因此可以有效地阻止暴力破解尝试。

reCAPTCHA 是这种技术的一种高级形式，可以在几乎没有人类用户输入的情况下阻止机器人。 LoginPress 在其 Pro 版本中包含 reCAPTCHA 技术，或者您可以找到特定插件或更全面的安全工具中包含的 CAPTCHA 应用程序。

反钓鱼通知

窃取登录凭据的低技术策略是模仿权威来源并简单地索取它们。 这被称为网络钓鱼。

例如，有人可以使用您或您公司的名称创建一个电子邮件地址，然后发送一封电子邮件，要求提供登录凭据以解决问题。 如果电子邮件和地址令人信服，有些人可能会上钩并做出回应，从而泄露他们的帐户信息。

防止这种情况的一种方法是发布反网络钓鱼通知，宣布您和您的公司永远不会要求提供此类信息。 任何此类电子邮件或消息都应被视为垃圾邮件并被忽略。 登录页面上的简单通知可能意味着成功的网络钓鱼尝试和安全帐户之间的区别。

把你最好的脚向前

虽然很容易忽略它并专注于您网站的其他方面，但自定义您的登录页面是一个值得的项目。 自定义登录页面可以改善用户体验，为您的网站提供更专业的感觉，并用于共享重要信息。

您可以使用以下方法更改您的 WordPress 登录页面：

1. 使用 SeedProd 之类的插件创建一个全新的登录页面。
2. 使用 LoginPress 等免费工具修改您的登录页面。
3. 使用代码进行手动更改，例如更换默认徽标。

为了充分利用您的登录屏幕，插件可以轻松地按照您的需要自定义页面。 在某些情况下，这是访问者首先看到的页面之一，因此让它看起来最好是很重要的！