admin 管理员组文章数量: 887021
2024年2月25日发(作者：100的二进制原码补码反码)
你是否遇到过这个情况，看着这套模板的门户不错，那套模板的论坛不错，但是就是不知道怎么样将两套模板完美的整合在一起，而自己手里没有太多的钞票，那么请看下面的教程，你在一定的程度上就能自己动手丰衣足食了。（有人会说DZ默认的机制就能使用几套不同的模板，但是那样的话几套模板混合使用，一方面不利于管理，另外一方面很多模板也不能直接混合使用，也需要修改的）
第一步：了解模板相关的基础知识
1、任何一套Discuzx 的模板都会包含几个基础的东西 CSS和图片文件夹（这里的目录是模板作者自己的习惯决定的） template/**** 这个是DZ的模板目录，
我们需要做的就是将 template/**** 这里面需要的页面移到指定模板下；
2、模板结构说明：
一般常见模板都会有上图的这些文件夹，
common ---- 这个是存放一下全局类的东西；（如：头部文件、页脚文件、搜索栏和系统加载的相关CSS等）
一般情况影响两套模板兼容问题的都是这个文件夹引起的，需要特别注意的是这个文件夹里面的这几个文件
extend_ （我一般叫这个为全局CSS样式） extend_ （全局扩展CSS样式）
同时也可能有 和 等系统默认的CSS文件，一般模板使用这两个都是不规范的表现
但是有的在没有更好办法情况下也可能使用，因为默认的CSS 干涉了模板里面的CSS；
forum ---- 这个是论坛模板相关的文件夹，所有论坛类的模板都在这个文件夹下面；
member ---- 这个是登陆相模板相关的 （注册、登陆 注：如果没有修改登陆样式，一般没有这个文件夹）
portal ---- 这个是门户模板相关的。
下面两个文件一个是模板安装配置文件一个是模板图标展示
第二步：分析相关需要转换合并的模板的结构特点
在这一步我们需要分析模板的结构，考虑由那一套为主，那一套为辅，这里我们的原则有三个：
1、那一套模板在合并后需要的页面较多我们就以他为主；
2、在使用页面差不多的情况下，看那一套的全局CSS使用的比较多的我们就选择他；
3、如果有修改系统文件的那么也尽可能的选择其为主。
第三步：基础知识了解完毕，我们开始实例分析
这次的实例就拿猫扑贴贴和华西都市网来整合，我们将合并的模板效果为，论坛和其他部分还是采用猫扑原来的样式，只将猫扑贴贴的门户页换成是华西都市网的模板。下面是两套模板的COMMON文件夹截图
1、选定一个模板来作为主模板；（根据我们在第二步讲解的来分析，这次合并需要以猫扑贴贴为主，华西都市网为辅。）
2、首先我们分析一下猫扑贴贴调用文件的情况
1. 第一行如下
2.
3. 最后一行如下
4.
复制代码
因为我们需要替换门户页，因此这连个文件没有用处，将其删除，
我们可以得出，猫扑贴贴头部和页脚调用的文件分别是 header_ 和
footer_
1.
type="text/css" />
复制代码
通过这件代码，我们可以发现门户的相关CSS和图片目录是在
staticimagefg_moptt_firportal 下，我们里面的文件都删除
3、分析一下华西都市网的门户页面调用的情况，，我们打开华西都市网的门户页，查看第一行代码为
1.
复制代码
可以看出，华西的门户头部调用的是
最后一行代码为
1.
复制代码
这句可以看出，它调用的页脚部分是
由于这两个文件在猫扑贴贴里面也是有的，因此我们需要将其的名字修改一下
-> header_ -> footer_ （注：这里的改名我们的原则都是修改成header_** 这样的格式，这样方便识别，）
4、确定了头部页脚文件的命名以后，我们的第一行和最后一行分别修改成
1.
2.
复制代码
5、在查看华西门户页加载的相关 CSS 和 JS文件的情况；
1.
type="text/css" />
2.
复制代码
找到这样的调用代码，（当然华西的只有这两个文件），可以看出
$_G['style']['styleimgdir'] 这个是后台配置的扩展目录函数，我们将其改成实际的路径为 staticimagefg_moptt_firportal ；修改好以后搜索
$_G['style']['styleimgdir'] 看看那里还有使用这个函数的地方也修改其路径为路径为 staticimagefg_moptt_firportal（注：当然如果你将这些CSSJS和图片移到其他位置里面，那么这个地址请改成你移动后的地址，有可能你会问为什么你不使用扩展函数了，因为不是所有的模板都有这个扩展函数的，具体的可以看后台的配置，有扩展函数的话就修改为
$_G['style']['styleimgdir']/portal/）
6、完成3-4小步以后，将华西都市网刚刚修改的
COMMON下的两个文件 header_ 和 footer_ ；
PORTAL 下的 拷贝到猫扑贴贴相应目录替换
7、将华西的相应图片CSS （staticimagefg_hx_img ）文件拷贝到猫扑贴贴的图片文件夹 staticimagefg_moptt_firportal 文件夹下，再将华西
commonextend_ 文件里面的所有内容都拷贝到 portal_
文件的最前面 在保存(注：这里需要将 extend_ 里面相关背景图片的地址修改一下)，
8、完成上面所有的步骤以后，进入后台更新缓存，导入DIY数据，就可以看到效果了 （一般到这一步，很多模板都能很好的整合了）
第四步：检查浏览器兼容性和JS错误修正 （这个是最难的一部，需要有一点的CSS基础和JS基础）
完成上面的第三部可以发现，模板基本上都可以了，但是缺发现出现JS错误，这个是什么原因引起的了，
通过我们分析两套模板，发现他们都有使用 jQuery 框架插件 （这个插件不是
DZ后台的那个插件，是JS框架） 但是他们的声明不一样，猫扑是声明为 jQ, 华西是jQuery 所以我们将其声明修改成相同的，（一般 jQuery 我的习惯都是放在commonheader_ 里面） 对比连个文件，可以发现华西的 多了一些代码
1.
复制代码
这个是IE下使PNG-24 图片透明的插件， 因此我们将华西的
header_ 替换掉猫扑的
完成这一步后需要注意，将猫扑模板里面所有的 jQ 变成 jQuery .
CSS 引起的冲突和干涉，我在这里就不多说，相关的CSS知识请自己查找，一般CSS干涉的常见问题就是，字体颜色、大小位置等不对。
最后，多套模板整合的方法也是类似的，但是以上的教程知识针对比较规范的模板才行，如果不规范的模板相应的工作量会加大很多，当然原理基本上是一样的，这里就不在多说什么，特别提醒的是，如果头部或者页脚有嵌入型插件的话，扩展的头部或者页脚会失去作用，因为嵌入点的ID是唯一的，这个只有修改插件使用新的嵌入点
版权声明：本文标题：关于两套模板不同页面整合的基本思路及方法 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.freenas.com.cn/free/1708792671h531498.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论