模板制作

模板制作

扩展新模板

如果你想直接在默认模板的基础上修改的话那就到 网站根目录/template/default/ 目录下面直接修改文件就可以了,论坛所有的模板都放在这个文件夹下!

Discuz! X程序读取模板的机制是,读取当前模板套系目录下的模板文件,如yourstyle文件夹下common/header.htm文件,如果没有这个文件,则自动读取默认风格/tempalte/default目录下的common/header.htm文件。这里需要提醒一下,扩展的风格不再需要原来的css文件,只需要新建一个以extend_为前缀加源文件名的扩展css文件即可,例如:extend_common.css文件、extend_module.css这里面只需要加入你自定义的扩展css文件即可!这部分代码将在生成缓存css时,自动追加到你当前模板的common.css缓存文件中。

更多相关:
1、如何搭建本地环境(php+mysql环境)
2、Discuz模板的制作方法
3、风格管理编辑页面中风格常量在模板中的注解图
4、Discuz各类幻灯片的制作方法 - 完全支持DIY
5、巧用firebug 对Discuz!模板进行样式调试修改美化

  • 首先我们需要在template/文件夹下新建一个yourstyle文件夹放置模板文件,然后复制default下的discuz_style_default.xml,重命名为discuz_style_你的风格名称.xml(注意这里discuz_style_是必须保留的)。这个文件配置的即是下图中后台显示的配置区域中的变量内容。
    注释:这个文件是我们风格模板套系的配置文件,其中指定了你的扩展风格名称,配置风格的初始化id,风格模板所在文件夹和一些初始化参数,如:整个模板的字体大小,颜色等一些通用参数的配置。
  • 修改文件中以下四个参数
    <item id="name"><![CDATA[默认风格]]></item> 指定扩展风格的名称,例如:默认风格。
    <item id="templateid"><![CDATA[1]]></item> 指定初始化templateid,这里不要和现有安装风格的id相同。
    <item id="tplname"><![CDATA[默认模板套系]]></item> 指定扩展风格套系的名称,例如:默认风格套系。
    <item id="directory"><![CDATA[./template/yourstyle]]></item> 指定扩展风格所在的文件夹,这个文件夹的名字就是你刚才在template新建的yourstyle。

    注释:有了这个文件后台就可以刷新看到一个扩展风格了。

  • 另外我们复制的配置文件中需要我们特别注意的就是以下两个参数:
    <item id="imgdir"><![CDATA[]]></item> 此参数为风格基础图片存放的目录,默认使用地址 static/image/common/ 目录,一般我们只需要留空就行了
    <item id="styleimgdir"><![CDATA[template/yourstyle/images]]></item> 此参数为扩展目录地址,留空表示无扩展图片目录,如果你想新增图片的话可以在这里预先手动指定一个地址, 然后在此参数指定的目录下新建images扩展图片目录。

现在我们将扩展风格yourstyle设置为当前模板套系,由于这个目录下现在还没有文件,那么他会完全去调用默认模板template/default/文件夹下的文件,这样一个完全和默认风格相同的扩展风格就建立完了。如下图:
1. 在template下新建一个文件夹,放置扩展的模板套系文件。


2. 扩展文件夹下的文件目录名称和模板文件名称完全按照default默认模板命名。注意:也可以自己命名,但是要在模板文件中自己修改模板的对应文件调用,不建议初学者使用。
如上图,我现在进行最简单的修改,此扩展风格只对应了默认模板default下的common文件夹。common中只有一个header.htm文件,也就是说在应用这套模板后,由于它只对应默认模板default下面的common/header.htm, 所以应用此套模板后只能读到header.htm头部模板文件,而其他的如果没有全部自动调用template/default下的模板文件。

3. 后台应用扩展模板:

4. 在header.htm中适当位置添加一句话,以此来测试读取当前模板的模板文件。

5. 对应与前台显示效果:

演示完成。

扩展配色

用户切换配色方案的扩展,它对应 ./template/yourstyle/style/ 目录中的样式文件。全新创建时应在./template/yourstyle/style/目录中建立如t1/style.css之后方能生效!
style.css头部的[name]红[/name], [iconbgcolor]#BA350F[/iconbgcolor]是用来配置后台中的配色方案名称和名称前对应的颜色值(采用16位制配色),扩展时需要你自己配置你所扩展的配色方案的对应名称和显示颜色。注释:此个人配色的加载是在header.htm中根据默认或者你的上一次设置按要求加载的。

个人空间风格

个人空间风格模板默认放置在./static/space/目录下扩展模式和文件结构和论坛的扩展配色基本一直。新建时在./static/space/目录中建立如t9/style.css之后方能生效!style.css头部的[name]自然[/name]是用来配置模板名称的!其他的对照默认的空间风格目录格式放置你要扩展的空间风格的文件!

返回顶部