入手了一套Avada主题,到现在研究了半天,总算把一些基本的设置给理清了,今天当做一个分享,记录下Avada主题从安装到配置网站初始化的过程,希望能帮助大家快速上手Avada。
Avada作为themeforest销量第一的主题,虽然说看人家的demo做的网站非常的美观,但是自己拿到手上才发现有点无从下手。一个是因为这个主题官方汉化的太粗糙,只是把网站前台的部分给汉化了,后台可以说完全是英文,比起The7主题差太多,所以这里我建议如果你是新手而且目前还没有购买Avada主题的话,可以先尝试一下The7主题,也是本站目前在用的wordpress主题。第二个原因就是Avada主题选项确实有点多,感觉有的地方逻辑太多有点复杂,一些设置选项不好选择。目前也是只接触了大概一半的功能,不过网站的已经基本成为我想要设置的样子了。
关于Avada主题的初始化设置,因为是快速搭建设置,就简单介绍以下的几个网站比较基础的部分,预计把avada打造成一款偏博客类型的模板
- 激活Avada主题
- 安装必须的插件
- 修改网站logo
- 列表页的布局设置
- 修改文章页模板
还有一点就是这里我并没有使用汉化包,因为感觉有时候翻译的不准确反而造成许多的困惑,就直接使用英文的设置了
激活Avada主题
确保自己已经安装上avada主题
因为Avada的激活需要用到token,我们需要用自己的themeforest账号生成一个token
themeforeste生成token方法:
首先用自己购买avada主题的themeforest账号登陆,然后访问envato的token生成地址(envato和themeforest的账号是相通的同一家公司),
![themeforest设置token name](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
这里可以随便输入一个名字,比如这里我就叫themeforwp,和你的token没有关系,只是备注用
然后下面会让你选一些权限,直接默认即可
![themeforest生成token](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
最后同意协议打下勾,然后创建了Token,把他复制到网站后台注册即可
![Avada激活选项](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
安装必备插件
Avada需要安装2个基础插件,在后台看到有个required标签的2个就是,这个很简单,都是一键安装的
![Avada安装插件](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
开始设置网站
上边基本准备工作已经完毕,接下来就让我们开始设置网站,需要用到Avada的设置选项了,这里的设置比较多,如果自己研究的话,建议大家先不要寻找某一个特定的功能,先把大部分的选项都过一遍,看看能网站会发生哪些变化,心里有个大概的框架
![Avada主题选项设置](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
修改网站logo
网站设置logo很简单,有一个default logo,先把它删除了,再传个差不多大小的图片上去就行了
一次修改,PC端和移动端都会受到影响
![Avada后台上传logo](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
修改网站列表页布局
Avada默认的网站布局是100%的布局,给人一种很大的感觉,在一个屏幕上能看到内容非常少,所以我就打算改成列表页小一点并添加侧边栏,布局如下图
![avada Medium Alternate Right Sidebar样式](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
首先要知道一点是Avada并不是直接给出我们这个模板的,它做的只是把样式做好,然后剩下的提供给用户diy,所以我们就需要分别设置布局样式和侧边栏
设置布局类型
布局样式的选择在Blog选项,选择General Blog,可以看如下图的选项,其中Blog Archive Layout就是我们需要调整的列表页的布局,比如我这里选择 Medium Alternate 就是上图的效果,可以通过Demo里边的Blog选项预览,挑选一个最适合自己网站的排列效果
![avada设置网站布局样式](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
除了可以设置列表页的布局,首页布局可以通过上边的 Blog Layout进行设置,和列表页的选项都是同样的
设置完上边的选项后,结果是这样的,对应Demo里面的Full width
![avada 无侧边栏样式](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
设置侧边栏
因为上面的效果离我们的预期还差一点点,就是侧边栏,所以还需要设置一下侧边栏
侧边栏一般是和wordpress的小工具相关联的,想要侧边栏展示内容就要先添加几个小工具
![avada添加侧边栏小工具](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
比如这里我随便放了几个到 Blog Sidebar,这个会自动保存,拖过去就不用再管了
打开Avada的Options选择侧边栏选项,开始设置我们的侧边栏
![列表页添加侧边栏](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
先设置 Blog Archive 也就是列表页的侧边栏,这里有2个选项,一般使用第一个就够了,只有一些复杂的情况才会用到2
还有一点就是侧边栏的左右位置是在 Blog Posts 设置的,所以我们顺便把文章页的侧边栏也设置好,毕竟这2个经常是同时使用
![avada文章页添加侧边栏](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
在Blog Posts中,主要就是设置一下侧边栏的位置,Global Blog Siderbar Position 这个选项,设置完成后保存,然后就会发现列表页已经达到我们要的效果,也就是demo中的 Medium Alternate Right Sidebar
修改文章页模板
![avada文章页设置](https://www.siwihs.com/wp-content/themes/justnews/themer/assets/images/lazy.png)
关于文章页模板也没啥特别需要注意的,这里就是告诉大家在这个Blog Single Post中设置,其实最好设置一下,比如说标题位置、是否显示作者、是否允许评论等,一个个试试都知道啥意思了,最终改成自己需要的模板
到这里,网站基本的框架就算设置完成,当然还有功能我们没有使用到,以后会慢慢介绍,当然最重要的是自己探索,每个人都能设计不一样的avada主题。
查看更多Avada教程
视频教程
如果觉得图文教程太简单,推荐查看来自网易云课堂的视频教程:Avada主题教程(2021版)
这节视频教程共有238节,包括了avada的多个版本的教程
适用人群
无建站经验小白(想快速建站),设计师(不懂编程),外贸从业者
WordPress爱好者,Avada主题爱好者
声明:转载此文是出于传递更多信息之目的。若有来源标注错误或侵犯了您的合法权益,请作者持权属证明与本网联系:siwihs@qq.com,我们将及时更正、删除,谢谢。