discuz自定义的模板页,如何正确调用自己写的js和css? 这个路径方式怎么写
在模版设置里面自定义函数,例如MYIMGDIR然后到代码页面把你想调用的图那里链接填上{MYIMGDIR}CSS样式表直接在commoncss里面添加就行。个别需要在modulecss里面添加,文件里面有说明你自己看看就懂了
在以下路径
/template/default/common/headerhtm
/template/default/common/footerhtm
/template/default/forum/discuzhtm
我们结婚吧!--{block/98}-->的短码,把这个短码放在模板中才行(在设置这个diy调用的时候,在数据模块中设置好html结构,也就是你现在直接放在模板中的代码)。
怎么安装Discuz插件?
1安装前提条件:必须拥有FTP好了回归正题,模板安装步骤1、首先找模板插件,下载到自己电脑,解压!打开解压后的文件夹,会发现有几个文件夹几个文件,标注DIY的是模板内置导入的DIY文件,建议直接取出保存在本地电脑,在后面安装完模板美化的时候会用到。而一些长长的文件英文名一般就是模板文件夹了,模板文件夹不会以中文命名。
2、将模板文件夹上传到模板目录中。
一般空间都会支持压缩包压缩和解压,有的支持rar,有的支持zip,不过都一样,支持哪个压缩哪个格式。如果你的空间不支持在线压缩解压,那么逐个上传也是可行的,不过如果对模板插件里面文件多的,那么相应消耗的时间要久一点。
3然后打开FTP软件,进入论坛根目录,根目录可以咨询自己的空间商。将文件上传到根目录下的template中。上传完后,进入后台-界面-风格管理,找到上传的模板,安装即可
要删掉的那部分代码在模板文件里面删
要修改的文件是
/template/default(当前模板目录)/forum/discuzhtm
至于修改样式,需要添加或修改对应的CSS
如果想在默认模板上简单的修改、附加扩展css,只需要在你对应的模板套系下手动添加一个对应的扩展css文件就可以了,例如你想修改或者添加commoncss中的代码,只需要在自己创建的模板套系目录的对应位置:common文件夹下新建一个extend_commoncss文件,然后将自己要修改或者扩展的css代码。将在生成缓存css时,自动追加到默认模板的css文件tmplate/default/common/commoncss解析成你当前的模板id缓存文件。
CSS 继承规范:
Discuz! X系列产品中 CSS 文件会在缓存时按照以下顺序进行合并:
template/default/css 文件。
当默认模板是非默认模板时,template/模板目录/extend_css 文件 或 template/模板目录/css。
当某插件启用时,source/plugin/插件目录/template/extend_css 文件。
因此非默认模板目录中的 CSS 属性将继承默认模板中的 CSS 属性,插件目录中的 CSS 文件将继承前二者的 CSS 属性。
CSS 自身的集成顺序为:当 CSS 属性名称相同时,CSS 文件中,写在后面的替换前面的代码。
CSS书写规范:
属性写在一行内,属性之间、属性名和值之间以及属性与“{}”之间须有空格,例如:class { width: 400px; height: 300px; } 。
属性的书写顺序:
位置:position,left,right,float
盒模型属性:display,margin,padding,width,height
边框与背景:border,background
段落与文本:line-height,text-indent,font,color,text-decoration,
其他属性:overflow,cursor,visibility,
针对特殊浏览器的属性,应写在标准属性之前,例如:-webkit-box-shadow:; -moz-box-shadow:; box-shaow:;
按照元素模型由外及内,由整体到细节书写,大致分为五组:
谨慎添加新的选择符规则,尤其不可滥用 id,尽可能继承和复用已有样式
选择符、属性、值均用小写(格式的颜色值除外),缩写的选择符名称须说明缩写前的全称,例如 cl -> Clearfix
勿使用冗余低效的 CSS 写法,例如:ul li a span { }
慎用 !important
建议使用在 class/id 名称中的词语
表示状态:a->active
表示结构:h->header,c->content,f->footer
表示区域:mn->main,sd->side,nv-navigation,mu->menu
表示样式:l-list,tab,p_pop
常用css实例:
兼容IE浏览器css hack
所有 IE浏览器适用:
ie_all foo { }
IE6 专用:
ie6 foo { }
IE7 专用:
ie7 foo { }
IE8 专用:
ie8 foo { }
浮动样式及浮动元素父元素高度自适应样式代码:
z/y 浮动 left/right z { float: left; } y { float: right; }
cl:after { content: ""; display: block; height: 0; clear: both; visibility: hidden; } cl { zoom: 1; }
大标题字体:
wx, ph { font-family: "Microsoft YaHei", "Hiragino Sans GB", STHeiti, Tahoma, SimHei, sans-serif; font-weight: 100; }
外边距样式:
mtn { margin-top: 5px !important; }
mbn { margin-bottom: 5px !important; }
mtm { margin-top: 10px !important; }
mbm { margin-bottom: 10px !important; }
mtw { margin-top: 20px !important; }
mbw { margin-bottom: 20px !important; }
文字字体大小:
xs0 { font-family: {SMFONT}; font-size: {SMFONTSIZE}; -webkit-text-size-adjust: none; }
xs1 { font-size: 12px !important; }
xs2 { font-size: 14px !important; }
xs3 { font-size: 16px !important; }
内边距样式:
ptn { padding-top: 5px !important; }
pbn { padding-bottom: 5px !important; }
ptm { padding-top: 10px !important; }
pbm { padding-bottom: 10px !important; }
ptw { padding-top: 20px !important; }
pbw { padding-bottom: 20px !important; }
modulecss文件架构解析(此文件必须按照格式编写):
/ group::index /
/ 群组 index 模块使用的CSS /
/ end /
/ group::index,forum::index /
/ 群组 index 和 论坛 index 模块使用的CSS /
/ end /
/ forum /
/ 论坛 所有模块使用的CSS /
/ end /
实现模块化css分部加载!格式固定多个模块用”,“隔开例如:
/ misc::invite,group,forum::viewthread,portal::view,home::space /
这个文件的分部加载是对应程序地址例如:forumphpmod=forumdisplay,应当按照CURSCRIPT::$mod格式写即:forum::forumdisplay。
0条评论