个人空间风格开发

大概流程
  1. 创建一套空间风格
  2. 要有个大概的配色效果图
  3. 切图
  4. 调整样式表和替换添加图片
  5. 收工打包
准备工作
创建模板在前面已经有介绍,效果图则需要个人开发。这边将讲解入门级的修改方案
首先,我们创建模板,设置为默认后,你会发现怎么跟默认模板是一模一样的,没关系,创建就是在默认模板的基础上复制一份。
然后,切效果图或取色值:
  1. 全局背景图/或者颜色
  2. 头部导航是全局的,入门教程先不处理
  3. 空间的全局共用模块(所以模块外框都是,所以修改一下全部变化)
全局背景修改
  1. 打开 themes/space/创建的风格名/css/dev/style.css
  2. 搜索:body{,第一屏就能看得见
  3. background:url(../../images/bg.png); 就是背景图片效果
  4. 删除 url 改成 #000000 就能变成纯色背景
  5. 我们也可以替换背景图片,覆盖 themes/space/创建的风格名/images/bg.png
全局公用模块
站点上所有模块的包裹样式。
  1. 打开 themes/space/创建的风格名/css/dev/style.css
  2. 搜索:共用模块,后面会发现一片带有.box的样式。
  3. .box{}里面的 border:1px solid #e4e4e4; 就是外框
  4. .box{}里面的 background:#fff; 就是背景了
  5. 调整块之间的距离 margin-bottom:30px;
  6. 模块标题 .box .hd
替换封面效果图和打包导出
打开 themes/space/创建的风格名/images,里面有一个文件叫preview.jpg,它就是显示在风格列表的效果图了
最后,在后台模板列表,创建模板开启的520模式还在的话,会有个导出按钮,即可进行分享。