写文章
Kevin023
2019-07-19 19:01

【AVADA】产品展示-Master Slider

商城式Slider.png

如图所示,大家在建站的过程中一般想要做出和商场一样的有大小图的响应图片展示,当鼠标点击到小图时,上面就会展示响应的大图。Avada自带的Post Slider可以达到类似的效果,无奈bug和无法编辑,所以基本上排不上用场;而Layerslider和Slider Evolution等强大的插件虽然可以达到这样的效果,不过体量和加载占用比较大,所以一般比较慎用,所以这边给大家推荐一款体量小,加载快的slider,Master Slider插件。废话不多说,进入正题:

首先到插件/Plug的设置里Add New,如图

Plugin_-_Add_New.png


搜索Master Slider并安装激活(第一个紫色的)

Master_Slider_-_Search.png


Master_-_Slider_Setting.png


左下角点击Master Slider,并点击Create New Slider

Create_New_Slider.png

接下来有三种可以选择:

免费的Custom Slider - 空白Slider模版,完全自定义

免费的Sample Slider - 简单的排版,可以用来学习研究一开始设置效果

付费升级的Pre-bulit Slider - 丰富多变的展示形式

Custom_Slider.png

Slider_Types_02.png

正常前两者够用了,而且作为产品展示的也基本上足够了;当然有预算的也可以选择升级付费的,29美金的费用也不算高

接下来我们通过custom slider来了解下基础的设置

Slider_Types_01.png

首先是基础的设置 - SLIDER SETTINGS,具体项目都有在图片中标注了

Slider_Setting_01.png

Slider_Setting_02.png

Slider_Setting_03.png

接下来是图片Slides的设置,点击加号可以添加要上传或者媒体库的图片,图片要保持一致的尺寸,比例需要和setting设置的长高比例一致(防止失真或者显示不全)

Slides_01.png

可以通过control或者shift键来选择多张图片


Slides_02.png

每张图片的设置情况如下:

Slides_03.png


这里的Link代表点击这张图片会跳转到的链接,一般作为产品展示比较少用到,可以放空

Slides_04.png

Slides_05.png

接下来的Slider Control是重点

Slider_Controls_01.png

具体实例对应的三种效果

实例.png

重点讲下Thumblist(Tab一般少用,有兴趣的可以自己试下)

Slider_Controls_05_-_Thumblist.png

Arrows和Bullets

Slider_Controls_03_-_Arrows.png

Slider_Controls_04_-_Bullets.png

还有最后的callbacks,一般可以默认放着不动

Slider_Controls_06_-_Callback.png

补充:关于Lightbox的功能(点击图片可以实现大图查看)

Master_Slider的Lightbox功能.png

设置好了之后可以preview看下效果,并且Save Changes,然后复制shortcode,然后用Code元素或者text block元素黏贴调用,保存更新就可以显示了!

short_code.png

code_block.png

text_block.png


以上就是基本上的操作介绍了,来上个实例展示下:

实例2.png

具体链接:https://www.kevinswp.com/portfolio-items/bypass-shower-doors-els08-1/

那么最后我们来总结快速做一个产品Slider的步骤

  1. 创建Custom Slider,添加/上传处理的图片(SLIDES选项)

  2. 设置产品的尺寸和模式,同时做好命名和其他设置(SLIDER SETTINGS)

  3. 添加Arrows, Bullet, Tumblist并做好设置

  4. 后面批量操作只要copy下之前建好的,然后替换图片就可以快速添加更多的Slider了


以上就是Master的基本介绍和使用了,有什么疑问的可以评论或者私信我,对你有帮助的话给个赞吧~


举报
收藏
转发
0/500
添加表情
评论
评论 (3)
最近
最早
3天2夜学会建站

Kevin023

Wordpress建站相关,SEO优化,建站方案

向TA提问
置顶时间 :

设置帖子类型

普通
新闻
活动
修改

圈内转发

0/104

分享至微信

复制链接

举报

请选择举报理由

留联系方式
垃圾广告
人身攻击
侵权抄袭
违法信息
举报

确认要删除自己的评论吗?

取消 确定

确认要删除自己的文章吗?

取消 确定
提问
设置提问积分
当前可用积分:
-
+
20
50
100
200
偷看

积分偷看

10积分
我的积分(可用积分)
确认偷看

问题已关注

答主回复后,系统将通知你

不再提示