Orange 主题安装前的准备工作

1、安装nicetheme提供的最新版「积木箱子」插件:https://www.nicetheme.cn/jimu,并按照教程完成操作:https://www.nicetheme.cn/nicetheme-jimu-set.html

2、主题需要使用 WordPress 自带缩略图功能,请如下图进行设置:

  • 在「设置」-「媒体」- 设置大小,缩略图大小,宽度填450,高度填0 (因为瀑布流图片高度需要按照图片尺寸进行裁剪,因此高度为0 )。其他的尺寸按下图进行设置即可。
  • 如果你之前缩略图生成了是正方形的,需要重新上传图片,或者使用第三方插件重新生成缩略图。插件比如:Regenerate Thumbnails (插件市场搜索或者在搜索引擎搜索下载使用。)
Orange 主题 v1.0 设置教程-nicetheme_奈思主题

3、安装「积木箱子」后即可安装 Orange 主题,所有的主题设置项均在 wordpress 仪表盘“积木”下的“Orange 主题设置”,如图1。

4、首次安装主题,首页可能空白,请先补充文章内容,按主题教程配置主题功能。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

一、基础设置

因为v1.1版本新增延迟加载,请务必设置好以下三个图片。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

1、网站logo:比例大致为4:1 。

2、文章缩略图:当文章中暂时没有图片的时候,作为占位图显示。

3、默认分类封面图:文章列表顶部的封面。

布局设置

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

1、首页公告:显示在首页顶部,蓝色色块。见下图

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

2、首页幻灯片板块:一共有2个样式,一个默认宽度、一个100%宽度。

3、首页板块:一共有11个板块,根据需求添加板块内容,对应设置好图片、文字即可。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

 

二、拓展设置

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

1、首页滚动元素动画:首页板块,可以随着向下滚动,板块内容会有一个进场动画。

2、常驻边栏:现在在右侧,可设置3个常规图标。分别是在线咨询链接、微信咨询、电话咨询。不填则不显示。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

三、文章设置

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

1、产品详情页通用描述:可以在产品文章中,显示通用标识。如下图。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

五、广告设置

预留4种广告位,首页文章列表下的长幅广告、其他归档页文章列表下的广告以及文章页内容下方的广告位。

六、底部设置

社交信息:可设置在线客服、客户服务热线、官方微博、微信公众号、邮箱。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

七、分类模版

文章的分类模版有3个,除了原来的「网格视图」,v1.1版本新增了「列表视图」「案例视图」。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

7.1 案例视图

和网格视图区别是除了缩略图和标题外,显示分类名称,不显示文章其他信息(浏览量等)

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

上图中间的导航,则是通过自定义菜单方式来设置,如下图,设置好菜单。然后在分类拓展中设置好「分类导航」。

八、产品录入

Orange 主题 v1.0 设置教程-nicetheme_奈思主题
Orange 主题 v1.0 设置教程-nicetheme_奈思主题

录入产品时,在产品内容编辑下「产品拓展」,可根据需求,进行设置:产品图片、特点、售价、优惠价、产品状态可影响下方的购买按钮的状态。

默认下,按钮可正常跳转。售罄则无法跳转。表单咨询则可弹出表单,让用户进行回复,如下图。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

九、页面模版

1、关于我们页面:新建页面 - 选择页面模版「关于我们」。设置方面参考首页板块设置。

2、联系我们页面:新建页面 - 选择页面模版「联系我们」。即可在页面编辑封面、联系方式等。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

如下图。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

用户在留言表单中提交表单后,在后台,可以看到留言联系列表。如果在产品中留言,则会显示详细的产品名称。可针对用户需求,进行联系。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题
Orange 主题 v1.0 设置教程-nicetheme_奈思主题

十、友情链接页面

页面模版,可选择链接分类显示链接,logo比例3:1,链接设置教程:具体教程

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

十一、其他

10.1 咨询弹窗信息

设置:「主题设置」-「底部设置」-「咨询弹窗信息

会在网站右下角显示一个弹窗,打开网站后5秒显示。用户点击关闭,后会短时间内不显示。

10.2 手机端网站底部导航栏

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

设置:「主题设置」-「拓展设置」-「手机端网站底部导航栏

注意:因为手机端宽度有限,请最多设置4个一级菜单,支持弹出二级菜单。菜单字数请控制在4-5个字,超过字体会错位不美观。在一级菜单的文字前可插入字体图标。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

注意:设置菜单时,最多设置2级菜单,如下图。在第一级菜单的导航标签中,加入图标字体。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

图标字体可在主题目录中看到,路径:wp-content/themes/orange/plugins/iconfont

打开用浏览器打开下图中的demo_index.html,即可看到主题可使用的字体图标。

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

图标字体代码参考:

<i class="iconfont icon-shouye_home"></i>

点击下图的 Font class,即可看到字体图标的代码,修改上文中的icon-shouye_home

Orange 主题 v1.0 设置教程-nicetheme_奈思主题

如果你网站是新站,没有文章数据,可使用我们的文章数据,使用wordpress自带导入工具,导入即可。

数据压缩包:凭订单号建议客服获取。

压缩包解压后,导入到导入工具中。具体教程请看:https://www.nicetheme.cn/wordpress-dao-ru-shu-ju-xml.html

注意⚠️:导入到数据不含图片,可能会提示图片不存在,或者演示中文章、列表没有图片。