如何使用 WordPress 创建登陆页面

您想在您的 WordPress 网站上创建自定义登录页面吗?

着陆页是高度优化的营销页面.它可以帮助企业将网站访问者转化为客户和潜在客户.

在本文中,我们将向您展示如何在 WordPress 中轻松创建登录页面.

Creating a landing page with WordPress

以下是我们将在本指南中介绍的内容的快速概览.

  • 什么是着陆页?
  • 首页和着陆页的区别
  • 使用 SeedProd 在 WordPress 中创建登录页面(推荐)
  • 使用 Beaver Builder 在 WordPress 中创建登录页面
  • 使用 Divi 在 WordPress 中创建登录页面

什么是着陆页?

着陆页是一个专门设计的页面,旨在为企业增加销售额或产生潜在客户.

它们广泛用于付费营销、电子邮件和社交媒体活动.来自这些来源的用户将首先登陆此页面,这就是它被称为登陆页面的原因.

首页和着陆页有什么区别?

主页是您网站的首页,也是用户在浏览器中输入您的域名时会看到的内容.另一方面,登陆页面可以是一个独立页面,大多数访问者从付费或第三方流量来源登陆.

您网站的主页旨在让访问者与您的网站互动、浏览其他页面、浏览产品或注册.它有更多的链接,为用户提供了更多的选择.

另一方面,着陆页也称为"挤压页",旨在提高转化率.它的链接较少,旨在让用户做出购买决定或为未来的推广提供信息.

您的网站只能有一个主页,但您可以为不同的广告系列创建任意数量的着陆页.例如:

  • 付费广告活动的着陆页
  • 为来自您的电子邮件列表的订阅者、来自社交媒体的访问者等提供的页面
  • 登陆特定产品或服务页面的用户
  • 还有更多……

话虽如此,让我们来看看如何在不需要任何 CSS、HTML 或 PHP 专业知识的情况下在 WordPress 中创建漂亮的自定义登录页面.

我们选择了在 WordPress 中创建登录页面的前三种解决方案.这些登陆页面构建器易于使用,速度优化,并且适合小型企业.您可以选择最适合您需求的解决方案.

准备好了吗?让我们开始使用第一种方法.

方法 1.使用 SeedProd 创建 WordPress 登陆页面

此方法最简单,推荐给所有用户.

对于这种方法,我们将使用 SeedProd.它是市场上最好的 WordPress 登陆页面插件,允许您创建任何类型的登陆页面,无需编码.SeedProd 还针对轻量、快速和 SEO 友好进行了优化.

首先,您需要安装并激活 SeedProd 插件.有关更多详细信息,请参阅有关如何安装 WordPress 插件的分步指南.

注意: WordPress.org 上有一个免费版本的 SeedProd 插件,但我们将使用专业版,因为它提供了更强大的功能.

激活后,系统会要求您输入许可证密钥.您可以在 SeedProd 网站上的帐户下找到此信息.

SeedProd license key

接下来,您需要访问SeedProd » Pages 页面,然后点击"添加新着陆页"按钮.

Create a new landing page

在下一个屏幕上,系统会要求您选择着陆页主题.

SeedProd 带有数十种精美的着陆页模板,这些模板针对不同的广告系列类型整齐地组织起来.只需单击以选择要用作起点的模板.

Choose a page template

系统会要求您提供页面标题并选择一个 URL.选择一个吸引人的页面标题,不要忘记在页面 URL 中添加您的目标关键字.

Choose a page title and URL

这将加载 SeedProd 页面构建器界面.这个简单的拖放构建器将在右侧显示页面的实时预览,在左侧显示一个工具栏.

SeedProd page builder interface

块是 SeedProd 中的核心设计工具.您可以使用它们来创建您需要的任何布局.您还可以使用列来并排放置块.

您只需指向并单击页面上的任何块即可对其进行自定义.您还可以拖放块以向上或向下移动它们.

Editing elements in page builder

您可以从左栏中向页面添加新块.SeedProd 带有流行的着陆页设计元素,您只需将这些元素拖放到页面上的任何位置即可.

您还可以更改背景颜色、添加背景图片、更改颜色和字体以匹配您的品牌或主题.

SeedProd blocks

此外,SeedProd 也带有"Sections".这些是登陆页面使用的常见设计区域.例如,标题、英雄形象、号召性用语、推荐书、联系表格、常见问题解答、功能、页脚等.

Reusable sections in SeedProd

SeedProd 也与 WooCommerce 兼容.这允许您创建产品登陆页面、电子商务登陆页面、销售和其他活动的促销页面.

WooCommerce blocks in SeedProd

WooCommerce 块包括添加到购物车按钮、结帐、特色产品、产品网格等.这使您能够创建真正令人惊叹的营销活动,而不会限制自己的 WooCommerce 主题.

Products on a landing page for eCommerce website

将您的着陆页连接到第三方工具

要为潜在客户生成创建良好的着陆页,您可以添加电子邮件列表注册表单,用户可以在其中加入您的简报或提供他们的联系信息.

SeedProd 使您可以非常轻松地将您的登录页面连接到常用的电子邮件营销服务,例如 Constant Contact 或 Mailchimp.只需切换到"连接"选项卡,然后选择您的电子邮件服务提供商.

SeedProd integrations

需要连接到未列出的服务吗?别担心,SeedProd 与 Zapier 合作,Zapier 作为 SeedProd 和 Zapier 上 3000 多个其他应用程序之间的桥梁.

Connect Zapier

保存和发布您的着陆页

完成页面编辑后,您只需单击"保存"按钮,然后选择"发布"即可.

Publish your landing page

发布您的着陆页将使其在您的网站上上线.

Landing page published

为着陆页使用自定义域

您是否有要用于着陆页的自定义域?

这允许您使用您的 WordPress 网站创建登陆页面、即将推出的页面、产品页面、地理定位广告活动、微型网站等,并使用自己的域名.

无需创建 WordPress 多站点网络或安装多个 WordPress 网站,您只需制作一个登录页面并将其指向您的自定义域名即可.

只需切换到页面设置选项卡,然后单击"自定义域"部分.

Add custom domain for your landing page

确保您的 WordPress 托管服务提供商允许您使用多个域,并且您已将域名添加到您的托管仪表板.

有关更多详细信息,请参阅我们关于如何为您的 WordPress 登录页面添加自定义域别名的文章.

方法 2.使用 Beaver Builder 在 WordPress 中创建登陆页面

Beaver Builder 是另一种流行的拖放式 WordPress 页面构建器.它允许您使用现成的模板轻松创建登录页面,您可以使用简单的拖放工具对其进行修改.

首先,您需要安装并激活 Beaver Builder 插件.有关更多详细信息,请参阅有关如何安装 WordPress 插件的分步指南.

激活后,您需要访问设置» Beaver Builder 页面来配置插件设置.

Add Beaver Builder license key

在"许可证"选项卡下,单击"输入许可证密钥"按钮以添加您的许可证密钥.您可以在 Beaver Builder 网站上的帐户下找到此信息.

接下来,您需要转到页面»从 WordPress 仪表板添加新页面以创建您的第一个登录页面.

Beaver Builder 适用于所有顶级 WordPress 主题.其中许多主题都带有一个登陆页面模板,旨在与页面构建器插件配合使用.通常,它们是没有侧边栏和小部件的宽布局.

如果您的主题没有这样的模板,那么您可以使用子主题自行创建一个.有关详细说明,请参阅有关如何在 WordPress 中创建全宽页面的指南.

从右栏中的"页面属性"框中选择登录页面或全角模板,然后保存页面以应用更改.

Select a theme template

您现在可以制作着陆页了.

点击帖子编辑器中的"Launch Beaver Builder"按钮以启动构建器界面.

Launch Beaver Builder

Beaver Builder 将打开您主题的登录页面模板.您需要单击屏幕右上角的添加按钮并切换到模板选项卡.

Choose page template

在这里,您会发现几个现成的模板可供选择.从组下拉菜单中选择"登陆页面",然后选择一个看起来与您的想法相近的模板.

选择模板后,Beaver Builder 将在预览窗口中加载它.

Point and click to edit

您现在可以指向并单击任何页面内容进行编辑.您可以更改文本、更改背景颜色或图像、调整行和列的宽度和高度.

您可以在模板中添加或删除内容项.只需单击添加按钮并切换到行选项卡.您可以添加单列或多列.

Add rows and columns

添加一行后,切换到模块选项卡.模块是您可以添加到登录页面的内容元素.Beaver Builder 随附所有基本模块,包括文本、标题、CTA 按钮、视频、音频、动画倒数计时器等.

Add modules to your landing page template

对设计感到满意后,您可以单击顶部的"完成"按钮,然后保存或发布您的页面.

Save or publish your landing page

您现在可以访问该页面以查看正在运行的着陆页.如果您需要调整、添加或删除任何内容,请随时再次编辑它.

Landing page preview

方法 3.使用 Divi 在 WordPress 中创建登陆页面

Divi 是由 Elegant Themes 背后的团队开发的流行 WordPress 页面构建器插件.它作为具有页面构建器支持的主题提供,您也可以将其用作独立的页面构建器.

首先,您需要安装并激活 Divi Builder 插件.

注意:如果您要安装 Divi 主题,则不需要安装页面构建器插件.只需按照我们关于如何安装 WordPress 主题的说明进行操作.

激活后,您可以转到页面»添加新页面以创建您的登录页面.在页面编辑屏幕上,单击"使用 Divi Builder"按钮启动 Divi 页面构建器.

Launch Divi Builder

接下来,您将看到一个欢迎弹出窗口来熟悉编辑器,您可以通过单击"开始构建"按钮退出它.

之后,您将看到从头开始、选择布局或克隆页面的选项.您需要单击"选择布局"按钮.

Divi layout options

Divi 附带了许多按类别组织的即用型登录页面模板.只需单击以选择要用作起点的模板.

Choose a template

在下一个屏幕上,您将看到布局详细信息和它包含的其他模板.大多数布局包将包含您可以使用的登录页面模板.

Apply layout

只需单击"使用此布局"按钮即可继续.

您可能会被要求提供您的 Divi 帐户用户名和 API 密钥.您可以在 Elegant Themes 网站上的帐户下找到此信息.

Divi 现在将从库中获取并安装您选择的布局.之后,您将在页面构建器中看到页面的实时预览.

Divi visual page builder

您只需指向并单击屏幕上的元素即可选择和编辑.对于文本元素,您只需将光标放在要编辑的文本上并开始输入.

对于其他元素,您会在屏幕上看到一个弹出窗口,其中包含尝试不同自定义的选项.

Editing elements in Divi

Divi 使用部分、行和模块来构建布局.您可以通过单击页面上任意位置的 + 图标来添加部分、行或模块.

Adding modules to your page

每个模块都有不同的设置,您可以在插入后进行自定义.Divi 为每个元素提供了许多高级选项.

Editing a module

完成编辑后,您只需单击屏幕右下角的"发布"按钮即可.

Publishing your page

您现在可以单击 WordPress 管理工具栏中的 Exit Visual Builder 按钮退出编辑器.

Exit visual page builder

构建器现在会将您重定向回登录页面的实时版本.您仍然可以通过单击顶部工具栏中的"启用可视化编辑器"来恢复编辑.

Divi landing page preview

我们希望本文能帮助您了解如何使用 WordPress 创建登录页面.您可能还想查看我们为您的 WordPress 网站带来更多流量的行之有效的技巧,或者我们对最佳商务电话服务的比较,以优化您的销售转化率.

注意:为了帮助我们的读者避免选择瘫痪,我们的文章不包括所有着陆页构建器,如 Elementor、Leadpages、Instapage、Unbounce、ClickFunnels 等.我们选择的前三个解决方案是适合小型企业的最佳解决方案,因为它们易于使用、速度优化且适合小型企业.

1
订阅评论
提醒
0 评论
内联反馈
查看所有评论