Elementor教程
WordPress上面有很多优秀的可视化网页设计工具（Website Builder），而Elementor更是这些页面构建器中的佼佼者，本文奶爸建站笔记将为大家介绍如何一步一步使用Elementor来设计网站。
什么是Elementor？
Elementor是WordPress平台上的一款可视化页面构建器插件，你可以不需要具有专业的编程能力，就可以通过Elementor拖拽式设计和生成网页，例如你看到的这篇Elementor教程，就是通过Elementor设计和制作出来的。
Elementor版本区别
Elementor分为免费版和高级版，高级版也就是付费版，价格为59美元/网站/年起，Pro（高级）版拥有更多的小部件、网页模板、设计素材，并且支持生成WooCommerce页面，能更加完全的定制网站外观和功能。（具体区别）
如果对网站设计要求不高，免费版的elementor就够用了，奶爸建站笔记目前使用的是elementor免费版+Ultimate Addons For Elementor 设计的。
你是否需要用到Elementor？
elementor只是众多页面构建器的其中之一，如果你还没有使用过其他的页面构建器，那么直接从elementor入手是一个不错的选择。如果你自己有对网站设计的想法，但是不会写代码，那么elementor就是你所需要的工具。
Elementor Pro破解版靠谱吗？
网上有Elementor破解版下载，在确保破解资源干净的情况下，是可以使用的。不过elementor pro激活是采用在线激活模式，破解版的elementor也只能使用元素小工具，并不能使用在线的素材，所以真的有需要，建议购买正版。Elementor Pro正版购买地址。（如果官方的售价你觉得太贵了，可以直接找奶爸购买，仅售99元/年/站点，正版保证。）
Elementor安装教程
使用Elementor的前提是你已经有了一个WordPress网站，如果还没有，请参见奶爸之间的WordPress安装教程，先搭建一个WordPress网站。
进入WordPress后台，选择插件，安装，然后搜索elementor，找到截图中的这个图标，安装并且激活。（或者从这里下载安装包后上传到网站上安装。）
安装完毕后点击激活（Activate）按钮，会出现下图。
提示你创建一个Elementor账号，免费版的话创建了也没什么意义，直接跳过就好。
如果你想要购买高级版，可以到奶爸这里购买。
让你使用它们的hello主题，这个主题是一个完全空白的主题，任何东西都要你通过elementor去设计，不建议新手使用，自己没设计功底做出来的网站会很丑。推荐使用astra这种简单的主题。
让你上传网站LOGO，如果还没准备好，也可以后面再传。
直接跳过。
激活成功后，在你网站后台左边的菜单里面，就可以看到Elementor对应的菜单入口。
提示：如果你购买了elementor Pro，那么还需要手动上传pro的安装包到插件界面安装，然后激活才能使用Pro的功能。
Elementor使用教程
安装完毕Elementor，接下来我们就一起来看看怎么使用Elementor进行网站界面设计。WordPress默认主题对于普通用户来说，想要调整的美观是比较难的事情，所以我们这里推荐大家安装Astra这款免费小巧的主题。
创建第一个elementor页面
1、在WordPress后台，选择新建，页面。
2、点击最顶上的使用Elementor编辑按钮，出现的界面就是Elementor的工作界面。
3、Elementor工作区介绍，在打开的页面最左边的，就是Elementor的小工具，带锁的就是Pro版本的功能，需要付费购买。右边就是你网站页面的可视化编辑区。
使用Elementor设计页面教程
接下来奶爸教大家如何使用Elementor来设计页面，当然，设计的前提是你知道自己要把这个页面设计成什么样子，你可以先画一个草图，然后慢慢用elementor设计出来。
使用Elementor设计页面有两种方法：1、完全自己设计；2、导入设计好的模板修改。
最基础的elementor使用方法如下：
①、在左边的这些元素，你需要使用什么，就按住直接拖动到右边的可视化编辑区域。
②、这个加号可以新增段，你可以理解成新增加一块内容区域，和上一块内容分开。
③、这里是添加模板，点击后你会发现里面分为：模块、网页、我的模板。
这些模板库里面，带有Pro标志的，就是意味着要Elementor Pro才能使用，我们这里随便导入一个网页来作为演示。
点击插入，然后需要你使用elementor账号进行连接，没有elementor账号的点击这里注册一个。
成功导入后，就如上图的样子。
我们需要修改什么地方，就点击那个区域，然后左边就会出现对应的元素设置窗口。
如果碰到不想要的部分，直接右键点击删除就可以了。
如果需要新增内容，就点击加号，然后选择段，再把要添加的内容拖进去，例如图片、文本、标题、视频这些内容。
使用现有模板库里面的页面进行设计相对来说更加简单，便于新手学习和研究，当一切就绪后，点击发布/更新按钮，就可以完成这一个页面的设计了。
免费Elementor功能增强教程
Elementor Pro的价格你觉得太贵不值得购买（找奶爸可以99元购买哟），奶爸教你几招免费获得elementor功能增强的技巧。
进入WordPress后台插件安装界面，搜索elementor之后，你会发现有很多标题带有elementor的插件，如下图：
例如我们安装Essential Addons和Premium Addons后，在使用elementor编辑器设计页面的时候，左侧的元素区域就会多出很多本身没有的功能。
一些elementor Pro上的功能，通过安装第三方Addons也可以实现，不过不建议安装太多的扩展插件，因为不同的插件会包含不同的js和css等文件，容易引起网站打开速度变慢。
Elementor Pro高级功能使用教程
虽然通过第三方插件可以扩展免费版elementor的功能，不过一些高级的功能还是没有办法替代的，这里奶爸就教大家如何使用elementor pro的一些高级功能。
使用elementor pro你可以完全从头规划你网站的各种配置，例如主题颜色、文字、排版、按钮的样式，如下图：
设置好全局样式之后，可以回到主题构建器，自己拼凑一个想要的网站设计。
可以看到，你可以自己设计网站的header、footer、Single Post、Single page等页面，如果你安装了WooCommerce电子商务插件的，那么电商页面也可以自己设计。
例如我们选择一个Header，点击创建，然后会弹出一个模板库，里面所有的预制header模板你都可以直接导入使用，不满意也可以自己手动设计。
设计好了之后，点击发布，会出现选择在哪些页面显示的选项，如下图。
你可以设置整个网站（entire site）都显示，或者只是部分页面显示这个头部布局，其他的页面也类似，这就为你网站自定义提供了很大的自定义空间。
在elementor pro的在线模板库里面包含了很多的预制模板，包括整个网站的，或者某一个部分功能的模板，使用pro都可以直接导入使用，也可以导入后自己修改。对于新手来说，无疑这是一个很强大的功能。
Elementor使用常见问答
如果你安装了专业的幻灯片插件，例如Slider Revolution这种，那么直接在编辑页面的时候，选择简码，然后把幻灯片的短代码粘贴进去就可以了。
如果你没有安装任何Slider插件，那么也可以使用elementor pro的Slider元素创建。
elementor上面的文字颜色和大小都可以单独设置，首先，找到你需要修改的文字元素，例如文本编辑器，然后选择样式标签页，就可以看到设置文字颜色和大小的地方了。
外贸网站建设上，网站的询盘表单是必备的一个需求和功能，怎么使用elementor制作联系表单呢？
首先，你需要安装一个联系表单插件，直接在后台插件库搜索contact就会出来很多免费的联系插件，安装好之后，创建一个询盘表单，然后复制短代码到Elementor里面添加简码元素即可。
页面上的跳转效果专业术语叫做锚点，这里涉及到一点html基础知识，例如这篇elementor教程的目录功能点击后可以跳转。奶爸这里使用的是文章目录插件。
不过我们也可以手动使用elementor创建锚点。点击你想要跳转到的元素或者段，然后高级里面输入一个唯一的id值。
然后在需要跳转的按钮或者连接上，输入当前文章的网址#id就可以了（id为你自己设置的那个，截图上为jump1）
网站头部和底部内容默认使用elementor是没有办法修改的，我们需要另外安装一个插件：Elementor – Header, Footer & Blocks Template，安装并且激活插件，接着就可以在主题菜单的内容区块处看到。
在elementor的左侧工具栏最底下，点击电脑图标，切换到手机端，就可以编辑网页在手机上的显示效果了。
更多elementor教程
如果有没能解答你elementor使用问题的教程，可以在本文末尾留言，我会适当更新相关操作说明到本文。
设计归档模板时，条件为作者归档。但发布后，归档页还是原主题自带的样式，自己设计的归档模版，并没有生效。不知是什么原因。条件切换为日期，模板就会生效。真是很奇怪。希望奶爸讲解一下。
我测试了下，设置之后没有问题。可能是你哪里设置的不对。Query设置根据作者筛选，日期所有，排序按照日期，倒序。设置之后多用户只显示自己设置的那个用户的文章归档。
问题已解决, 是静态的问题
安装Essential Addons插件后，左侧的elementor面板就变灰了，无法拖拽了。然后关闭Essential Addons插件就正常了，这是什么原因呢？
这种问题通常是插件兼容导致的，要具体分析才能得出结果。
汉化版能发一下吗？
官方自带汉化版，购买Pro的版本即可。
Elementor是一个页面的编辑器，我对于Elementor与Theme的关系没搞明白：
我想自建一个to B的外贸站，主要是接询盘，
1）单用Elementor免费版行么？既然可以拖拽编辑，为什么还要用theme？
2）用Elementor Pro可以替代theme么？
3）如果用flatsome，那还要装Elementor么？
4）to B的网站，需要用woocommerce么？
5）to B的网站，用什么样的组合好？Elementor + Astra?
我真的是没有搞清楚概念，麻烦奶爸答疑解惑，多谢。
1、可以
2、可以，不推荐新手这么做
3、不需要，flatsome自带构建器
4、看情况，可用可不用
5、合适自己的最合适。
elementor类似于装修队，主题类似于不同户型的房子，如果你想自己布置房间布局，那就装elementor官方的hello主题，自己设计每个房间的布局和风格等等。
多谢您，您回复得太迅速了，感谢感谢。
1）如果是to C的网站，用flatsome+woocommer，有问题么？这两者有重叠么？
2）我刚刚浏览到别的网站，它提到用Elementor Pro + Astra免费版（说是最轻），这样的组合，比只用Elementor Pro，针对to B的网站，在建站难度、美观、功能，这3方面有多少差别呢？
2c不管你用什么主题，woocommerce都必须安装的。
建站难度，美观，功能不能统一。
“建站难度，美观，功能不能统一” ？？
不好意思，没懂呀。。。
就是你想要难度低，美观，功能强大的没有。功能强大难度肯定高。美观也需要有设计功底，所以也不简单。
多谢多谢。还有最后一个问题，to B 网站，如果要做多产品打包询盘，做成quote cart那种，elementor Pro + Woocommerce + yith woocommerce request a quote , 这样组合可以么？Woocommerce是 必须的是么？只是to B，不需要实际交易，Elementor Pro可以add to cart的话，是不是就可以不用Woocommerce了？原谅我问的可能很无语，但确实疑惑，还请指教，谢谢。
你试一试就知道了。别人解释的再清楚不如自己尝试一次明白。
您说的对，多谢了。
请教一个问题，安装了elementor之后出现无法加载的现象，用安全模式也不行，这是什么原因呢
这种情况一般是网络和兼容问题，你网站服务器是哪里的，然后可以试试只激活elementor看看能不能用。
我换个网络试试，如果我想在图片上输入文字，应该怎么操作呢，或者说我想把问题放在图片上，该怎么设置？
设置某个区域的背景图片，然后前面加上文字，不影响。
好的，我试试，非常感谢你的帮助
奶爸你好，我建站的时候不管首页还是关于我们还是联系我们之类的页面点开都是首页的页面，不知道是哪里出了问题，然后我跟着网上的教程把阅读设置更改了之后首页变得不可编辑了，而且很容易卡死没办法进入网站，显示504错误，现在我懵了
这种问题单从你描述看不出来问题所在的，估计是服务器或者网站设置哪里不对引起的。
它显示的504错误过几个小时就会自动变好，又会能进入首页
504错误代表网关超时 （Gateway timeout），是指服务器作为网关或代理，但是没有及时从上游服务器收到请求。
504通常是服务器配置不当或者是网站资源占用不正常引起的服务器崩溃，原因很多。
使用elementor设计网站，首页调用文章列表，文章标题和文章日期如何做到横排，在elementor找不到设置的地方，请指教
这个取决于你安装的elementor附加组件或者主题自带的元素是否支持横排，如果不支持的话你就没办法那么设置。elementor本身是把一些代码的内容可视化了，但是如果没有那么代码，你想可视化出来的效果就没有。
请问一下页面的 download app 应该怎么去掉
你说的这个应该是你网站主题demo自带的，不看到实际页面，不知道怎么处理的。
奶爸你好，我在下载Elementor插件的时候出现HTTP 500内部服务器错误的情况，在Elementor官网注册账号时也会出错，请问如何解决。我是在本地建站的，phpstudy集成环境
本地环境的话网络可能不畅通，建议使用在线环境测试。
你好，我准备去家公司做网页内容撰写，现在公司已有自己网站B2B，Elementor插件能用上吗？
这个要看你们公司现在网站是什么程序
请问elementor账号注册总是失败？
一般注册不了就是你网络不好。可以试试用代理注册。
您好，总是提示出问题了，请再试一次。我这里再多试几次看看，也可能跟访问Google的一些相关服务产生障碍。
你好，我导入了主题模板后，用Elementor编辑网页。原本的网页的右上方有模板的logo，而我点开用Elementor编辑时，Elementor的菜单栏遮盖了logo部分，无法编辑提货logo图片。请问这种情况需要如何解决？谢谢
logo通常是在主题设置，或者单独的页头编辑里面，不是编辑某个页面的时候修改logo
奶爸，你好，初用ELEMENTOR，不知道怎么回事。
选中标题或图象需要编辑的地方，左边再选样式的时候，就不显示样式的菜单了，试过删除再安装，还是一样到选样式就卡了。
但可以增加信息，每次增加信息，都提示更新，是每次都要更新么？
你这个问题比较复杂了，没碰到过，估计单凭语言描述解决不了。
您好，想请教一下“简码”的问题：
在wp后台下载并安装了插件YITH插件，通过elementor编辑插入简码：[yith_ywraq_button_quote]
但是页面并没有生成按钮，只显示了我输入的简码本身：[yith_ywraq_button_quote]
请问这个问题要如何排查修复呢？ 谢谢！
你elementor是选择的code模块儿添加的吗？
是否有关于generateblock 和generate press 的介绍
没有，毕竟都要花钱买。目前的情况Elementor免费版就够很多网站用了。generateblock的那些效果实际上用ele基本上也都可以弄出来。
你好 网站上的破解版和那种正版的可以一个elementor账户可以支持多个网站哪个有啥区别
破解版，传上去随便哪个网站都可以用，但是只能用他的pro功能，不能用他在线的模板素材。正版的是一个网站绑定一个授权，可以用功能和在线模板库。模板库就是给你做了一些现成的模板，你可以直接点击导入到你网站上使用。
现在购买了正版，到期后不续费了，那之前建站时用的那些Pro版本的元素和模板，是不是就用不了了？
不续费就没办法编辑和升级，做好了的不影响使用。
奶爸，你好，用elementor做完前端页面后，如何调取数据库数据呢，比如要实现新闻列表和详情页动态数据，怎么实现呢？
pro好像可以调用动态数据