准备工作
在调试网站之前,需要有一定的数据支撑,如果没有基础数据的支持,任何主题都是展现不出什么效果的。所以在使用主题之前,需要先创建几个网站分类和发布一些文章,这些都是最基础的操作,如果你是初次使用WordPress程序,可以参考下面的文章:
1、创建分类。
2、发布文章。
3、创建页面。
如果嫌麻烦的话,也可以直接导入我们提供的演示站整站数据,导入我们提供的数据之后,会覆盖你网站的所有内容,得到一个和演示站一模一样的网站。如果你的网站已经在正式运营且存在重要数据,不要导入演示站数据。
关于导入演示站数据,可以看这篇文章: 导入演示站数据。
菜单设置
菜单里面可以添加「分类目录」、「页面」和「自定义链接」,所以在设置菜单前,你需要创建好分类和页面。
Zing-Pro主题一共有5个菜单,分别是「主菜单导航」、「底部菜单①」、「底部菜单②」、「底部菜单③」、「底部菜单④」
1、创建菜单
如果是全新安装的WordPress,打开「后台→外观→菜单」可以直接创建菜单,菜单名字随便写个就行,比如:主菜单。
WordPress是可以创建无限个菜单的,如果网站之前有创建过菜单,需要另外创建菜单的话,可以点击「创建新菜单」。
2、添加/编辑菜单
2.1、添加菜单
从左边选择需要添加的项目(分类、页面、自定义链接),加入到菜单里面。(自定义链接:允许你添加任何链接,只需要添加链接网址就好了)
2.2、编辑菜单
菜单名字可以随意更改,还可以用拖动的方式为其自定义排序。将某个菜单项向右拖动一点,这个项目就变成了二级菜单。
2.3、菜单显示位置
编辑好菜单以后,注意勾选一下菜单显示位置。
2.4、保存菜单
最后,千万千万千万不要忘记了点一下「保存菜单」哦!!!
头部设置
1、选择头部样式
Zing-Pro主题有两种头部样式,打开「后台→外观→自定义→头部设置」,选择你喜欢的样式即可。
头部样式-1
Logo显示在左侧,菜单显示在右侧,Logo建议尺寸:240px× 80px(或同比放大)。
头部样式-2
Logo和菜单是分开显示的,菜单单独显示一行,可以显示更多的菜单,也可以设置更大尺寸的Logo,建议尺寸560px × 58px(或同比放大)。
Logo右侧可以添加公司地址和联系方式之类的信息,在选择头部样式中,选中「头部样式-2」之后就会出现「添加联系信息」的设置选项。
2、菜单设置
导航菜单请到「后台→外观→菜单」中进行设置,注意勾选一下菜单显示位置:「主菜单导航」
3、Favicon 图标设置
Favicon 图标就是显示在浏览器窗口中的图标,建议尺寸:50px × 50px。
4、搜索按钮设置
「搜索按钮」这个选项可以控制是否在菜单栏中显示搜索框,不想显示的话可以关掉。
首页设置
1、幻灯片设置
打开「后台→外观→自定义→首页模块→幻灯片设置」
点击「添加幻灯片」就可以设置幻灯片了,为了更好的显示效果,电脑端图片和手机端图片是可以分开设置的,电脑端图片建议尺寸:1920px × 700px,手机端图片建议尺寸:750px × 580px。如果希望点击图片可以跳转到其他页面,可以填写一下「跳转链接」,如果需要连接新窗口打开,可以勾选一下「新窗口打开」,如果跳转链接为外部链接的话,可以勾选一下「Nofollow」。
2、首页模块
打开「后台→外观→自定义→首页模块→首页模块」
模块动画
主题有一个稍微有一点酷的加载动画,开启后打开首页,往下滑动就能看到每个模块都有一个由下往上过渡的动画效果,这个因人而异,有的人喜欢,有的人不喜欢,大家按自己的需求决定是否开启就好了,
添加首页模块
Zing-Pro主题目前共有14个可选模块,在左侧栏点击「添加模块」,选择自己需要的模块,选中后下面就会显示相关的设置选项,下面直接上视频演示站吧。
1、新闻资讯
「新闻资讯」模块可以选择调用指定分类的文章,也可以调用指定的某几篇文章。
选择指定分类的话,一般情况下调用新闻资讯分类即可,最多显示6篇文章。
选择指定文章的话,可以手动为文章进行排序,无显示数量限制,添加几篇文章就显示几篇文章。
填写跳转链接,模块下面会显示一个「查看更多」的按钮,一般都会填写分类页面的链接。
2、TAB切换新闻资讯
和「新闻资讯」模块样式一样,不同的是,「TAB切换 新闻资讯」添加多个分类就会以TAB切换的方式展示,可自定义TAB菜单排序,TAB菜单就是分类名。
3、产品列表
「产品列表」模块可以选择调用指定分类的文章,也可以调用指定的某几篇文章。
选择指定分类的话,一般情况下调用产品分类即可,最多显示8篇文章。
选择指定文章的话,可以手动为文章进行排序,无显示数量限制,添加几篇文章就显示几篇文章。
产品图片就是文章缩略图,文章缩略图的显示规则是:文章特色图片》文章内第一张图片》文章默认图片。
文章特色图片在编辑文章的时候,右侧栏可以设置特色图片。
文章默认缩略图在「后台-Zing主题-网站优化-其它设置-文章默认缩略图」,当没有设置文章特色图片,同时文章内又没有图片的时候就会显示默认缩略图。
图片尺寸也可以自定义,一般都是1:1的尺寸,比如:500 × 500,如果你需要调整图片高度,可以设置为:500 × 800,等等….自己试一下就知道了。
填写跳转链接,模块下面会显示一个「查看更多」的按钮,一般都会填写分类页面的链接。
4、TAB切换产品列表
和「产品列表」模块样式一样,不同的是,「TAB切换 产品列表」添加多个分类就会以TAB切换的方式展示,可自定义TAB菜单排序,TAB菜单就是分类名。
5、关于我们
「关于我们」模块通常用于企业介绍,左侧特色图片+右侧介绍文本,或者右侧特色图片+左侧介绍文本,建议图片尺寸:540px × 400px,或者根据自己的需求来调整图片尺寸。
当然,这个模块并非局限于公司介绍,这种样式用来做产品特点介绍也是可以的。
6、特点介绍
「特点介绍」模块通常用于产品特色介绍或者服务项目等,支持自定义图标,支持添加跳转链接和更改图标配色。
7、产品轮播
「产品轮播」模块可以选择调用指定分类的文章,也可以调用指定的某几篇文章。
选择指定分类的话,一般情况下调用产品分类即可,最多显示20篇文章。
选择指定文章的话,可以手动为文章进行排序,无显示数量限制,添加几篇文章就显示几篇文章。
产品图片就是文章缩略图,文章缩略图的显示规则是:文章特色图片》文章内第一张图片》文章默认图片。
文章特色图片在编辑文章的时候,右侧栏可以设置特色图片。
文章默认缩略图在「后台-Zing主题-网站优化-其它设置-文章默认缩略图」,当没有设置文章特色图片,同时文章内又没有图片的时候就会显示默认缩略图。
图片尺寸也可以自定义,一般都是1:1的尺寸,比如:500 × 500,如果你需要调整图片高度,可以设置为:500 × 800,等等….自己试一下就知道了。
填写跳转链接,模块下面会显示一个「查看更多」的按钮,一般都会填写分类页面的链接。
8、自定义图文
「自定义图文」模块可以添加两组图文,图片+标题+描述+详情链接,建议图片尺寸:560px × 315px。
9、合作伙伴
「合作伙伴」模块可以添加合作伙伴Logo,建议上传5、10、15张图片,建议尺寸 258px × 92 px(也可以根据自己的需求调整图片尺寸)。
10、服务项目
「服务项目」模块通常用于服务项目介绍或者产品特色介绍等,支持自定义图标,支持添加跳转链接和更改配色。
11、数字模块
「数字模块」可以添加4组数据介绍,支持更改自定义背景图片或者背景颜色。
12、在线留言
「在线留言」模块就是一个联系表单,姓名、电话和留言内容为必填项,邮箱选填。
支持留言邮件提醒,当有访客提交留言后,系统会向你的邮箱发送一封邮件,显示访客提交的相关信息。
留言表单左侧的图片请到「后台→Zing主题→网站优化→在线留言」中进行设置。
留言邮件提醒需要配置SMTP,可到「后台→Zing主题→网站优化→扩展功能→SMTP邮箱设置」中进行设置。
13、视频模块
「视频模块」点击「观看视频」按钮会弹出播放视频,支持自定义背景图片,支持本地视频链接和第三方视频链接,建议mp4格式。
14、自定义HTML代码
这个需要有代码基础,如果你想扩展首页模块,可以添加自定义Html和Css,关于代码就不多做介绍了,会的人一看就懂,不会的不建议使用。?
分类页面设置
分类页面在「后台→文章→分类→编辑」中进行设置,支持自定义文章显示数量。
共有6种分类列表样式可选(效果就是图片上面的样子,自己选择就好了),支持自定义Banner图片(就是分类列表顶部的横幅图片),建议尺寸:1920px × 300px。
如果勾选了「显示分类名称+描述」,Banner图片上面会显示分类名字和描述。
文章页面设置
1、编辑文章
Zing-Pro主题有2种文章页面样式(产品文章和普通文章),在后台编辑文章的时候可以自由选择。
产品文章,可以设置产品图集、产品摘要和联系方式。
文章侧栏在小工具中设置,可参考:侧边栏小工具设置,如果不需要文章侧栏,可以开启「使用单栏样式」。
2、文章扩展设置
在「后台→外观→自定义→文章页面」的左侧选项中可以进行一些文章扩展设置,比如是否显示文章评论和浏览量等等。
这里只说几个重要的选项:
1、文章顶部不显示Banner图片
文章页面顶部默认显示当前文章分类设置中的Banner图片,如果不想显示Banner图片可以开启这个选项,个人建议还是显示图片比较好看一些。
2、所有文章均使用单栏文章页
单栏文章页,就是隐藏了侧边栏而已,如果不需要文章侧边栏,可以开启这个选项。
3、自动使用产品文章样式
开启这个设置后,「文章样式-4」下面的所有文章,都会自动使用产品文章样式。
例如:http://zing.wkbanjia.com/fenlei-a
4、添加按钮
产品文章页默认按钮,支持自定义跳转链接和弹出图片,通常用于添加QQ咨询链接、或者引导扫码添加/关注微信等。
设置后,所有产品文章页,产品摘要下面将显示这里添加的自定义按钮,如果编辑文章的时候有单独设置自定义按钮,则优先显示文章内添加的按钮。
5、广告设置
文章内容顶部和底部,支持添加自定义广告图片,通常用于某个重点产品的推广或者其它重要信息展示等,建议图片宽度为785px,高度随意。
页脚设置
Zing-Pro主题有3种页脚样式,可自定义页脚版权信息和添加网站备案号。
页脚样式-1:4个菜单,1个二维码,友情链接,页脚版权信息。
页脚样式-2:网站Logo,网站描述,1个菜单,1个二维码,友情链接,页脚版权信息。
页脚样式-3:友情链接,页脚版权信息。
菜单请到「后台→外观→菜单」中进行设置,注意勾选一下显示位置。菜单设置教程可参考:菜单设置。
友情链接请到「后台→链接」中进行设置。
页脚默认显示主题版权链接,如果不想显示,可在「后台→外观→自定义→页脚设置」中取消勾选:页脚主题版权信息。
侧边栏小工具设置
小工具在「后台→外观→小工具」或者「后台→外观→自定义→小工具」中进行设置。
区别就在于「自定义」里面的是可视化设置,设置后可以实时预览,但是「自定义」里面设置小工具,必须点击到有显示侧栏的页面才可以进行设置,比如首页是没有侧栏的,所以点击「自定义」里面的小工具就没有设置选项,而点击到文章页面,「自定义」中的小工具就会显示相关选项了。大家可以参考一下下面的演示视频。
手机端设置
Zing-Pro主题可以设置手机端底部菜单,类似于APP的底部菜单那种,支持自定义菜单图标和菜单名,可添加自定义链接或者点击弹出图片(引导关注微信)。
客服工具设置
客服工具就是网站右侧悬浮显示的按钮,在「后台→外观→自定义→客服工具」中进行设置,支持:二维码、客服QQ、微博链接、邮箱链接、联系电话。
不填写则不显示,如果不需要,设置留空就行了。
需要注意的是,邮箱咨询链接并不是让你填写邮箱账号,而是链接。
比如QQ邮箱的“邮我”:https://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=670088886@com(把QQ邮箱改成你的就好了)。
再比如Mailto代码:mailto:670088886@qq.com(把QQ邮箱改成你的就好了)
网站公告/通知栏设置
网站公告请到「后台→外观→自定义→网站公告」中进行设置,支持修改公告栏背景颜色。
网站配色
Zing-Pro主题不能随意的修改配色,仅在主题中国内置了十几种配色,在「后台→外观→自定义→网站配色」中选择你喜欢的配色即可,如果这里面的配色不能满足你的需求,我们也可以免费帮你修改配色一次,只需要提供要修改的位置和目标色值给我们即可。(个人最喜欢主题默认配色)
常见问题
其它主题常见问题请浏览:https://docs.xintheme.com/theme-faq