Tutorial de WordPress, Tutorial de elementos

Elementor入门教程零基础学会用Elementor建站

如何安装Elementor?

通过WordPress后台安装

第1步登陆WordPress后台在插件栏搜索Elementor点击立即安装并启用

立即安装

第2步创建一个账号如果你目前只想体验免费版请选择跳过

Elementor创建账号

第3步安装主题Elementor官方推荐了Hello它是一个轻量级的WordPress主题速度很快但就建站而言新手选Astra主题会更容易操作建议跳过

hello主题

第4步添加网站名称也就是网站主页的标题这里先跳过后续optimización SEO的时候再填写

添加网站名称

第5步上传网站Logo同上述几步一样如果没准备好就跳过后面可以随时上传或修改

上传Logo

第6步了解如何使用Elementor你会看到两个向导左边是创建页面右边是导入模板大家可以自行点击查看如果选跳过会跳转到创建页面

了解如何使用Elementor

到这Elementor就安装完了网站后台也会增加相关的设置选项下一步是熟悉它的操作界面和使用方法并用它创建网站页面

elementor设置

通过Elementor官网下载

  1. 转到 Elementor.com然后单击下载
  2. 在WordPress后台点击enchufar  >  Instalar complemento
  3. 点击上传插件然后选择你在Elementor下载的文件
file VelGqFbBiN

Elementor使用教程

使用Elementor你无需学习任何编程知识就能搭建一个高大上的网站。pero,搭建网站前最好学会它的基本操作考虑到这些我会逐步讲解它怎么使用

1. 创建页面

第1步首先在WordPress后台新建页面然后点击最上方的使用 Elementor 编辑按钮

使用 Elementor 编辑

第2步熟悉编辑器的结构一共有三个部分分别是工具栏模块可视化界面和导航器

  • 工具栏包含了大量可拖放的模块比如区块、imagen、文字按钮等
  • 可视化界面编辑页面时能实时知道页面发生了哪些变化
  • 导航器从上至下显示页面元素的排版方便调整各模块的顺序
elementor编辑器

第3步点击加号选择你要的结构确定同一行或同一列大概要放多少个区块

elementor区块

Entonces,将左边工具栏里的模块拖放到右边的区块中比如标题、imagen,按钮

拖动elementor模块

第4步点击右边的蓝色虚线框选择你已添加的模块可以修改模块里的内容

编辑区块内容

第5步点击左下角的设置修改页面布局为全宽以后可以单独调整每个区块的宽度

elementor宽度

第6步使用预览查看页面的实际样子确认无误后点发布至此页面就创建成功了

elementor发布页面

页面发布后如果这个页面是网站主页你可以到WordPress后台设置 > 阅读将这个页面设置成静态首页并保存更改以后访问域名就会显示该页面

2. Elementor Pro

在免费版的基础上Pro增加了很多高级功能其中最有用的是模板和主题生成器另外还包括更多的模块着陆页面弹出窗口等接下来我就教大家如何使用Pro

第1步首先去官网购买Elementor Pro然后在网站后台添加插件上传安装文件点击立即安装并启用如果觉得官网太贵也可以联系一灯正版授权费用合理

elementor pro安装文件

第2步安装好插件你会在右上角看到一个激活提示请点击“连接并激活”按钮

连接Elementor pro

第3步查看激活状态Active即是已经激活后续可以在线更新导入海量付费模板

激活elementor pro

3. 导入模板

Elementor升级Pro版本附带了大量的模板导入后能大幅简化建站流程这是免费版和Pro的最大区别也是新手之所以能零基础建站的关键所在

第1步打开Elementor页面编辑器点击右下角的文件夹图标进入模板库

导入模板按钮

第2步选择模板如果遇到自己喜欢的可以点击图片上的放大镜进行预览

预览Elementor模板

第3步点击绿色的“插入”按钮一键在线导入模板

导入模板

第4步模板导入后你会看到一系列已做好的模块接下来要做的是自定义设计它们

导入后的Elementor模板

4. 自定义设计页面

Elementor中的每一个模块你都可以进一步自定义它们更改其内容排版或样式把它们设计成你想要的样子具体的操作方法如下

更改布局

点击蓝色虚线框上方的六个点内容宽度选方框就可以调整整个区块在页面中的宽度

调整内容宽度

更改结构

同样是点击六个点在布局的下方找到结构可以更改区块中各模块的结构比例

调整结构比例

修改文字

文字类的模块比如文本和标题只需点击对应的模块就能修改里面的文字内容

修改文字

编辑图片

点击图片模块能替换或删除图片也能自定义图片尺寸对齐方式添加链接和字幕

编辑图片

修改颜色

点击你要修改的模块在样式里有颜色设置选项

修改颜色

删除模块

如果遇到自己不喜欢的区块或模块可以鼠标右键点击删除

删除模块

响应模式

点击左下角第四个图标就可以进入响应模式自定义平板和手机端的页面布局

响应模式

站点设置

最后要做的是点击左上角的菜单设置站点基本元素比如全局颜色字体主题风格站点标识和背景等虽然你也可以等网站建完再弄但先设置也并没有什么坏处

站点设置

其中的站点标识可以自定义Logo站点名称和网站描述

站点标识

至此如何自定义设计页面就介绍完了接下来的事情无非是重复导入模板保留你想要的删除你不要的并不断的改进和完善最后把剩下的模块组合到一起变成自己的

5. 添加页眉和页脚

设计好页面把它们分门别类添加到WordPress菜单接下来使用主题生成器添加网站的页眉和页脚了下面是详细的操作步骤

第1步点击网站后台的模板 > Themebuilder(主题生成器)

主题生成器

第2步点击 Header 或 Footer 旁边的+号如果遇到错误可以通过更换主题解决

添加页眉和页脚

第3步点击文件夹图标添加页眉或页脚的模板

导入页眉页脚模板

第4步选择页眉页脚的样式并一键导入

选择页眉页脚模板

第5步自定义页眉和页脚里的元素修改好之后点击发布并选择整站显示

自定义页眉页脚

6. Elementor扩展

Elementor是一个很棒的页面编辑器它提供了很多功能但在使用上它有一些不完美所以我们还要安装第三方主题插件进一步扩展它的易用性

主题扩展

我强烈推荐你使用Astra它的一个巨大优势是可以导入完整的网站模板而不是一个简单的单页模板易用性和建站速度方面会更胜一筹

主题扩展

插件扩展

Elementor有很多好用的第三方扩展插件比如 Essential Addons 和 Astra UAE它们带有上百个模块可以帮助你更好的设计网站

插件扩展

Elementor常见问题

Elementor免费吗?

Sí,它有免费版但也可以付费升级到Pro价格从每年 59 美元到 399 美元不等

Elementor速度快吗?

它的速度很快但前提是要搭配好用的WordPress主机

Elementor好用吗?

Sí,该编辑器操作界面直观非常适合刚学建站的个人或中小企业使用

Elementor适合谷歌优化吗?

Sí,它的代码干净整洁对 SEO 友好很多知名的英文网站都在使用

Resumir

搭建网站不是一件容易的事情但还好我们有 Elementor 可以使用

通过本教程我相信你已经掌握了如何使用它建站如果你后续还有什么问题可以联系我们也可以阅读我们的外贸建站教程全流程完整指南内容更系统更完整

Acerca de Departamento editorial

El personal editorial de Kuajinggu es un equipo de expertos en WordPress.,Dirigido por Dylan,en WordPress、anfitrión virtual、comercio electrónico、Más de 10 años de experiencia en SEO y marketing.。kuajinggu fue creado en 2014 Año,Actualmente, el sitio web de recursos de WordPress gratuito más grande de la industria.,A menudo conocida como la Wikipedia de WordPress.。

Deja una respuesta