很多站长在使用DZ的时候,很想修改(header)头部文件,却无从下手,今天我就从文件第一行到最后一行来给大家解剖一下此文件,熟悉的站长都应该知道,Dx的模板制作无不是三个部分,头部(hd)、主体(wp)、底部(ft),这三个部分就是制作模板的关键,然而其中三个部分个人觉得最难的还是主体部分,今天讲下头部文件代码,因为是代码教程,有些代码太长,没必要粘贴过来!我会尽量的写详细点,后须我会将一些常用 的模板文件进行解剖!在这里希望大家支持一下!随便AD下!
8 d/ P& @2 t4 B0 ^+ |8 e( _
# \* W( E; i- D8 v& \. `header.html这个文件存储于common文件下,这个大家应该不陌生吧,我是每个DIV为小节来讲,头部的核心div我就不加if语句来讲解!因为代码太多了!我会在最下面给大家总结一下!修改应该注意的地方!
0 h( M& {7 Z9 g0 T
& A9 z( V. n! J5 l第1行代码:
: @* |2 g, d3 s& r8 p6 z( R<!–{subtemplate common/header_common}–>
+ x. h1 u6 E/ ]7 Z
代码解释:用于调用common文件下的header_common.html文件,
$ i+ L) H% r4 p* l4 P( k& ~6 b
备注:<!–{subtemplate}–>与<!–{template}–}–>是有区别的,<!–{subtemplate }–>后面的模板文件通常都是被包含在其他模板文件中的子体。这样在解析模板的时候,程序就会判断<!–{subtemplate }–>所引入的模板会被再一次解析一遍然后再和入口模板拼合,组成一个完整的模板。也就是说,如果我们添加的模板是在别的模板中被调用的话我们需要以<!–{subtemplate 模板名称}–>的方式引入进来。
* V2 I1 O: h$ o- c6 ?/ c( ^
7 `8 j+ V4 y8 V7 f( x0 _: W, j/ K第2-29行代码:
r5 |, N- Z1 p3 A# N" A8 w从<meta name=”application-name” content=”$_G[‘setting’][‘bbname’]” />开始到以</head>结尾
! N2 l7 Z3 C" ?% C
代码解释:这里主要放置一些外部文件,其中的代码不多作解释,大家在加的时候请考虑官方的书写规范!
( ~+ e5 ~- t0 P备注:此处虽然不解释太多,但大家还是会用到!如果要加外部调用JS、css请按官方的模板制作规范来书写
, E {0 A: r g0 B
$ }. C% S3 i. n" h) ?. b& Z& y7 }第30-186行代码:
/ z' o8 A8 T+ s) Y) `从<body>处开始到此文件的最下方
0 O* u: U# i7 d9 m3 k! ^ v; G" e代码解释:这是首部文件的核心
1 s: ?* [. ]1 x6 y2 K备注:在修改时请注间要提前备份文件
4 G# \! }- }$ E. {* {# V
( J8 i% D. y1 D1 M0 V( h第32-44行代码:
z# ^8 D% Q5 v" e2 q从<div id=”append_parent”></div><div id=”ajaxwaitid”></div>处开始到<!–{/if}–><div id=”toptb” class=”cl”>结尾
7 ^% q3 F: W7 C代码解释:此处是整的DIY样式导入、导出及样式修改等,此处代码是隐藏的,
- L! m/ F% m# y1 E: {8 `1 r备注:<div id=”toptb” class=”cl”>是方便你查找才写出!此代码不要修改,在修改模板时也不要漏了!
: T% e/ S5 K% L E& R/ Z
. F5 ` X& }( {& v8 x& f0 ?. x
第32-44行代码:
- G) R8 c3 i. f V( `从代码:<div id=”toptb” class=”cl”>到</div><!–{if !IS_ROBOT}–>
, q( A) O0 h& D6 _+ z! l! B7 I. M1 K
代码解释:顶部文件,用于放置导航与dz内部的一些功能,<div class=”y”>右处内容</div>,<div class=”z”>左处内容</div>
$ L: ^" I1 J# Q1 p& k+ S备注:在后台=》界面=》顶部导航。可以设置
% L% L/ C' y; R$ ]+ p1 ^; W4 p6 O0 s" e& v5 Z9 }
第70-78行代码:
! E" N3 ^" @' w) u' T/ j3 V' R* I
1 F* o! @6 H) w1 u<!–{if !IS_ROBOT}–>
3 l- I; b6 q: G' |7 Y( J
<!–{if $_G[‘uid’] && !empty($_G[‘style’][‘extstyle’])}–>
% w( t4 k: j. N8 E <div id=”sslct_menu” class=”cl p_pop” style=”display: none;”>
" Q9 K# Q' i5 l <!–{if !$_G[style][defaultextstyle]}–><span class=”sslct_btn” onClick=”extstyle(”)” title=”{lang default}”><i></i></span><!–{/if}–>
/ q1 ~! B0 u% W" Q
<!–{loop $_G[‘style’][‘extstyle’] $extstyle}–>
1 A7 z) d$ t: z) R$ a9 z <span class=”sslct_btn” onClick=”extstyle(‘$extstyle[0]’)” title=”$extstyle[1]”><i style=’background

extstyle[2]’></i></span>
8 m& N& t9 P! u5 ~ t. ^3 C: L <!–{/loop}–>
/ g* n: B8 v. h </div>
/ E; I- j, D# z$ ~0 Z/ P" f <!–{/if}–>
1 Q/ u. ?* u" X0 O9 Y% W
6 d- a% E o2 F" h4 ]# B1 G+ Z' [6 z; [代码解释:此处是拓展色的切换的菜单
+ _; r0 C |# S# R( {% j2 u9 u备注:如里不需要可以删除
2 {! {! n7 M! o
" e: i! i! ~" g第80-96行代码:
" K. {# K; t$ w, J! A5 F; k; L. E- b D" y
<div id=”qmenu_menu” class=”p_pop {if !$_G[‘uid’]}blk{/if}” style=”display: none;”>
5 |: a# ]( E4 f" p8 |/ J2 N6 E
<!–{if $_G[‘uid’]}–>
' c. J' |- [, n/ k8 {4 {/ u
<ul>
* t/ I5 K. G: |" P a; c+ p <!–{loop $_G[‘setting’][‘mynavs’] $nav}–>
! c# W. }9 N9 Q# ^5 {
<!–{if $nav[‘available’] && (!$nav[‘level’] || ($nav[‘level’] == 1 && $_G[‘uid’]) || ($nav[‘level’] == 2 && $_G[‘adminid’] > 0) || ($nav[‘level’] == 3 && $_G[‘adminid’] == 1))}–>
" N1 b! n9 k) y6 Z* |5 T. n7 e: I <li>$nav[code]</li>
: j, |) s" x! W6 z! `8 Y <!–{/if}–>
: c# g/ [$ e. P. ~ B d <!–{/loop}–>
& V- R8 y0 z0 k8 a& q+ P
</ul>
/ e' r8 B6 @$ W. P A <!–{else}–>
% ?; H& v7 _8 x <div class=”ptm pbw hm”>
* k! N' C4 a, Z. h3 {4 I) V% D
{lang my_nav_login}
3 f, w d1 s7 L/ C8 w- L% M/ a" O
</div>
% m* T+ a# k$ g9 G <!–{/if}–>
: T7 J2 Q8 o, a' k2 u |
</div>
' N7 E# S2 z( ~8 b% D
<!–{/if}–>
* r) y0 o3 i, U8 G, d1 s
3 c" T! @" C6 U$ Z
代码解释:此处是快捷导航弹出的菜单,里面用到了<!–{if $_G[‘uid’]}–>语句进行判断,意思是只有会员才可以浏览此处内容,循环我就不多讲了哈
: A# ?7 \' A) E4 L" D备注:<!–{if $_G[‘uid’]}–>语句可以用到很多地方,自己在做模板的时候,可能会用到!
0 k4 |9 ^3 R% m& e# t
# q; l- ^. l+ \1 ~7 Q4 {第97行代码:
7 R( Z' J9 F' C( }$ e4 Y+ c6 P
7 {7 Y# D9 r3 x8 h7 c; w<!–{ad/headerbanner/wp a_h}–>
- P* K3 L6 V: `4 ?! }
+ t6 S/ L5 E" b M6 G h) M代码解释:头部的广告代码,
3 E6 ?: u% ?* Y: V, k
备注:可以在后台=》运营=站内广告添加第98-184行代码:
! d* S Z% i( P7 E; _6 U7 x; J1 f
从<div id=”hd”>到 </div><!–{/if}–>
% z$ q8 [3 i+ w' _# h代码解释:头部的核心文件
, q7 r' f( N% P/ |- t) w3 [备注:下面是头部核心的DIV指引
- a& g; W3 H3 S" `$ U0 i5 g<div id=”hd”>
0 Z( K' O3 N% v" X* s<div class=”wp”>
! L, |# }" ?# e) |3 F, y& K<div class=”hdc cl”>
/ }5 g; ~* I T# Q
<h2>logo</h2>———————————->logo
# L3 f' i+ B2 t! Q <div id=”um”>
& |, r* P0 `7 q/ _/ R" T<div class=”avt y”>头像</div>—————————–头像
& c- N6 o/ b( }2 J9 ^0 l <p>
$ \ E$ D* X4 L6 G& a
<!–{hook/global_usernav_extra1}–>————————————>插件嵌入点1
6 ?: R7 V3 @- ^3 h) J <!–{hook/global_usernav_extra2}–>———————————>插件嵌入点2
) U, Q$ d |1 U4 a; v$ @个人信息—————————————->个人信息
' a; _$ q" Y6 ^</p>
* y/ u' U2 }1 _' h0 h% x<p>
$ \ o! v; E; B5 U+ l- f
<!–{hook/global_usernav_extra3}–>—————————>插件嵌入点3
H6 A8 r, D$ N4 k4 \! X/ o% D/ d( t个人信息—————————————->个人信息
+ o( }" C" k, r a</p>
$ W9 o* E0 X4 x( |: @- m6 [. w</div>
' t5 [6 X0 U' A0 ^
<!–{template member/login_simple}–>—– > 登录框(此处调用member/login_simple.html文件) </div>
4 Z4 K8 D! a2 O3 t% j9 a<div id=”nv”>
" N. U! Z5 N9 R8 P0 x<a href=”javascript:;” id=”qmenu” >快捷导航</a>————–>快捷导航
; B& X6 y: z' H: M. w* s! g <ul>
7 w" v2 q2 s9 X! C
<li>栏目导航</li>———————————>栏目导航
% b N6 o' v, ?0 S0 h- K1 s( ? </ul>
+ {6 \. a h' b
</div>
) R* ^0 Q9 _$ d
<ul class=”p_pop h_pop” id=”plugin_menu” style=”display: none”>
5 E i1 Z" e) p2 g& h7 Z二级导航菜单样式——————————————————>二级导航菜单样式
) h9 S) Y8 G3 }$ F/ M$ j8 E</ul>
$ U+ I, h4 X E% p8 M6 w- g
< div id=”mu” class=”cl”>
: z3 x1 d- E+ A0 d9 {' t( T( c二级导航横排>————->二级导航横排样式
( E" _1 e- V9 l4 V# y: h
</div>
8 n' B# v5 j& L B% ]
<!–{ad/subnavbanner/a_mu}–>————————->头部广告(后台站点广告处可以添加)
8 T! ]# i5 ?3 X: `# v
<!–{subtemplate common/pubsearchform}–>——–>搜索(此处调用common/pubsearchform文件) </div>
% G1 t* u( f0 ^* K. G</div><!–{hook/global_header}–>插件嵌入点
$ g0 R: l3 s' [2 \0 S6 L7 ^$ m
8 ]. M5 S3 j/ u* `5 y
总结:大家在修改的时候他的每个DIV和ul、li、和会有if语句,大家在看明白以上图后,在添加的时候要注意一下IF语句的作用,我就没有把代码复制到上面一一解析,希望大家去妍究下!利用这些资源,自己可以做出很漂亮的头部,举一反三!