很多站长在使用DZ的时候,很想修改(header)头部文件,却无从下手,今天我就从文件第一行到最后一行来给大家解剖一下此文件,熟悉的站长都应该知道,Dx的模板制作无不是三个部分,头部(hd)、主体(wp)、底部(ft),这三个部分就是制作模板的关键,然而其中三个部分个人觉得最难的还是主体部分,今天讲下头部文件代码,因为是代码教程,有些代码太长,没必要粘贴过来!我会尽量的写详细点,后须我会将一些常用 的模板文件进行解剖!在这里希望大家支持一下!随便AD下!
0 g4 T' m+ Z% V- G2 w" U
6 G! [5 W) ~& I( F) d/ Oheader.html这个文件存储于common文件下,这个大家应该不陌生吧,我是每个DIV为小节来讲,头部的核心div我就不加if语句来讲解!因为代码太多了!我会在最下面给大家总结一下!修改应该注意的地方!
0 R" b, p* J8 r4 ^$ H
2 ~& S6 n0 v7 E0 ^4 F- r$ `* E, c第1行代码:
( E6 S1 B; |! C, D<!–{subtemplate common/header_common}–>
& y; }6 X; [" j+ @0 W( l* b1 A代码解释:用于调用common文件下的header_common.html文件,
& [( D6 c1 m3 L5 O4 [
备注:<!–{subtemplate}–>与<!–{template}–}–>是有区别的,<!–{subtemplate }–>后面的模板文件通常都是被包含在其他模板文件中的子体。这样在解析模板的时候,程序就会判断<!–{subtemplate }–>所引入的模板会被再一次解析一遍然后再和入口模板拼合,组成一个完整的模板。也就是说,如果我们添加的模板是在别的模板中被调用的话我们需要以<!–{subtemplate 模板名称}–>的方式引入进来。
& j- }9 \) x5 u' `4 x7 ]
|) d8 {# P- z$ y5 ?0 `6 N2 _3 y4 Q% @
第2-29行代码:
/ X+ T/ l% J4 S: B( d% E% c从<meta name=”application-name” content=”$_G[‘setting’][‘bbname’]” />开始到以</head>结尾
- }& w' b) W5 l7 ?: e. I4 l代码解释:这里主要放置一些外部文件,其中的代码不多作解释,大家在加的时候请考虑官方的书写规范!
' U1 X* d& Y. Y4 c备注:此处虽然不解释太多,但大家还是会用到!如果要加外部调用JS、css请按官方的模板制作规范来书写
# L0 M( n0 s( S! {, b. j
+ h8 ^ I$ ?& i0 L; W" W第30-186行代码:
( y. `& W: u/ A
从<body>处开始到此文件的最下方
! |+ |" N' r) g* |& e, w& b代码解释:这是首部文件的核心
8 ]7 J5 z* M# e8 J6 B7 Y1 I
备注:在修改时请注间要提前备份文件
2 I3 D' `& t6 [! p4 ^; y
l* x" e5 b; g第32-44行代码:
6 [/ @; `0 \/ m' C从<div id=”append_parent”></div><div id=”ajaxwaitid”></div>处开始到<!–{/if}–><div id=”toptb” class=”cl”>结尾
0 z* I5 Y$ `' o5 ?' \- G8 x
代码解释:此处是整的DIY样式导入、导出及样式修改等,此处代码是隐藏的,
' K0 N% g# Z3 W, u8 r; H$ x! f% J备注:<div id=”toptb” class=”cl”>是方便你查找才写出!此代码不要修改,在修改模板时也不要漏了!
( Z- v w u! z0 w4 X7 {7 p& Z8 G3 T9 P9 E1 Z
第32-44行代码:
: _- `1 j8 S( f) d' v- H从代码:<div id=”toptb” class=”cl”>到</div><!–{if !IS_ROBOT}–>
2 T3 W- d; S( T1 T( n/ f- s代码解释:顶部文件,用于放置导航与dz内部的一些功能,<div class=”y”>右处内容</div>,<div class=”z”>左处内容</div>
7 R W* p0 W( O1 L备注:在后台=》界面=》顶部导航。可以设置
; ]' ]; i/ d2 R
- S p) b: M/ p第70-78行代码:
' D H1 v! N. S4 s
0 D1 ^1 H7 X/ n. n' x6 _<!–{if !IS_ROBOT}–>
) j2 ~ k3 @! v" q7 r/ E: i5 ~$ w7 N
<!–{if $_G[‘uid’] && !empty($_G[‘style’][‘extstyle’])}–>
* E- y! q+ ]) ]% N/ h& @. C <div id=”sslct_menu” class=”cl p_pop” style=”display: none;”>
m6 ^ }" C3 v {5 p1 r <!–{if !$_G[style][defaultextstyle]}–><span class=”sslct_btn” onClick=”extstyle(”)” title=”{lang default}”><i></i></span><!–{/if}–>
, x }1 A& Z7 M3 d) r <!–{loop $_G[‘style’][‘extstyle’] $extstyle}–>
$ L; J; ~! x. A. j! U/ ] <span class=”sslct_btn” onClick=”extstyle(‘$extstyle[0]’)” title=”$extstyle[1]”><i style=’background

extstyle[2]’></i></span>
! d& @$ W$ _7 Y- [2 j <!–{/loop}–>
" T" ?7 ?% d# r6 S/ f1 ^
</div>
! L. | H7 I) K& P) U <!–{/if}–>
' R) `* i, h! p- l& c0 A* L( }2 y3 M3 m7 w1 C: D% Q. Z
代码解释:此处是拓展色的切换的菜单
/ e$ ]: ?) Q, t; @8 M' A
备注:如里不需要可以删除
) }! b8 m/ F$ j+ K1 @& L
8 f- S" M$ t; D/ D4 w第80-96行代码:
" s; X7 r) F' e: S$ b3 u2 J3 F# }
# v/ u( ~* U9 w. Q7 k* C2 }. V6 X<div id=”qmenu_menu” class=”p_pop {if !$_G[‘uid’]}blk{/if}” style=”display: none;”>
1 m# P- G0 |% c2 w; Y8 w( ?; v/ I
<!–{if $_G[‘uid’]}–>
7 w ]) ^/ N/ }0 v: Q$ M3 v <ul>
4 u: `; j6 @3 f* V+ B <!–{loop $_G[‘setting’][‘mynavs’] $nav}–>
' a' K# c. h! V$ `& G% p0 m: R
<!–{if $nav[‘available’] && (!$nav[‘level’] || ($nav[‘level’] == 1 && $_G[‘uid’]) || ($nav[‘level’] == 2 && $_G[‘adminid’] > 0) || ($nav[‘level’] == 3 && $_G[‘adminid’] == 1))}–>
2 t# J. p6 X: x <li>$nav[code]</li>
( b6 J4 |2 H6 l* d! N5 A4 _0 k8 ` <!–{/if}–>
" T" u" K1 n6 |9 P
<!–{/loop}–>
& `3 B, U5 T( ^5 \
</ul>
. } b3 Q D5 n! Z <!–{else}–>
; O& U, P9 B0 e# g c1 I# N5 D$ m <div class=”ptm pbw hm”>
! f* z: o* t3 o9 w3 G
{lang my_nav_login}
" _* I/ i7 ~. Q% A [, r
</div>
" x( _1 X$ ]6 p; W; |- } <!–{/if}–>
- a* M0 K4 {- d. ? ]. K1 ^# B/ e; L
</div>
Z/ ]/ W2 C; r* H& p <!–{/if}–>
" w3 p; c4 I/ X9 m0 U) X, y6 L6 S+ O, N
代码解释:此处是快捷导航弹出的菜单,里面用到了<!–{if $_G[‘uid’]}–>语句进行判断,意思是只有会员才可以浏览此处内容,循环我就不多讲了哈
6 c( [" j. ]5 K& i5 v备注:<!–{if $_G[‘uid’]}–>语句可以用到很多地方,自己在做模板的时候,可能会用到!
$ M0 w* y9 c s5 I" z
6 h" U6 }/ w' N$ Z7 k; M第97行代码:
9 c; k! X: Q/ `: ~/ M5 O5 [
4 B6 s: `0 V9 c4 g& I
<!–{ad/headerbanner/wp a_h}–>
. ]" \2 O: l. K
* v b" ~1 S; k代码解释:头部的广告代码,
* Y) q! H9 |' x' P备注:可以在后台=》运营=站内广告添加第98-184行代码:
1 H) W1 e+ K/ u) E
从<div id=”hd”>到 </div><!–{/if}–>
1 K2 v! \2 V0 ?7 t
代码解释:头部的核心文件
`6 @) l( A# U0 a$ q
备注:下面是头部核心的DIV指引
) P* b* F! e4 o7 V: S! k<div id=”hd”>
, T' \4 U" T2 K. a' d
<div class=”wp”>
; p2 e" s, g6 A: R! K/ [<div class=”hdc cl”>
7 S7 ^+ Q& Q Q) ~1 A
<h2>logo</h2>———————————->logo
, x3 G% g2 D4 E6 f' C+ N& ~
<div id=”um”>
: E! m' x% z, b& n, e6 T& B<div class=”avt y”>头像</div>—————————–头像
" C: C6 y/ t: N) \$ }! _1 Y E" }
<p>
5 G7 h: u4 R- ]# _
<!–{hook/global_usernav_extra1}–>————————————>插件嵌入点1
9 B7 R! i6 w1 l; l/ J
<!–{hook/global_usernav_extra2}–>———————————>插件嵌入点2
4 ~3 m$ I; B8 i: O7 y- R个人信息—————————————->个人信息
, X& B* r( L e, _* K( Z
</p>
" n& m: C2 d' d p U. p' C& _" |
<p>
/ i9 E6 ]# p @$ u' ]/ W8 Z
<!–{hook/global_usernav_extra3}–>—————————>插件嵌入点3
}: u0 S4 s9 Y, Y3 ]/ W1 z个人信息—————————————->个人信息
( _) m% [$ U8 Q
</p>
3 Q% ?* a R; X- W0 J: t</div>
1 \7 F9 _& [6 D
<!–{template member/login_simple}–>—– > 登录框(此处调用member/login_simple.html文件) </div>
) { W) n6 ~ ~ l<div id=”nv”>
4 q/ C2 K1 Q5 I+ w7 `
<a href=”javascript:;” id=”qmenu” >快捷导航</a>————–>快捷导航
; G0 Z7 c2 b# ^7 L4 x <ul>
6 e" o8 _$ S3 M n: Y* G<li>栏目导航</li>———————————>栏目导航
1 t" U7 O& u5 \# H! ~. A </ul>
& H( e" o- g0 E</div>
; Y, M- c/ m( i, G& Q+ p( v<ul class=”p_pop h_pop” id=”plugin_menu” style=”display: none”>
3 o8 z3 K1 O* e$ A% n二级导航菜单样式——————————————————>二级导航菜单样式
$ r! V; t& Z% e/ V
</ul>
( b- ?' h) z+ k; F
< div id=”mu” class=”cl”>
; ]6 P \1 U4 y
二级导航横排>————->二级导航横排样式
3 ^0 S; Q( E( G9 x </div>
v# X# }* j: q3 H% o
<!–{ad/subnavbanner/a_mu}–>————————->头部广告(后台站点广告处可以添加)
% o- r- \- L, z3 _
<!–{subtemplate common/pubsearchform}–>——–>搜索(此处调用common/pubsearchform文件) </div>
! G! N0 B' M. @, O5 m/ t
</div><!–{hook/global_header}–>插件嵌入点
$ ^& i: J/ e7 e% s
3 F% w/ G/ g8 \+ H; h总结:大家在修改的时候他的每个DIV和ul、li、和会有if语句,大家在看明白以上图后,在添加的时候要注意一下IF语句的作用,我就没有把代码复制到上面一一解析,希望大家去妍究下!利用这些资源,自己可以做出很漂亮的头部,举一反三!