很多站长在使用DZ的时候,很想修改(header)头部文件,却无从下手,今天我就从文件第一行到最后一行来给大家解剖一下此文件,熟悉的站长都应该知道,Dx的模板制作无不是三个部分,头部(hd)、主体(wp)、底部(ft),这三个部分就是制作模板的关键,然而其中三个部分个人觉得最难的还是主体部分,今天讲下头部文件代码,因为是代码教程,有些代码太长,没必要粘贴过来!我会尽量的写详细点,后须我会将一些常用 的模板文件进行解剖!在这里希望大家支持一下!随便AD下!
# F8 E( o2 f5 J- s0 A% ~
0 j# m( t6 p+ C6 k) _header.html这个文件存储于common文件下,这个大家应该不陌生吧,我是每个DIV为小节来讲,头部的核心div我就不加if语句来讲解!因为代码太多了!我会在最下面给大家总结一下!修改应该注意的地方!
) h! H5 c/ \- V- Z, j) d& h: q
( j, i2 I" t, r* Q( Z
第1行代码:
6 C; B& N- D o5 N<!–{subtemplate common/header_common}–>
- _2 E( Y6 o( g0 d
代码解释:用于调用common文件下的header_common.html文件,
6 ^" ~# W$ c* l2 W( f6 y备注:<!–{subtemplate}–>与<!–{template}–}–>是有区别的,<!–{subtemplate }–>后面的模板文件通常都是被包含在其他模板文件中的子体。这样在解析模板的时候,程序就会判断<!–{subtemplate }–>所引入的模板会被再一次解析一遍然后再和入口模板拼合,组成一个完整的模板。也就是说,如果我们添加的模板是在别的模板中被调用的话我们需要以<!–{subtemplate 模板名称}–>的方式引入进来。
2 k0 S8 ]. j9 S p
4 d5 K) z- O6 F3 U- d- k/ m第2-29行代码:
# d H. D8 K7 u+ w0 q) E D- F
从<meta name=”application-name” content=”$_G[‘setting’][‘bbname’]” />开始到以</head>结尾
+ O Q9 E% g# X( N2 U6 n3 u
代码解释:这里主要放置一些外部文件,其中的代码不多作解释,大家在加的时候请考虑官方的书写规范!
4 F( a. h7 x5 W1 [( B! c1 d备注:此处虽然不解释太多,但大家还是会用到!如果要加外部调用JS、css请按官方的模板制作规范来书写
* @& v9 t; E5 T, q8 k% b9 N& I
5 Q1 {( x/ n3 h4 N2 `# ~第30-186行代码:
) Q; q' F/ B- q2 w8 a9 Q# S
从<body>处开始到此文件的最下方
, E6 n/ }' l, r" D) Q1 J& ]代码解释:这是首部文件的核心
4 u- O+ _) @* E' S+ }# x+ R, z; k: r备注:在修改时请注间要提前备份文件
1 q3 J7 O2 |+ r6 [5 S4 Y+ h4 C3 B3 x: ?
# b/ V7 g$ ], l) ?9 K6 Y/ H X1 z; G第32-44行代码:
7 H( O9 O [( K) I; M
从<div id=”append_parent”></div><div id=”ajaxwaitid”></div>处开始到<!–{/if}–><div id=”toptb” class=”cl”>结尾
5 v R$ `: b7 K" f" z( `代码解释:此处是整的DIY样式导入、导出及样式修改等,此处代码是隐藏的,
+ k8 {( w( K/ N& j) Y备注:<div id=”toptb” class=”cl”>是方便你查找才写出!此代码不要修改,在修改模板时也不要漏了!
' Q0 [0 C6 Y8 p
: n: I' g2 i1 f8 N) ~! F% z' K第32-44行代码:
* x1 \& d8 d9 t从代码:<div id=”toptb” class=”cl”>到</div><!–{if !IS_ROBOT}–>
& |4 { z7 k$ T2 ^. k! e
代码解释:顶部文件,用于放置导航与dz内部的一些功能,<div class=”y”>右处内容</div>,<div class=”z”>左处内容</div>
8 C+ {; Y( C8 w/ j- H备注:在后台=》界面=》顶部导航。可以设置
/ c8 A8 @, F6 u4 \ ]
. A7 I9 `0 L/ f. }! H; Y! z第70-78行代码:
* t' Y6 X7 M2 @5 r6 Y& i
* g0 ^7 h4 x* E7 |7 G7 n& Q<!–{if !IS_ROBOT}–>
8 u# y; a/ z5 _& z2 V+ v* r <!–{if $_G[‘uid’] && !empty($_G[‘style’][‘extstyle’])}–>
; R8 x. d' n/ n* t8 Z* ]" {
<div id=”sslct_menu” class=”cl p_pop” style=”display: none;”>
6 s/ C5 A0 [" H( G7 X <!–{if !$_G[style][defaultextstyle]}–><span class=”sslct_btn” onClick=”extstyle(”)” title=”{lang default}”><i></i></span><!–{/if}–>
8 Q0 M' Z* ^+ u2 f <!–{loop $_G[‘style’][‘extstyle’] $extstyle}–>
& U+ |* L: d" r- G+ M <span class=”sslct_btn” onClick=”extstyle(‘$extstyle[0]’)” title=”$extstyle[1]”><i style=’background

extstyle[2]’></i></span>
' a% z, D5 {& s' u- M! u <!–{/loop}–>
: O! { q) {5 D D5 T2 Z1 I </div>
. w, @) Y J$ x2 R6 a$ F& k) n* b <!–{/if}–>
, ` c1 Z) C) R* Q
1 p/ ^5 o% @* E) i: _' l代码解释:此处是拓展色的切换的菜单
5 Z% C4 o- b* y$ D6 {9 A+ n5 G/ c
备注:如里不需要可以删除
" M. [# Q; d/ `% l! u
1 }0 d$ Y. u' L n3 E2 X6 n, [. R& j第80-96行代码:
& k0 n6 ~" [ P6 R
, g. |5 Y( b& M. `<div id=”qmenu_menu” class=”p_pop {if !$_G[‘uid’]}blk{/if}” style=”display: none;”>
3 F5 o3 }: X0 O& E/ U O$ a) t; Q <!–{if $_G[‘uid’]}–>
. e q/ R0 i- t/ I* ^! C
<ul>
( f( b4 _$ u: H2 @% I$ A <!–{loop $_G[‘setting’][‘mynavs’] $nav}–>
% j6 D V- y( z- G, d& U <!–{if $nav[‘available’] && (!$nav[‘level’] || ($nav[‘level’] == 1 && $_G[‘uid’]) || ($nav[‘level’] == 2 && $_G[‘adminid’] > 0) || ($nav[‘level’] == 3 && $_G[‘adminid’] == 1))}–>
: G3 W2 o' `% n( }1 _ <li>$nav[code]</li>
( @- z# l& G2 s" D8 v8 g7 W" k <!–{/if}–>
2 ~) p. q h6 o+ \ <!–{/loop}–>
/ O* P- `; P; y3 y0 I) N </ul>
- p1 j+ B; K6 ?8 W( e; ~
<!–{else}–>
0 t( ~% Y" V; q. R2 [! m2 R
<div class=”ptm pbw hm”>
- R& ~: ^, b9 F. M) ?& ]9 w
{lang my_nav_login}
2 `$ [. x& C0 `6 V9 P0 b& _5 A; \ </div>
7 q+ ^, ]7 ], V2 f g <!–{/if}–>
, C( r3 T0 n( e+ d; m5 ^# R
</div>
+ f% E& J- c* C+ u( ^, E9 n" l <!–{/if}–>
$ t+ `* P8 z% n* Z" E
0 j: k; u: Y- I D" m0 }# Z代码解释:此处是快捷导航弹出的菜单,里面用到了<!–{if $_G[‘uid’]}–>语句进行判断,意思是只有会员才可以浏览此处内容,循环我就不多讲了哈
: p( t7 b7 R/ P7 n9 j B备注:<!–{if $_G[‘uid’]}–>语句可以用到很多地方,自己在做模板的时候,可能会用到!
9 m' {4 a" C' {% e1 }
+ x v7 B! U+ X( X第97行代码:
0 m( p: S& H4 r) D& g- n, W) {9 k8 @9 y7 v3 p0 p( @
<!–{ad/headerbanner/wp a_h}–>
. i6 M1 s( L# p* q* `% T* }9 M' h+ F+ t; `5 l6 S2 u, l3 k3 ]
代码解释:头部的广告代码,
- i7 c4 I* M, I: [1 }备注:可以在后台=》运营=站内广告添加第98-184行代码:
) B- p, J) H* `2 b8 s从<div id=”hd”>到 </div><!–{/if}–>
% J" W' W# M) Q' F/ W+ G
代码解释:头部的核心文件
# w8 _! v" l7 @' l; |8 b
备注:下面是头部核心的DIV指引
7 b1 L$ M I9 Q' ]* H<div id=”hd”>
( f- i0 S# G& I H5 \3 M
<div class=”wp”>
' C+ |) q& w* e- p! r+ }
<div class=”hdc cl”>
$ Z2 ?8 g* P7 X1 a4 i, t<h2>logo</h2>———————————->logo
6 q# }1 F3 F! g" R9 G, Y- ~8 Y <div id=”um”>
. y* U+ a* T0 T& z5 X% ^
<div class=”avt y”>头像</div>—————————–头像
3 l+ K9 ?9 R% L6 `5 j% R
<p>
. L0 c; S U6 }; \' m" a
<!–{hook/global_usernav_extra1}–>————————————>插件嵌入点1
5 a8 D8 P' i7 F: Y D) V" q* Y <!–{hook/global_usernav_extra2}–>———————————>插件嵌入点2
& H4 Y; I" E/ J( E/ ]$ \. r H个人信息—————————————->个人信息
. G7 h# v8 C* I' i</p>
" ?( _6 |* Y0 S<p>
M. T& H7 c% h( c+ F<!–{hook/global_usernav_extra3}–>—————————>插件嵌入点3
9 J4 J, B% a; z8 c个人信息—————————————->个人信息
: Z, A( ^& B1 q: h, ~; y</p>
2 W4 A$ ~& i. e6 D</div>
8 {: }% R. d% b; J! H0 w<!–{template member/login_simple}–>—– > 登录框(此处调用member/login_simple.html文件) </div>
" d- R% c. L# ~2 M+ V# k<div id=”nv”>
, c( x* V& v' N<a href=”javascript:;” id=”qmenu” >快捷导航</a>————–>快捷导航
' @4 I M3 w* J5 |8 u) O0 V
<ul>
+ J/ z, d6 e( t6 Z: t2 H2 M
<li>栏目导航</li>———————————>栏目导航
4 m4 K9 h4 @+ c" g- W( d' a
</ul>
/ I! _6 _4 x8 t9 G' t# a</div>
( W) v9 x5 F8 @4 n
<ul class=”p_pop h_pop” id=”plugin_menu” style=”display: none”>
2 |5 b$ M: ^: C ]
二级导航菜单样式——————————————————>二级导航菜单样式
1 y4 u9 `9 }/ }# c7 g" [
</ul>
. _# L5 }% f) H7 B1 p
< div id=”mu” class=”cl”>
5 M4 s# s: k& b9 h. S二级导航横排>————->二级导航横排样式
( x: g% o3 p; C) P; q c& u, B0 u, | </div>
' C5 O, t/ Z l
<!–{ad/subnavbanner/a_mu}–>————————->头部广告(后台站点广告处可以添加)
2 c" P; ]6 U3 c Y; g<!–{subtemplate common/pubsearchform}–>——–>搜索(此处调用common/pubsearchform文件) </div>
$ E* E) i' v/ a% l
</div><!–{hook/global_header}–>插件嵌入点
1 W& ^3 R" W! o
q3 O- N" ]. P8 Y: Y总结:大家在修改的时候他的每个DIV和ul、li、和会有if语句,大家在看明白以上图后,在添加的时候要注意一下IF语句的作用,我就没有把代码复制到上面一一解析,希望大家去妍究下!利用这些资源,自己可以做出很漂亮的头部,举一反三!