免费版本WordPress网站实现教程-Hello Elementor主题安装并导入模板

时间：2023-06-10 22:57:01 | 来源：网站运营

时间：2023-06-10 22:57:01 来源：网站运营

免费版本WordPress网站实现教程-Hello Elementor主题安装并导入模板：这里的说得免费不包含服务器和域名的费用，主要是通过免费的主题及插件来实现一个WordPress网站页面内容的搭建。

教程主要是通过Elementor的模板来实现的，需要了解一点Elementor使用的知识，比如：布局、基础元素的内容、样式的修改等等，来实现最终的效果。文章还包含了Header和Footer的制作。

至于WordPress安装的教程，我还是推荐宝塔，教程我也在网站做了更新，大家可以自行查阅。

1、安装主题

【外观】–>【主题】–>【安装主题】–>搜索主题

点击【安装】主题，安装之后【启用】主题

2、安装Elementor插件

安装完成之后，系统会自动提示安装Elementor插件，点击安装即可。

安装完成之后启用插件，进入插件主界面，网站左侧出现插件功能菜单。这里需要说明的是，安装的Elementor插件是免费版本的。如果你还不熟悉Elementor，可以利用入门指南进行学习，如果你已经了解并会使用Elementor，我们继续往下。

3、安装Envato Elements模板库插件

直接在网站后台插件库中搜索Envato Elements插件进行在线安装并启用。

安装完成之后，进入Free Template Kits，可以看到大概有13页的免费模板可以使用。

另外还有很多预设好的模块可以使用

4、导入模板

在Free Template Kits中找到自己心仪的末班，点击【Install Kit】安装这个模板。

安装之后点击【View kit】查看模板

我们会看到有个安装要求，我们点击【Install Requirements】查看一下安装要求。

这里提示我们有三个要求，这里我们暂时先不管。

回到查看模板页面，我们看到部分页面下面也有提示，首先标记这个页面是Pro版本的，然后告诉你需要安装Elementor Pro才可以导入这个模板页面。

但我们会发现大部分Pro版本的模板页面都有免费版本的替代母版页，那么我们只需要导入我们需要使用到的模板页面就可以了。点击绿色的导入按钮即可。

在导入前我们还可以鼠标移动到模板图片的左下方，点开预览整个页面的效果。

全部导入之后我们可以在Elementor模板功能下看到我们导入的模板。

5、创建页面并添加模板内容到页面

以创建首页为例：

1）创建一个新的页面

2）页面命名为Home

3）使用Elementor编辑该页面

4）隐藏标题

4）按照下面的步骤导入我们安装的模板

导入之后可以看到模板的内容已经被添加到我们穿件的页面中，这时我们只需要利用Elementor对页面进行修改和编辑即可。

5）保存并发布页面

6）预览页面

按照以上步骤，创建我们需要的其他页面。

6、创建网站主菜单

网站后台跑【外观】–>【菜单】–>创建菜单

浏览网站，可以看到菜单已经显示。

但网站首页并不是我们创建的页面，继续往下看

7、设置网站主页

网站后台【设置】–>【阅读】–>【您的主页显示】设置

保存之后再留言网站时，首页就是我们所创建的首页

页面创建完成之后，我们发现网站的Header部分不能自定义美化，而且网站没有固定的Footer，让我们继续往下。

8、ElementsKit Lite创建网站的Header和Footer

在线安装插件ElementsKit Lite，并启用该插件，注意这也是一个免费的插件。

1）创建网站Header

创建一个Header模板

设置Header模板的标题，类型为Header，作用于整个网站（Entire Site），激活，然后保存。

点击列表中对应的Header模板的编辑，然后在弹出框点击【Edit Content】

进入Elementor编辑状态

进入Elementor kits模板库

选择【Free blocks】，找到【Header】

选择你喜欢的模块模板，并导入

导入之后，我们还要对其进行修改。

添加菜单

选中被拖入到Header中建栏目的组件，在左侧编辑窗口，选择菜单后，我们创建的菜单会自动显示在编辑页面中

替换你的社交主页信息

替换你的LOGO信息

根据网站风格，我们再做一下颜色的修改，看一下整理效果。

2）创建网站Footer

创建Footer模板的方法和Header模板类似，类型需要选择Footer。

进入到编辑页面

在模板库中找到Footer模块

导入你喜欢的Footer模块

在对内容和颜色进行修改，最终效果

再看有效首页的整体效果