构建WordPress页面最好用的Elementor插件及其教程

5
(1)


Elementor在2016年横空出世,把WordPress站点的网页设计水准提高了一个档次,拥有非常丰富的高级功能,无论是对入门者还是经验丰富的用户都很适用,同时也提供各种高级付费功能和API,是一个全能型的Page Builder。自从上线发布之后发展迅速,现在的用户群体已经扩大到180个国家地区,安装量超过两百万,仅WordPress插件中心就有100万以上的活跃安装,2500多个五星评价。
我们慕名而来,《构建WordPress页面最好用的Elementor插件》就让我们一窥Elementor有哪些特性和值得关注的地方。

主要功能亮点如下:

    动态实时、性能流畅的前端编辑器
    支持键盘快捷键
    专业水准的设计风格
    丰富的模板和功能模块
    支持响应式布局
    支持创建弹窗、验证等高级控件
    适用于所有WordPress主题
    支持模板的导入导出
    自定义网站的Header和Fotter(PRO版)
    支持自定义类型的布局(PRO版)

以上这些特点,已经足够说服我们使用Elementor,并且它还在不断的改进和增强,在WordPress中越来越流行。
在正式使用之前,还有必要就几个名词概念特别说明,常言道名正则言顺。
模板(Template)这个说法有点笼统,WordPress自身的主题(Theme)很多时候也被叫做模板,这种认知在大多数情况下是没有问题的,有必要提出的是Elementor中也有模板(Tempalte)这个概念,为避免行文的混淆,这里借用PPT中的概念“母版”,概念模板则单指的是Elementor的模板(Template),母版概念对应的是WordPress中的主题模板。
还有一个名词Canvas。英文中 Canvas 的意思是“画布”, Canvas 是 HTML5 中新出的一个元素,开发者可以在上面绘制一系列图形,Elementor中也引入了这个概念。这里我们可以把想象成PPT中一页页的幻灯片。
下载安装
Elementor是免费使用的,我们可以随时体验,不管是免费版还是Pro版本,都需要先安装Elementor,可直接在官网下载:https://elementor.com/。免费版本直接安装即可;如果你购买了Pro版本,需要先安装Elementor插件,然后再安装Elementor Pro插件,即使之前已有免费版也可以无缝切换到Pro版本。
注意:安装Elementor的话一定要确保符合它的环境要求,否则可能会出现意外的错误。
安装好之后我们就会在文章或者页面看到一个 “使用 Elementor 编辑” 的按钮,点击它就会进入到Elementor可视化编辑器。
页面布局
对于做产品介绍型的单页面公司官网,页面布局肯定要选择 full-width 全宽度,侧边栏什么都统统不要,这样可以最大程度的展现内容,让用户的注意力聚焦。
设置全宽度页面布局有两种方式:
第一种:在WordPress页面的母版里选择 Full-width (有的主题可能提供的全宽度布局叫做landing,但效果是一样的)。Wordpress本身的header、导航菜单、footer等全局性的元素还会保留。优点是:可以与原来的主题集成,保留导航的便捷性。缺点是如果不需要这些元素的话,那就是一个累赘。
第二种:在WordPress页面的母版里选择 Elementor canvas。这样就是完全空白的一个页面,WordPress自身所有布局元素都消失,一张白纸好作画。
两种方式都可以,具体看自己的需求,本次的案例使用的是Elementor canvas,即使没有导航也完全ok。
选择页面母版的方式如下 Pages → Add New → Page Attributes:
构建WordPress页面最好用的Elementor插件及其教程 1
如果你的WordPress主题母版不支持Full-width ,那么你可以选择Elementor canvas,或者干脆换一个主题,推荐Genesis。
选定页面母版之后, Save Draft 保存以让设置生效(这是开始使用Elementor进行编辑之前的重要步骤)。然后,点击最上面那个大大的蓝色按钮 Edit With Elementor,进入Elementor接管的地盘。
现在有了一张空白画布了,但是并不需要你完全什么都自己来画,那样还有什么意义? 点一下红色加号旁边的文件夹图标,看看有什么惊喜?

百宝箱

百宝箱


简直是个大宝库,基本上涵盖了一个产品展示网页能用到的所有功能区域,也可以在这里复用你自己保存好的模板。FREE版里面已经有很多不错的选择,当然,很多很漂亮华丽的页面布局模板和预设件是需要PRO版的Elementor,付费购买的。付费版的好处是可以节省你更多的时间,毕竟时间成本也是成本!
其它特性
Elementor除了基本的页面编辑器功能外,还有很多非常有特色的功能。导航栏是Elementor新加入的一个特性,这个导航最大的作用就是你可以在上边改变段的位置,避免了使用鼠标在页面上长距离滚动拖动。Elementor Pro中提供了幻灯片工具,只需要简单设置便能开始使用,如果你不需要比较炫酷的效果的话,Slider Revolution、LayerSlider之类的插件基本可以卸载了。Elementor内置了一个侧边栏调用小工具,你可以用它来制作自己的侧边栏小工具,Elementor制作侧边栏小工具教程。Elementor不仅可以一键开启维护模式,而且你可以使用Elementor定制自己的专属维护页面,Elementor开启维护模式教程。
Elementor Pro价格

    单个站点授权,49美元
    3个站点授权,99美元
    1000站点授权,199美元

所有的套餐都包含一年的更新和支持,Elementor Pro续费的话有25%的折扣,当然也可以选择取消续费,插件还可以继续使用,只是没有更新和支持。
和其他的页面编辑器相比,Elementor的使用范围更广,更加通用,不管你是普通的WordPress用户,还是做商业性质的网站,都可以在Elementor中找到自己需要的功能,而且使用起来也灵活,可以快速构建,也可以针对一个模块进行各种高级的设置以及自定义样式。
无论是免费版本还是Pro版本,Elementor都是非常强大的编辑器,它最大的作用是改变了WordPress的编辑习惯,有着多样的设置和人性化的编辑体验,不再需要专业和枯燥的代码来修改页面。

这篇文章有用吗?

点击星星为它评分!

平均评分 5 / 5. 投票数: 1

到目前为止还没有投票! 成为第一位评委。

As you found this post useful...

Follow us on social media!

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?

2 comments

  1. […] 修改网站页面是每个人都会做的事情,比如新建一个定制的页面,添加一个图片、按钮之类的元素到网页上,但是用代码的话非常麻烦,所以各种WordPress可视化编辑器就出现了,所见即所得的使用方式让你可以轻松的修改网页。 Elementor是目前最流行的WordPress可视化页面编辑插件,现代化的编辑方式和轻量的体验让其广受好评,在2.0版本中,Elementor更是推出了主题编辑功能ThemeBuilder,它突破了之前用户不能改变主题的限制,让人们可以使用Elementor设计自己的主题,Elementor可以让你,可视化设计页面,无需任何代码知识。使用Theme Builder改造自己的主题,自己制作各种小工具,比如侧边栏小工具、弹窗等。不管是不是必须的,Elementor都是一款值得安装体验的插件,如果你对这款插件有兴趣的话,这里可以查看更多关于Elementor的介绍,或者你也可以查看Elementor教程。 […]

发表评论

电子邮件地址不会被公开。