如何使用 Element Pack 和 Elementor 在 WordPress 中创建登录页面
已发表: 2019-10-20大家好,在这篇文章中,我们将学习如何使用 Element Pack 和 Elementor Page builder 在 WordPress 中创建登录页面。 这将是一个循序渐进的教程博客,所以请屏住呼吸进行漫长的旅程。
让我们开始吧!
使用 Elementor 和元素包创建登录页面非常简单
对于初学者来说,有很多方法可以使用 Elementor 和 Element Pack 构建令人惊叹的登录页面。
我们撰写这篇文章是为了让您了解使用免费 WordPress 插件制作登录页面的最便捷方式。
是的,零成本。
我们将在这里向您展示的内容-
- 免费插件– Elementor 页面构建器和 Element Pack Pro 都有免费的插件版本,可用于 Web 开发。
- 简单的步骤——我们将以简化的方式做所有事情,不涉及任何困难的事情。
- 不需要编码知识- 我们将使用 Elementor Page builder 插件,该插件需要零编码知识作为拖放插件。 即使这样,您也不必在页面构建过程的其余部分上花费精力来编写代码。
- 创意设计- 老熊口味更好,但我们不坚持使用具有相同重复界面的旧页面模板。 我们所有的都是新鲜和创造性的布局设计。
- 更多点击率和转化率——本指南将使您构建一个不仅看起来华丽而且转化率更高的网页。
在我们进入网页制作过程之前,让我们告诉您一些关于我们将要构建什么以及使用什么工具的定义。
让我们继续前进。
表中的内容
什么是 WordPress 中的登陆页面?
您网站的主页基本上是我们在访问网站时首先看到的网站部分。 登陆页面是您需要访问者执行的特定操作的专用页面。 这是一个用于营销目的的特殊页面,可提高您网站的价值。 登陆页面旨在通过吸引更多人的吸引力和功能来影响您的点击率和转化率。
设计合理的登录页面通常比博客或促销帖子产生更多的搜索流量。 人们想要体验一些新鲜有趣的东西来获得说服力是有道理的,而登陆页面是一个完美的地方。
您可以通过多种方式设计登录页面。 一个标准的着陆页应该包含页眉、页脚、服务、常见问题、定价等。您可能认为它基本上是一个主页,但事实并非如此。
区分主页与着陆页的事实
当然,主页是您希望访问者登陆的第一个页面。
例如,主页包含整个网站结构、产品或服务的详细信息,用于向访问者介绍您的品牌。 它还鼓励人们进一步查看您的网站或其他页面。
但是我们创建登录页面以满足某些需求,例如仅在单个页面中关注某个产品或功能。
因此,大多数登录页面的内容都少于只有产品相关内容的主页。
可以这么说,我们用一种简化的方法创建登陆页面,并且没有什么闷闷不乐的,以便向访问者传达一个清晰的信息。
这就是主页和登录页面之间的核心区别。
使用 Elementor 逐步创建登录页面
现在您已经了解了登录页面的定义,是时候了解使用 Elementor 创建登录页面的过程了。
我们使用 Elementor,因为它是 WordPress 最流行的拖放页面构建器插件。
它非常易于使用,根本不需要编码知识。
这并不是我们使用 Elementor 进行 Web 开发的全部原因——
- 零分心的网站建设体验: Elementor 提供了一个完全空白的画布,因此您可以从头开始创建您的网站。 这使得专业的 Web 开发人员将 Elementor 放在首位。
- Drag-n-Drop 小部件: Elementor 由于其构建方式和提供的功能而具有高度的灵活性。 向您新设计的网站添加特性或功能只需要您通过单击光标来拖动小部件。
- 完整的站点管理: Elementor 特别提供了对登录页面布局的专用控制,使您的页面构建更加动态和专业。
- 模板和块: Elementor 对初学者很友好,并且有许多预制的模板设计,您可以导入和自定义这些设计,以便在几分钟内制作自己的登录页面。
所以,让我们继续前进。
你需要开始什么
要开始使用 Element Pack 和 Elementor 创建您的第一个登录页面,您需要事先准备好必要的东西。
你需要的是——
- 一个稳定的 WordPress 网站
- Elementor 页面构建器(免费)
- 元素包专业版
我们使用 Element Pack Pro 的原因是它有 200 多个 Elementor 的基本小部件和 2000 多个模板,可以在几分钟内成为专业人士。
这是一款传奇的 Web 开发工具,旨在让 Web 开发变得轻而易举。
您可以使用免费版本的 Element Pack Lite,它免费提供 45 多个小部件和功能。
此外,还有大量登录页面模板(超过 100 个)可供您导入并用作自己的模板。
着陆页的一部分
一个好的着陆页通常应该包含这些部分——
- 标题:您的网站徽标、主菜单和搜索栏等附加功能进入标题部分。 根据页面的其余部分,它可以是可移动的或固定的。
- 英雄部分:英雄部分填满整个屏幕,直到您的访问者向下滚动。 您必须最大限度地关注网站这一部分的细节。
- 服务部分:这是您向访问者详细介绍您的业务的地方。
- 特点:突出你有什么特点让人们选择你而不是其他人。
- 图库:用图像网格、轮播、图标、社交分享按钮等装饰您网站的图库。
- 推荐:展示人们对您的服务的评价,并赢得更多的知名度和信任。
- 注册表单:在这部分中,您需要包含一种让访问者进入您的邮件列表以供将来使用的方法。
现在,我们只需要开始在这些元素上使用 Element Pack 和 Elementor 制作我们的登录页面。
步骤 1:使用模板菜单创建登录页面
Elementor 的另一个优点是它允许您使用专用的模板仪表板控件创建页面模板。
因此,您实际上可以从一个地方将您的作品上线,而不是到处跑。
只需转到 WordPress仪表板> 模板并选择登录页面选项即可在模板菜单中添加新的登录页面。
现在,您将被重定向到模板页面的 Elementor 页面编辑器。
在这里,您可以从 Element Pack Pro 模板库中选择预制模板,也可以完全自定义。
第 2 步:准备您的设计颜色和字体
正如我们之前提到的,Elementor 提供了一个无干扰的编辑器窗口,不包括所有内容,甚至包括页眉和页脚。

您所要做的就是从页面设置中选择“Elementor Canvas”,以便开始使用全白页面。
在开始之前,请确保为登录页面设置全局颜色和字体。
这是必不可少的,因为它可以节省大量时间,而无需手动更改每个部分/元素的字体或颜色属性。
为了获得更快、更专业的设计体验,您可以在用于在 WordPress 中创建登录页面的 PC 上安装颜色选择器软件。
这有助于维持工作流程。
第三步:设计页眉和英雄页面
首先,您可以先设计标题,然后转到英雄部分的内容。
标题应包含您的品牌徽标、菜单和供用户采取操作的内容,例如搜索字段。
其次,你必须让英雄部分或标题正下方的部分保持简单。
建议对页眉和英雄页面应用类似的色调以获得更好的外观。
然后,您可以在英雄页面的中间,在漂亮的背景图像之上放置一个大文本。
背景图像应代表您的服务。
使用一个按钮完成它,该按钮可引导用户获得有关该主题的更多信息。
此时,您可以使用 Elementor 的高级选项卡为单个部分或元素设置自定义添加、边距、边框、阴影等以进行 uqiue 设计。
Element Pack Pro 有一些很棒的小部件来增强你的英雄页面的外观-
- 高级标题
- 动画标题
- 图标导航
- 滑块
- 双按钮
- 自定义轮播
Step-4: 关于我们的WordPress登陆页面
关于我们部分对您的网站非常重要,因为它包含有关您网站的核心信息,包括其目的。
尽量不要过分夸大这部分,通过将其拉伸得比必要的更长来吸引更多注意力。
您可以保留一个最小的设计或为这部分做一些广泛的事情,两者都有效。
但是,不要用太多的词,只需在 10-12 行之内完成。
这应该使访问者在没有任何压力的情况下吸收信息。
另外,您可以尝试使用 Element Pack Pro 中的这些小部件为您的网站添加额外的增强功能-
- 高级标题
- 高级图标框
- 花式卡
第五步:设计特色部分
特色部分旨在进一步引起人们对您的产品或服务的关注。
使用 Element Pack 和 Elementor 可以轻松设计着陆页的这一部分。
推荐的布局应该包括一个漂亮的大视觉表示您的服务及其特权或特征。
您应该更直接地使用特色部分,让人们清楚地了解您的服务。
这些小部件将帮助您在 Elementor 中设计令人惊叹的特色部分-
- 悬停框
- 花式滑块
- 互动卡
- 事件网格
- 图像放大镜
第 6 步:创建很棒的图片库
在登录页面的这一部分,我们将为访问者制作一个图片库。
使用 Element Pack 和 Elementor 制作的 WordPress 中的每个登录页面都应该有一个图片库,以便获得更多的曝光率并在访问者之间建立信任。
在这里,您可以使用一个不错的大标题,然后开始将图像插入到单个图像库小部件中。
此外,画廊应该有均匀间隔的图像,这样它就会看起来整洁干净。
这可以通过 Element Pack 仅使用两个小部件轻松完成 -
- 动画标题
- 高级图片库
- 图像手风琴
第 7 步:用户感言
用户推荐通过展示其他人对您的服务的评价来建立访问者之间的信任。
无论您的网站有多大或多小,在您的 WordPress 登录页面上放置用户推荐都证明在带来更多流量和潜在客户方面是卓有成效的。
Element Pack Pro 为此目的提供了专用的小部件,您可以轻松地将其放置在网站底部(功能下方)以产生积极影响-
- 推荐滑块
- 推荐旋转木马
- 社会证明
第 8 步:注册表格并联系
成功登陆页面的另一个重要部分是注册部分,用于收集访问者的联系信息以供未来业务使用。
在设置联系区域时,您应该考虑包括您的地址、电话号码,当然还有您的电子邮件地址。
同样,您必须提供一份承诺提供报价电子邮件、促销电子邮件或其他免费内容的注册表单。
这就是您需要更加注意背景、图形和其他细节以吸引人们眼球的原因。
Element Pack Pro 拥有完美的小部件来构建您的联系人和注册表单部分-
- 图标导航
- 邮件黑猩猩
- 忍者形态
额外:为 WordPress 中的登录页面添加导航样式
现在您的目标网页已经基本准备就绪,您可以使用一些技巧来充分利用它。
首先,您可以为登录页面添加一个粘性标题导航栏。
这样,用户可以随时看到导航栏并轻松切换到其他页面。
其次,您可以让导航栏消失,直到有人从页面顶部向下滚动一定距离。
这会给页面带来专业的印象,用户会喜欢它。
额外:使用登陆页面模板
正如我们之前在顶部提到的,Element Pack Pro 为用户提供了多种预制的登陆页面模板。
您可以选择免费或高级模板并自定义内部部分以制作独特的东西。
这是在 WordPress 中构建目标网页的最快方式,它看起来很棒而且很棒。
Element Pack Pro 的一些吸引人的登录页面-
- 万圣节
- 圣诞节登陆页面
- 无限的
- 五
- 新冠健康
- 巴士服务
- 新冠肺炎
- 美迪加
- 男士时尚
- 家具店
- 女装
- 公司的
把它包起来!
您喜欢为您的企业提供时尚的着陆页吗?
立即获取 Element Pack Pro,享受下一个网站项目的创意登录页面。
此外,您将获得 200 多个令人惊叹的小部件和扩展,以进一步提升您网站的功能。
只需一个插件 Element Pack Pro,一切皆有可能。
希望你喜欢这个博客。
最好的祝福
Bd主题