很多站长在使用DZ的时候,很想修改(header)头部文件,却无从下手,今天我就从文件第一行到最后一行来给大家解剖一下此文件,熟悉的站长都应该知道,Dx的模板制作无不是三个部分,头部(hd)、主体(wp)、底部(ft),这三个部分就是制作模板的关键,然而其中三个部分个人觉得最难的还是主体部分,今天讲下头部文件代码,因为是代码教程,有些代码太长,没必要粘贴过来!我会尽量的写详细点,后须我会将一些常用 的模板文件进行解剖!在这里希望大家支持一下!随便AD下!
( s( [: }. n1 t. r! ~, o
% r3 h8 X2 \& `6 L* ?' Vheader.html这个文件存储于common文件下,这个大家应该不陌生吧,我是每个DIV为小节来讲,头部的核心div我就不加if语句来讲解!因为代码太多了!我会在最下面给大家总结一下!修改应该注意的地方!
: o6 Y" Q2 ? g; J% H" D
6 m/ w: r* @1 M/ s
第1行代码:
! z- E8 C; D9 x" Z+ t- \3 j' n<!–{subtemplate common/header_common}–>
5 ^% d, D4 }! p% L
代码解释:用于调用common文件下的header_common.html文件,
% C* f) O9 _1 B+ f
备注:<!–{subtemplate}–>与<!–{template}–}–>是有区别的,<!–{subtemplate }–>后面的模板文件通常都是被包含在其他模板文件中的子体。这样在解析模板的时候,程序就会判断<!–{subtemplate }–>所引入的模板会被再一次解析一遍然后再和入口模板拼合,组成一个完整的模板。也就是说,如果我们添加的模板是在别的模板中被调用的话我们需要以<!–{subtemplate 模板名称}–>的方式引入进来。
+ Q" U3 I& q( Q5 b S/ i. X) \% {" j4 [
第2-29行代码:
9 U' E' e, L7 k! Q: ~; Q+ C
从<meta name=”application-name” content=”$_G[‘setting’][‘bbname’]” />开始到以</head>结尾
9 L4 R& T8 I& Y o) i% w6 L7 j0 K2 x代码解释:这里主要放置一些外部文件,其中的代码不多作解释,大家在加的时候请考虑官方的书写规范!
2 g+ Z- \0 M, d- V% @备注:此处虽然不解释太多,但大家还是会用到!如果要加外部调用JS、css请按官方的模板制作规范来书写
4 O" b! }- G9 D3 P9 z! T
$ l5 b/ q* U8 T; L
第30-186行代码:
8 q0 \ `# o0 _+ t( y" `7 U
从<body>处开始到此文件的最下方
" b6 o- _5 E( e0 s- s; k$ [5 N
代码解释:这是首部文件的核心
( Z u0 A/ n5 K& w% X, j$ m备注:在修改时请注间要提前备份文件
3 S) k; p- U! `* _ l8 G( d& M6 ^$ g
第32-44行代码:
+ c" D8 p( N+ T0 q/ F从<div id=”append_parent”></div><div id=”ajaxwaitid”></div>处开始到<!–{/if}–><div id=”toptb” class=”cl”>结尾
( L0 Z1 O; k- C( D3 X1 A6 N# g代码解释:此处是整的DIY样式导入、导出及样式修改等,此处代码是隐藏的,
, _- N% z) h# U2 ~5 j备注:<div id=”toptb” class=”cl”>是方便你查找才写出!此代码不要修改,在修改模板时也不要漏了!
/ S! e& V# | ` e, F& @2 c! ^6 ?0 h- ~- ?- \9 G$ ]: @
第32-44行代码:
! I% Y4 E; w( `4 H% W" D3 ?% q
从代码:<div id=”toptb” class=”cl”>到</div><!–{if !IS_ROBOT}–>
, ^4 c/ C* W$ i) U& [5 Q代码解释:顶部文件,用于放置导航与dz内部的一些功能,<div class=”y”>右处内容</div>,<div class=”z”>左处内容</div>
# `2 d$ K8 X# f, p备注:在后台=》界面=》顶部导航。可以设置
2 D. @% J0 q# m& s
% U. y. I$ k0 _, A* p* ?/ c第70-78行代码:
! F! x8 L6 l5 ^ m& e7 j7 r' g1 d$ O
+ ?/ N+ v; B) _6 n; j% v4 }. O
<!–{if !IS_ROBOT}–>
3 H6 g# j4 c" C3 S( v" C: Q5 N3 ]& ? <!–{if $_G[‘uid’] && !empty($_G[‘style’][‘extstyle’])}–>
$ B& ?; f! k) s
<div id=”sslct_menu” class=”cl p_pop” style=”display: none;”>
0 P' t0 u" }* b2 L2 e' w* y
<!–{if !$_G[style][defaultextstyle]}–><span class=”sslct_btn” onClick=”extstyle(”)” title=”{lang default}”><i></i></span><!–{/if}–>
5 s& V8 o0 o/ z* D8 z/ K
<!–{loop $_G[‘style’][‘extstyle’] $extstyle}–>
2 H8 B- O" |6 u8 Y7 n1 V <span class=”sslct_btn” onClick=”extstyle(‘$extstyle[0]’)” title=”$extstyle[1]”><i style=’background

extstyle[2]’></i></span>
. i# G/ |1 q5 H5 x# U <!–{/loop}–>
4 S% r9 m1 n& u6 r* C7 O0 Q
</div>
7 z3 G* C8 Y' E
<!–{/if}–>
( U- f( c% X7 O/ q, P3 Q3 t+ l; S& r6 m! E* F3 P
代码解释:此处是拓展色的切换的菜单
! D( r: I+ ^3 c" p) I备注:如里不需要可以删除
, L" G7 K% }' u2 V; Q- X4 R
E7 J0 T |* S: f* }" E8 i- C第80-96行代码:
+ O. p( d j ^" ?+ B# d6 {
& g G' P1 b2 V<div id=”qmenu_menu” class=”p_pop {if !$_G[‘uid’]}blk{/if}” style=”display: none;”>
3 Y2 `+ z% |0 N$ b: l% m' f0 q5 ? <!–{if $_G[‘uid’]}–>
, O% ]/ G5 ~! A$ t. _( u <ul>
- g9 m- U' }3 E: f <!–{loop $_G[‘setting’][‘mynavs’] $nav}–>
X5 Y& | ?7 T, b6 B8 Q
<!–{if $nav[‘available’] && (!$nav[‘level’] || ($nav[‘level’] == 1 && $_G[‘uid’]) || ($nav[‘level’] == 2 && $_G[‘adminid’] > 0) || ($nav[‘level’] == 3 && $_G[‘adminid’] == 1))}–>
: \7 w/ [. k0 K$ T, c
<li>$nav[code]</li>
4 F: Q; I, S8 W8 c. u* x; Q7 g
<!–{/if}–>
- Q0 l, V$ T/ y
<!–{/loop}–>
: z$ }3 m. w' ~
</ul>
" k1 F% B0 |9 D2 A8 W- Q <!–{else}–>
4 a) z5 x7 f0 p& ~
<div class=”ptm pbw hm”>
7 R+ d% V: M9 k
{lang my_nav_login}
- g9 F8 w1 ~, w3 S+ _ </div>
+ c- U! l- T: [7 @# V$ ~ <!–{/if}–>
+ u, ~6 E$ m7 a6 Q, B* \
</div>
7 B5 l$ |" b9 W' R; w2 a/ P p
<!–{/if}–>
& a0 [- f. h. @+ y3 }
; J8 X0 F7 \/ [: z' o代码解释:此处是快捷导航弹出的菜单,里面用到了<!–{if $_G[‘uid’]}–>语句进行判断,意思是只有会员才可以浏览此处内容,循环我就不多讲了哈
; C% f2 l' ^5 z, o+ W
备注:<!–{if $_G[‘uid’]}–>语句可以用到很多地方,自己在做模板的时候,可能会用到!
8 v; m- k% |1 x) L
2 D! p. r9 E0 x5 a* ~# u第97行代码:
/ J) ?0 i- Z; W! G F' s
! v1 o$ e4 F' O( \; y
<!–{ad/headerbanner/wp a_h}–>
( E% c7 B9 M+ c8 L& I" w( R
, O5 R" {2 G$ p代码解释:头部的广告代码,
- O. n2 u/ O, u2 t1 L
备注:可以在后台=》运营=站内广告添加第98-184行代码:
1 s, V- c \. |: {, Q" q5 J
从<div id=”hd”>到 </div><!–{/if}–>
i5 U/ B, T; q# {代码解释:头部的核心文件
' L. M: C6 q: n9 r& g0 [4 d备注:下面是头部核心的DIV指引
7 x7 N" ^+ u* v
<div id=”hd”>
( ?+ S6 Z5 p: u, W. v1 h; Z5 h' e<div class=”wp”>
- Z/ g$ p) O) k8 }# s3 T% T5 m
<div class=”hdc cl”>
. M5 T5 A' y! X6 v ^
<h2>logo</h2>———————————->logo
! {* K3 ~9 T7 I0 d
<div id=”um”>
9 F% @+ Z, |# n, E5 }, c
<div class=”avt y”>头像</div>—————————–头像
% _6 M7 Y5 e Y
<p>
8 W% a3 \$ [0 _) p; \) ?2 a# A8 w
<!–{hook/global_usernav_extra1}–>————————————>插件嵌入点1
' \) \1 K/ b6 q
<!–{hook/global_usernav_extra2}–>———————————>插件嵌入点2
4 w0 m9 S. ^+ _ x1 C4 S9 G- C
个人信息—————————————->个人信息
& x2 Y# Q4 f" F5 Z, t</p>
9 N. n/ T( h; S" c9 ?
<p>
: k6 E+ |; I7 N0 k5 e5 x6 Y<!–{hook/global_usernav_extra3}–>—————————>插件嵌入点3
3 ^9 ]2 o( q: p1 X) z& I
个人信息—————————————->个人信息
8 z O1 b- q1 e( A. ]- N8 i</p>
9 o6 z9 k6 w/ w# O8 a. b
</div>
( _ _7 o! v4 ], L) \- P+ R# S6 l& y<!–{template member/login_simple}–>—– > 登录框(此处调用member/login_simple.html文件) </div>
( W- b- @' H y( t+ _: W6 c& W" t/ S- q<div id=”nv”>
* @. [- J6 e9 F+ C4 V4 l+ B
<a href=”javascript:;” id=”qmenu” >快捷导航</a>————–>快捷导航
; |9 g; _4 C( ^5 n: W <ul>
0 ~3 Y# [+ ^$ p, {% ^7 z3 ~5 M
<li>栏目导航</li>———————————>栏目导航
" r0 U7 J4 X. V t6 E Q* k5 G1 k </ul>
- E% _0 {5 X/ M9 M& u+ M0 P
</div>
0 s$ W6 u' u2 W/ c
<ul class=”p_pop h_pop” id=”plugin_menu” style=”display: none”>
6 T. @; n4 n& p8 x
二级导航菜单样式——————————————————>二级导航菜单样式
7 R2 H- I7 n+ C2 j, w
</ul>
7 E+ {" R2 e0 C3 J: A- p& b- [< div id=”mu” class=”cl”>
7 h; q: d& l5 D V! M二级导航横排>————->二级导航横排样式
7 ?1 d) h7 H+ i
</div>
/ P; c+ j' a4 W" X3 c h. a
<!–{ad/subnavbanner/a_mu}–>————————->头部广告(后台站点广告处可以添加)
1 T5 W4 p* N3 H5 ^9 z8 q/ o<!–{subtemplate common/pubsearchform}–>——–>搜索(此处调用common/pubsearchform文件) </div>
- Z' Y! ^1 w- X9 ^4 Y3 y
</div><!–{hook/global_header}–>插件嵌入点
g! J& M' q; ~6 `; A1 |; X
. ^) i I2 o( y* p总结:大家在修改的时候他的每个DIV和ul、li、和会有if语句,大家在看明白以上图后,在添加的时候要注意一下IF语句的作用,我就没有把代码复制到上面一一解析,希望大家去妍究下!利用这些资源,自己可以做出很漂亮的头部,举一反三!