如何在 WordPress 中创建自定义主页

用户经常问我们是否可以在 WordPress 中创建自定义主页。

默认情况下,WordPress 在主页上显示您的博客文章。但是,作为一个商业网站,您可能希望创建一个更具吸引力的主页,以帮助用户找到他们需要的内容并提高您的销售转化率。

在本文中,我们将向您展示如何在 WordPress 中轻松创建自定义主页。我们将展示多种方法,您可以选择一种对您来说更容易的方法。

在 WordPress 中创建自定义主页

什么是主页?

主页是默认的介绍页面或网站的首页。这是当有人在浏览器的地址栏中输入您网站的域名时出现的页面。

主页示例

主页的主要目的是向用户介绍您的网站或业务。理想情况下,它应该为用户提供有关您的业务的基本信息,以便他们可以继续浏览您网站上的其他页面。

默认情况下,WordPress 会在主页上显示您最近的博客文章。这不好,因为它只显示了您当前的一些文章。

如果您经营一个商业网站,那么默认主页不会告诉用户您的业务、产品或服务。它也没有为用户提供与您联系的方式。

好消息是 WordPress 已经内置了创建自定义主页的功能。

在 WordPress 中选择要用作主页的自定义页面

WordPress 允许您轻松地将网站上的任何页面用作主页。您可以简单地转到WordPress 管理区域内的页面»添加新页面来创建一个新页面。

让我们给这个页面一个标题“主页”并发布它。您将使用此页面作为您的自定义主页。

现在不要担心布局或设计。我们将在本文后面向您展示如何设计您的主页。

现在,如果您想在您的网站上运行博客,那么您需要创建一个单独的博客页面来显示您的帖子。

再次,转到页面»添加新页面并创建一个标题为“博客”的页面。继续并发布空白页。

创建页面后,您需要访问WordPress 管理员中的设置»阅读页面。从这里选择“您的主页显示”部分下的“静态页面”选项。

选择主页和博客页面

接下来,您需要选择您之前创建的主页和博客页面。

不要忘记单击“保存更改”按钮来存储您的设置。

现在您已经设置了一个用作自定义主页的页面,让我们开始为您的 WordPress 网站设计自定义主页。

方法 1. 使用 Gutenberg 在 WordPress 中创建自定义主页

WordPress 于 2018 年 12 月推出了一种新的基于块的编辑器,称为 Gutenberg。这个新编辑器允许用户不仅可以编写内容,还可以创建漂亮的布局。

它为每个内容元素使用块,使您能够组织内容块以创建您喜欢的页面结构。

WordPress 包含可用于设计目的的块,例如封面图像、列、表格、文本和媒体、画廊等。

使用 Gutenberg 编辑您的自定义主页布局

每个块都有自己的设置,允许您自定义其外观以满足您的设计要求。

您可以使用Gutenberg 块插件扩展可用块,以向您的武器库添加更多块。这些插件允许您使用高级元素,如推荐、滑块、服务和其他常见设计功能。

使用高级块库插件制作主页布局

您还可以使用Gutenberg 就绪的 WordPress 主题,让您更灵活地使用块。

我们推荐使用Astra,它带有 Gutenberg 网站模板,您可以使用他们的Astra Starter Sites插件进行安装。

导入模板后,您可以使用默认的 WordPress 编辑器对其进行编辑,并为您的网站创建一个外观非常专业的主页。

方法 2. 使用页面构建器在 WordPress 中创建自定义主页

这种方法非常简单,不需要任何编码或设计技能。对于这种方法,您将使用WordPress 页面构建器插件。

页面构建器插件允许您使用简单的拖放界面轻松创建自定义页面布局。

我们推荐使用SeedProd,因为它是市场上对初学者最友好的页面构建器插件。它带有许多模板并提供多种自定义选项。

在本教程中,我们将使用SeedProd Pro版本并向您展示各种高级模板和自定义选项。还有一个免费版本,但模板和功能的选择有限。

首先,您必须在您的网站上安装并激活 SeedProd Pro。您可以按照我们关于如何安装 WordPress 插件的分步指南进行操作。

插件激活后,您将被带到 WordPress 管理面板中的 SeedProd 页面,您需要在其中输入许可证密钥。您可以在您的 SeedProd 帐户区域找到密钥。

输入您的许可证密钥

输入密钥后,继续并单击“验证密钥”按钮。

接下来,您可以导航到SeedProd » Pages以创建主页。只需单击“添加新登录页面”按钮即可开始。

在 SeedProd 中创建新的登录页面

在下一个屏幕上,您可以从主页模板中进行选择。SeedProd 提供了许多专业设计的模板,您可以根据自己的业务需求进行自定义。

要选择模板,只需将鼠标悬停在模板上,然后单击橙色的勾号按钮。

选择主页模板

现在将出现一个弹出窗口,您需要在其中输入着陆页模板的名称并编辑其 URL。完成后,继续并单击“保存并开始编辑页面”按钮。

输入主页的名称

接下来,您将被带到 SeedProd 拖放页面构建器,您可以在其中以您想要的方式自定义您的主页。

该插件提供了可以添加到现有模板的不同块。例如,您可以拖放按钮和图像等标准块,或使用倒计时、联系表格等高级块。

使用拖放构建器添加块

除此之外,您还可以单击模板中的现有块并对其进行编辑。您可以更改它们的颜色、字体、文本、对齐方式、大小等。

编辑模板上的块

完成自定义主页后,不要忘记单击“保存”按钮来存储您的更改。

之后,您可以前往“连接”选项卡并集成不同的电子邮件营销服务。SeedProd 支持 Drip、Constant Contact、AWeber等流行平台。

连接电子邮件营销服务

接下来,您可以转到“页面设置”选项卡以发布您的自定义主页。只需单击页面状态切换按钮即可将其从草稿更改为发布。

发布您的主页

“页面设置”选项卡下还有更多选项。例如,您可以更改 SEO 设置、编辑页面标题、添加脚本和连接自定义域。

更改页面设置后,继续并关闭登录页面构建器。

接下来,您需要导航到设置»阅读并告诉 WordPress 使用新创建的登录页面作为您网站的主页。

在“您的主页设置”部分下,继续并选择“静态页面”选项。然后从“主页”的下拉菜单中选择您的自定义主页。

选择静态页面设置并选择您的自定义主页

完成后,保存您的更改并访问您的网站以查看新的自定义主页。

自定义主页示例

方法 3. 在 WordPress 中手动创建自定义主页(需要编码)

不建议初学者使用此方法,因为它需要编码。您需要熟悉 WordPress 编码实践、PHP、HTML 和 CSS 才能使用此方法。

让我们看看这是如何工作的。

您的 WordPress 主题由不同的文件组成。其中一些文件称为模板并控制网站某些区域的显示。有关更多详细信息,请参阅我们的WordPress 模板层次结构备忘单。

这些模板之一称为front-page.php。如果您的主题有此模板,那么 WordPress 将自动使用它来显示您的自定义主页。

front-page.php 模板

但是,如果您的主题没有它,那么您可以为自己创建一个/

只需创建一个空白文件并将其保存为front-page.php。之后,您需要使用 FTP 将其上传到您的WordPress 主机帐户上的当前主题文件夹。

上传此文件后,WordPress 将开始使用它来显示您的主页。但是,由于此文件完全为空,您将看到一个空白页。

要解决此问题,您可以开始添加 HTML 代码以显示自定义主页的内容。一种更简单的方法是使用 WordPress 主题中的现有代码和模板。

例如,您可以使用相同的页眉和页脚。WordPress 让包含这些模板变得非常容易。

这是一个示例代码,我们删除了内容和侧边栏,同时保留了主题中的标题和导航模板。

    

>     

     You custom homepage code goes here     

     

//Fetch the theme footer template

在 WordPress 中制作有效的自定义主页的提示

您网站的主页是您网站上最重要的页面。用户查看它以了解有关您的业务、产品和服务的更多信息。

我们建议您的主页设计尽可能简单。在我们自己的网站上,我们了解到我们的用户发现更简单的布局更有帮助。

尽量避免混乱,但不要隐藏用户希望在主页上看到的重要信息。您还需要优先考虑哪些内容首先出现在您的布局中。

在为您的网站制作自定义主页之前,写下您想要实现的目标。本练习将帮助您提出明确的设计目标。

对于大多数企业和博客而言,首要目标是将网站访问者转化为客户。为此,您需要OptinMonster。

它是最好的 WordPress 弹出插件和潜在客户生成软件。它可以帮助您将网站访问者转化为订阅者和付费客户。

接下来,您需要跟踪自定义主页的执行情况。为此,您需要在您的网站上安装 Google Analytics 。它可以帮助您了解您的用户来自哪里以及他们在您的网站上做了什么。

您还希望让您的用户更容易与您联系。为此,您将需要WPForms插件,它是市场上最好的 WordPress 表单插件。

您还可以在您的网站上添加点击通话按钮,这样人们就可以轻松拨打您的商务电话。

最后,我们建议您环顾您的竞争对手和您所在行业/利基市场中的其他热门网站。我们不是要您复制他们的设计,而是要从他们的最佳实践中学习,然后将其应用到您自己的主页布局中。

我们希望本文能帮助您轻松地在 WordPress 中创建自定义主页。您可能还想查看我们经过验证的增加博客流量的技巧。