FAQ
FAQ的页面FAQ对于任何的网站
你只要是在网站上销售东西的
销售产品的网站来说呢
FAQ它是一个必须要有的一个页面
而且在谷歌的呃结构化数据当中呢
它本身也有专门针对于FAQ的
一个结构化数据的
你可以将这个页面呃
类似于说你贴一个标签
然后呢
你通过加一段呃那个JSON的代码
然后呢你可以让这个页面
变成一个FAQ的一个呃
标签属性的页面
这样的话
也有助于谷歌的搜索引擎来去呃
锁引你的这个页面
并且把它会把这个页面呃
归类为一个FAQ的页面
那么我们现在来去做这个FAQ的页面
嗯我们常规来说呢
可能大部分的网站
FAQ页面就比较简单
它就是一个标题
然后下面是FAQ啊
那我们今天也做一个相对简单的版本
那我们现在呢来去做这个页面啊
在page这里
我之前已经创建好了这个页面
只是他目前是一片空白的
可以看是这样子的
然后呢我先点击打开这个页面
来到后台之后呢
这里我们点击Edit with elemental
好那么嗯
为了好看点
我还是选择给他加一个banner的图
那这个banner
我就其实可以沿用我们之前创建的
产品分类页的
斑斑的嘛
只是我再再把图片换一换
但是为了确保样式都一致呢
我是不是还是什么
就是直接在那个模板里面
把这个相应的容器给复制粘贴过来
对吧好
我打开之前这个啊
正好是产
品页面的啊
模板用elemental打开
打开之后呢
我们将这个banner的这个部分
这个容器直接复制
然后呢在FAQ的页面我粘贴过来
粘贴过来
我先publish一下
看一下啊
他的这个banner已经出现了
但目前没有标题的
好我把标题再改掉
这个是product title
我选中标题
先删掉然后呢我拖一个
直接拖一个heading过来
这个heading
给他定为H1
因为你这个页面需要有个H1的啊FAQ
然后居中
文字的颜色改成白色
好publish好
在前端刷新一下
好FAQ了
然后把图片换一下
选中容器
在style这里
背景换掉
换一张换这个图片
好publish
然后呢
我们现在在下面要加一个面包屑导航
啊记住就是我们面包屑的导航
其实应该是除了你的首页以外
其他的页面如果你要加
那你就应该都加
啊
也且而且就是在不影响美观的情况下
建议都加上
因为实际上这会更加有助于用户
以及啊
搜索引擎去理解你的网站结构啊
然后呢我的这个面包学导航
我又是从这个模板这里
直接是复制粘贴过来的
那么因为这个面包屑导航
它其实也是动态的
所以大家看
我虽然是从这个product page
就刚刚那个产品详情页的模板
复制粘贴过来
并且在编辑模式下呢
看到它也是显示home all products tense
但是我点击publish一下
然后呢我在前端刷新一下
可以看到它这个面包车导航
它其实是自动的会
调整这个结构的啊
它它其实也是动态的
好所以这里啊
我刷新一下吧
好那么这里它显示home FAQ了
然后呢我们接下来就增加FAQ的这个
呃内容
那么FAQ其实我们常用的
就是前我们在首页上加的那个FAQ
呃大家看一下首页上我们这个FAQ
其实我们用的是一个叫做accordion的
一个啊sorry
不是首页
记错了是在产品分类页面上
产品分类啊
页面上有一个
我们加了一个这个啊
FAQ的这个叫accordion的
然后是这个空键
呃所以我们在FAQ这个页面里面呢
我们先增加一个容器宽度调整一下
然后呢我们往里面加一个叫做accordion
这里我们在页面的编辑界面
我在空键左边
空键里面
我输入accordion呢
它这里出现两个都可以用
一个是这个accordion
然后呢
我们再把另外一个空间也拖过来
大家看一下
另外一个呢叫toggle
这两个都是可以用的
其实都是
在我看来都是一样的
而且你这两个
你都可以给他去加那个FAQ的这个
这个scheme嘛
就是你给他加这个结构化数据
呃都一样
那么呃
如果我想要在这个项目里面
增加丰富多彩的一些元素
加图片啊
加其他的空间
加图呃
文本等等
加各种各样的自定的内容
这个怎么做
还记得吗
呃之前讲过的是在我们elemental的设置
elemental的
设置里面
features这里有一个叫做nested elements
好那我们现在把它打开
好吧我比如说我想
在里面就是呃我
我还是再给大家演示看一下吧
因为可能大家对这个不太熟悉
容易忘我给他呃
Nested elements改成active之后呢
我来点击一下保存
我们再来到FAQ的这个编辑页面
我先点击publish好
我刷新一下
再来看一下这个空间
里面显示的元素是怎么样的
我先删掉
然后我重新加according
现在我们看到
我就可以往里面拖拽一些widgets
并且呢大家看到
当我在elemental的setting这里
就是我把nested elements打开之后呢
我再搜according
就是这个
之前显示这个toggle就没有了
只有这个according
好那么这个accordion内容我就不加了
但是大家只要知道
其实你要用哪个元素就可以了
如果你只是一个问题一个回答
那么你就将这个nested elements就改成def
就可以了
在def啊
改成inactive
然后呢我给他保存一下
然后我这里先刷线一下
好然后呢
我是如果只是问答
问答那就是一个问题
这里是标题
是问题下面是回答
呃我这里内容我就不加了
然后呢我多加几个项目
好然后我发布一下前端
我看一下
FAQ它这里是这些项目
但是我们FAQ的页面
是不是就真的只要加FAQ啊
如果你真的只加FAQ
那么你也太实诚了
对吧那为了SEO
其实啊我一再就强调SEO
就是你的内容一定要丰富
那么那我
虽然这个只是一个FAQ的页面
那我是不是也可
以加一些其他的东西啊
比如说我能不能在FAQ前面
我呃再加一段文本呢
我这个文本里面可以再次的去呃
描述一下我们的产品的特色啊
或者是我们的一些理念啊等等
就是一些呃
虽然看似虚头巴脑
但是呢
但是用户跟啊
搜索引擎都是还看了之后
他们会觉得啊蛮喜欢的一些话语
对吧
当然这就是这些所谓的虚头巴脑
不是真的虚头巴脑
而是你要带有一些营销性质
带有一些品宣性质的一些语言
就好比这个呃
我们的这个产品分类页啊
我们要加这个什么environment
friendly high quality
cost efficiency啊
下面加上一段这个话
对但其实这都是一些营销标语
因为
如果你去看一些优秀的网站的话呢
他们其实是很注重
这样的一些内容的
他们可能啊不会那种一整块长篇大论
但他们会经常会在网站的某一些部分
他可能出现一个小的section
也就是小的一个模块
模块当中呢
他可能会概括性的写一些他们的特色
优势等等
所以我们在fake里面
我们也应该要去增加一些
这样的一些内容
那文本内容我就不加了
但是我就是
我把这个文本的这个空键加进来
我前端刷新一下就是呃
我提醒大家
就是这里你应该要加一些营销标语啊
我这里写一下啊promotional
slogan and
and introduction and introduction
就你应该加一些这种一些营销标语
而且呢
最好你的形式呢可以丰富一点
不要吃那种啊
一段话就好
像就好比说这样子
你可能适当的有一些排版
会比较好一点
呃因为我们浏览网页
跟我们读文章不太一样
文章的话呢
我们当然是文字
但是浏览网页
其实有时候我个人觉得
有时候其实会跟看PPT有点像
你不需要那种一个页面好多文字
但是你可能需要就是图文
还有一些好看的排版
然后呢让用户能够一目了然啊
其实有点触类旁通吧
我觉得所以FAQ的页面
你这里也应该要加一段
就是类似这样的一些营销标语
然后呃
你在这个营销标语加完之后
你是不是还可以再加加点别的东西
比如说呃
你同样可以再加一点
用户的一些流评啊啊
或者说你可以有一些推荐产品啊
或者说你可以再放一些呃
news文章啊等等
我下面加一下
比如说我加一些review
比如说我再加一个什么
我我
比如说我加一个嗯对
好我们加一个我们的partner
对吧用户啊
我们的合作伙伴
我加一个空间啊
合作伙伴们
怎么加就是合作伙伴
一般就是一个呃
标题our our Partners
对吧然后我们的合作方
然后接下来是他们的logo
那么我们要用到这个空间
这个空间叫做carousel
这里有一个叫做image carousel
image carousel
好把
把它拖过来
好这里呢
我可以加一些logo
那么我没有别的logo
我就加我们自己的logo啊
1234 好
加4个logo
insert gallery好
这里呢我们这里可以就加上
我们的一些合作伙
伴对吧当然上面还缺一个标题
呃标题我加一个heading
heading给他拖过来heading比如说our partner
好然后呢
呃这个这个三个空间的间距太大了
我给它调整一下
每一个空间距都有点大
啊尤其这个
我上下各给它调调一下哈
我统一都调上上边距吗
上面的外边距
把上面这个FAQ的也上面调一下30
然后呢our partner这里
然后上面顶部也调整一下30
好然后我们那这个呃image image carry数呢
你这里可以增加无数张的图片然后呢
你这里可以控制它在一个页面上
显示的图片数量
大家可以看到啊
这里有一些相应的设置
那么第一个设置这里呢
叫做image resolution
就是你的图片的像素
你可以呃这里
其实一般建议最高MI media
其实可能都有点太大了
就是用thumb
thumbnail
就是用用最小的那个像素的就好了
因为logo你放大了不好看对吧
然后呢slide to show这里呢
你可以就呃这个
就是呃
它这里同时显示的有几张缓顿片
那么我比如说我想让它显示4张
好那显示5张没用
因为我一共就加了4张对吧
呃好那他这里5个也可以
因为我这里设置的是INFINITE Loop
应该就是它可以无限循环的
所以就是如果你1234
那第五张它可能就是一这样子的
然后呢slides to scroll
就是每一次呃
滚动的时候是显示几张啊
给大家演示看一下啊
比如说我这里啊3张那么如
果你这里slides to scroll你设置了2
那么它其实每次呢是滚动跳两张的
但是默认就是一嘛
我们就DEF默认就好了
然后下面这些就是你呃
箭头他是箭头跟下面下面的小点
比如说我不要下面这些小点了
我只要一个箭头
那你就选一下
然然后呢
包括这个部分
你要不要加一些链接
就是我们的每一张媒体上面啊
每一张图片上面
其实我可以加
就是你
你可以选择当用户点击图片的时候呢
要不要他跳出
呃这里是选择跳出图片
或者说跳出一个呃
custom UIL比较常用的是media fire
就是当用户点击这个logo的时候呢
他点出来哎
他会出现这个logo
那么但一般我们如果用来说
合作伙伴的LOGO展示
这里其实link就不需要了
然后其他的这里还有一些呃
additional的一些一些选项
额外选项就是你要不要lazy low
lazy low就是图片揽加载
建议开启就是
lazy low其实是为了帮助你提升
网站的这个加载性能的
它可以让图片
不要一下子就全部都加载出来
它可以当你鼠标往下滑到
这个section啊
这个部分的时候
它图片再去进行加载
就是大概是这样的一个作用
它可以帮你提升网站的加载速度
然后呢呃
你要不要自动播放
然后呢鼠标放上去的时候呢
要不要暂停啊
还有什么播放速度等等这些设置
其实跟我们设置网站那个轮播图
banner图其实是一样的
然后它的样式这里
你在style这里你可以研究一下
可以去设置
你可以去为它的这个箭头去单独设置
颜色啊
这些图片和一些对齐的位置啊
空间等等都可以去设置好
那么我们这里就不设置了
我们点击publish
然后在前端看一下
好那么前端呢就是首先这里有一了
有了一段标语
然后接下来是这个我具体FAQ的内容
然后呢是用户的评价
我们的合作伙伴对吧
然后在下面可以加一个什么
加一个比如说啊
加一些news好了啊
我把这个标题复制一下
然后呢标题改成news
latest
最新发布的文章好了
latest post对吧
然后我们再加一个空键
这个空键加什么
你可以就加post
这里有个叫做post的一个控件
这个可以直接用这个post
你给它拖过来
拖过来之后呢
它这里就是呃
自动的会显示你你的一些文章
那么你可以设置你是发布呃
让他这里显示最新发布的
还是怎么样的
都可以然后你可以
这里一些文章的相应的样式
你都可以去去调整
那么呃我先加上去
因为我目前文章库里面没有任何文章
所以他就是一个默认的hello world啊
这个之后
我们在做博客
文章的一些分类页面的时候呢
我们再来去详细的讲
怎么去设置这些文章的卡片显示
但是在FAQ这里呢
就是你可以呃
根据你的这个情况
就是为了让页面看起来丰富一点
我们可以多一些内容
而不是一个简单
的一个FAQ的问答
可以让呃内容做的丰富
其实也是为了要引导用户
能够去更多的去呃
在网站上产生一些点击跟交互
因为用户在网站上跟我们产生的呃
点击交互越多的话呢
他其实就越能表明
他对于我们网站的内容他有兴趣
也也是越有利于我们的一些转化的
好呃
那关于FAQ的页面
我们就是publish之后呢
然后我们再来最后预览一下
好那么这个FAQ页面
那么我们就这样做完了
其实最核心的是这个部分
是这个部分
这个叫做accordion的这个空间
并且呢
这里记得要将这个accordion选中之后
左边这里最下面有一个FAQ schemer
最好是给他勾上
因为你这个页面
而且就是你的这个部分section
它就是一个FAQ
