很多站长在使用DZ的时候,很想修改(header)头部文件,却无从下手,今天我就从文件第一行到最后一行来给大家解剖一下此文件,熟悉的站长都应该知道,Dx的模板制作无不是三个部分,头部(hd)、主体(wp)、底部(ft),这三个部分就是制作模板的关键,然而其中三个部分个人觉得最难的还是主体部分,今天讲下头部文件代码,因为是代码教程,有些代码太长,没必要粘贴过来!我会尽量的写详细点,后须我会将一些常用 的模板文件进行解剖!在这里希望大家支持一下!随便AD下!
! ?% @+ u+ \3 h; \7 n+ v
+ o, @, q' G! c y8 C* ?( {header.html这个文件存储于common文件下,这个大家应该不陌生吧,我是每个DIV为小节来讲,头部的核心div我就不加if语句来讲解!因为代码太多了!我会在最下面给大家总结一下!修改应该注意的地方!
; g7 r1 e( _/ |" K3 P/ s% _7 u# l1 A2 G; ~9 Q7 X1 w% _
第1行代码:
& y6 r. `+ N. h. y2 n8 a
<!–{subtemplate common/header_common}–>
4 J% Y3 Q- k4 j, |, t( c代码解释:用于调用common文件下的header_common.html文件,
* I7 m1 b" V( a, @* U/ R! ^备注:<!–{subtemplate}–>与<!–{template}–}–>是有区别的,<!–{subtemplate }–>后面的模板文件通常都是被包含在其他模板文件中的子体。这样在解析模板的时候,程序就会判断<!–{subtemplate }–>所引入的模板会被再一次解析一遍然后再和入口模板拼合,组成一个完整的模板。也就是说,如果我们添加的模板是在别的模板中被调用的话我们需要以<!–{subtemplate 模板名称}–>的方式引入进来。
4 M6 e( r5 k4 X$ B s/ S6 k+ S$ l' F l. r) r
第2-29行代码:
; S* Y& a# V/ w; i: R从<meta name=”application-name” content=”$_G[‘setting’][‘bbname’]” />开始到以</head>结尾
0 _" B' S) {7 N6 S代码解释:这里主要放置一些外部文件,其中的代码不多作解释,大家在加的时候请考虑官方的书写规范!
* h4 d0 n$ k: _7 R! E2 A备注:此处虽然不解释太多,但大家还是会用到!如果要加外部调用JS、css请按官方的模板制作规范来书写
% E7 O! \* j* C0 L# ]
# E4 e1 ]2 P' j, e# C5 N6 V第30-186行代码:
8 N+ d1 E: K1 g; A. Z5 |3 B. ~5 @$ p
从<body>处开始到此文件的最下方
* n) I, a. x3 @: k! v
代码解释:这是首部文件的核心
# T X. D- Y& A7 S* G$ q3 o: Z
备注:在修改时请注间要提前备份文件
$ c4 b* E- r1 ]
$ @1 d# A) e. D+ v2 J, @
第32-44行代码:
& P& {1 @# S- o) F& T从<div id=”append_parent”></div><div id=”ajaxwaitid”></div>处开始到<!–{/if}–><div id=”toptb” class=”cl”>结尾
5 ^ c- P- n! e% \代码解释:此处是整的DIY样式导入、导出及样式修改等,此处代码是隐藏的,
* o. `" S- e$ U备注:<div id=”toptb” class=”cl”>是方便你查找才写出!此代码不要修改,在修改模板时也不要漏了!
/ f3 o! Z) n2 O8 P) F3 i
3 Z2 b) l% i( x5 N第32-44行代码:
. @& L, E- W: K: D$ O7 ^从代码:<div id=”toptb” class=”cl”>到</div><!–{if !IS_ROBOT}–>
3 m$ }9 Y' U. W% ~, ]6 v# t9 F# q" C9 g$ Z
代码解释:顶部文件,用于放置导航与dz内部的一些功能,<div class=”y”>右处内容</div>,<div class=”z”>左处内容</div>
$ f) Y7 u2 x" x; w3 |8 I( v2 E
备注:在后台=》界面=》顶部导航。可以设置
, e2 P5 Z. r+ B# n& }
6 h1 f4 k! `4 k" \. |( ]
第70-78行代码:
" Y p) T9 ~+ Z2 R/ s& j, }! n) B, b; F$ d
<!–{if !IS_ROBOT}–>
3 b6 [/ j9 U, z+ x% \
<!–{if $_G[‘uid’] && !empty($_G[‘style’][‘extstyle’])}–>
4 n3 {0 v! }$ u$ ` <div id=”sslct_menu” class=”cl p_pop” style=”display: none;”>
8 i$ k5 E c8 s
<!–{if !$_G[style][defaultextstyle]}–><span class=”sslct_btn” onClick=”extstyle(”)” title=”{lang default}”><i></i></span><!–{/if}–>
% N! @9 O. N5 Z' ~; Z/ S& _5 t! ^
<!–{loop $_G[‘style’][‘extstyle’] $extstyle}–>
' T! @: T0 B8 C% a9 ~ <span class=”sslct_btn” onClick=”extstyle(‘$extstyle[0]’)” title=”$extstyle[1]”><i style=’background

extstyle[2]’></i></span>
* y0 c c3 b X. J- h. a
<!–{/loop}–>
l# v8 L" {5 g! }* ]& R6 y
</div>
- c r/ \- f' {1 {. {
<!–{/if}–>
. h' Y! U; f- s& e$ ]% N" p9 ^& F
! y9 X" n3 S& l) E
代码解释:此处是拓展色的切换的菜单
: X, Z4 F# O- F5 {
备注:如里不需要可以删除
. G4 k! {/ p' ?% @8 c: M
* p5 I2 Q& x5 i: M5 ]3 a. S) `- L7 ?
第80-96行代码:
; ?) V! j9 c: R8 C% u( {' h) |
% g$ g" W* h* G8 A
<div id=”qmenu_menu” class=”p_pop {if !$_G[‘uid’]}blk{/if}” style=”display: none;”>
, W- E& @; ^" G- B$ V: K$ `
<!–{if $_G[‘uid’]}–>
: u& R' g, ^8 d; c) } m3 I
<ul>
/ {0 b6 b; E. a- W4 ?: w* r3 ?
<!–{loop $_G[‘setting’][‘mynavs’] $nav}–>
2 X3 I( I% I3 O; i <!–{if $nav[‘available’] && (!$nav[‘level’] || ($nav[‘level’] == 1 && $_G[‘uid’]) || ($nav[‘level’] == 2 && $_G[‘adminid’] > 0) || ($nav[‘level’] == 3 && $_G[‘adminid’] == 1))}–>
5 X% Q+ a& U& E0 S* O8 d
<li>$nav[code]</li>
* ~& h. k2 H4 Q0 U1 g
<!–{/if}–>
$ b9 M% T9 w w <!–{/loop}–>
5 T7 {) z: q# Q, @. p+ L Q* g
</ul>
3 O6 K( E& E2 k; _6 x; h
<!–{else}–>
7 D7 H- L) B# `' F7 P- a9 @1 B
<div class=”ptm pbw hm”>
+ i9 ~* z0 h) |0 d5 A p% a) Q
{lang my_nav_login}
; |+ L& H/ c& I8 e </div>
( y. R& l+ }- s$ f1 l$ W
<!–{/if}–>
& }( G' @* A" \
</div>
+ k# U9 q3 S4 ?0 F% l <!–{/if}–>
- ]1 t& q/ F2 K9 e! _; j
$ ]' q0 J* r* I# p/ v; j, P
代码解释:此处是快捷导航弹出的菜单,里面用到了<!–{if $_G[‘uid’]}–>语句进行判断,意思是只有会员才可以浏览此处内容,循环我就不多讲了哈
4 V( U% [ A8 v* \备注:<!–{if $_G[‘uid’]}–>语句可以用到很多地方,自己在做模板的时候,可能会用到!
/ o, O; ?$ M# [/ ~ H/ g( M' i2 X
+ W, j$ o( \8 ^7 W _- O" T) M第97行代码:
1 B& [# s$ v, f ] P
* O# N1 b0 x2 W, S% w$ ?7 A<!–{ad/headerbanner/wp a_h}–>
# v6 ?) _: s* S$ G9 ^
5 n& r$ D r0 G. q/ G) W) _- o/ o代码解释:头部的广告代码,
: f4 b/ i( K) t+ q7 {( D' y备注:可以在后台=》运营=站内广告添加第98-184行代码:
3 j$ H# T+ e: n" n2 r r
从<div id=”hd”>到 </div><!–{/if}–>
2 f" h3 @* U" y代码解释:头部的核心文件
' }& P: [* N& N* ?8 i$ O
备注:下面是头部核心的DIV指引
$ a3 i P ]$ P4 c<div id=”hd”>
+ ]/ e8 x$ t6 Z* P' k" ?" ]5 b<div class=”wp”>
5 C: o; j( E1 k% k9 p/ \
<div class=”hdc cl”>
8 E* y0 J3 s% W<h2>logo</h2>———————————->logo
5 @# n+ t; ]$ i1 J
<div id=”um”>
% x* w4 `6 r1 B* }- R; B<div class=”avt y”>头像</div>—————————–头像
8 t K, Q' z+ U. ?
<p>
* t7 h; q, N: w1 b8 i( ^3 w& t
<!–{hook/global_usernav_extra1}–>————————————>插件嵌入点1
; B& j/ u5 k& T: U6 ]
<!–{hook/global_usernav_extra2}–>———————————>插件嵌入点2
% `. S7 f' a Z1 V, k! B8 P9 N个人信息—————————————->个人信息
$ ?& n, \+ E8 L2 x" Q! s: W
</p>
& O6 A# z# m7 k7 `<p>
; b1 j7 j9 I( D& M<!–{hook/global_usernav_extra3}–>—————————>插件嵌入点3
! q4 e: f9 T1 P% l
个人信息—————————————->个人信息
D0 r' `5 H- e# ^- y$ E5 p, m</p>
6 @; k1 j, z( N) \</div>
) e% C2 w! z: B2 {+ e) `
<!–{template member/login_simple}–>—– > 登录框(此处调用member/login_simple.html文件) </div>
8 B* t$ Z& W/ ]# I: A5 c5 N<div id=”nv”>
2 j$ `$ A5 R' \7 O4 F/ V
<a href=”javascript:;” id=”qmenu” >快捷导航</a>————–>快捷导航
5 `0 C* D, C% E/ B( [" K
<ul>
5 Y i/ |8 X- U5 E<li>栏目导航</li>———————————>栏目导航
( t8 H+ C$ F: i5 y% Y
</ul>
2 _5 C5 c! a; a* l
</div>
+ e) i# L$ V" S0 S5 H6 E<ul class=”p_pop h_pop” id=”plugin_menu” style=”display: none”>
; w8 U: e7 o: f- g" @, {$ F
二级导航菜单样式——————————————————>二级导航菜单样式
# p, i% z7 Z1 z q- v
</ul>
. E% E/ h8 x* w' Y% Z
< div id=”mu” class=”cl”>
) e/ T) v L; W- A2 S7 C) R二级导航横排>————->二级导航横排样式
$ }% v8 b8 O7 u, m* H$ \
</div>
3 i3 M+ e, i+ h+ Y<!–{ad/subnavbanner/a_mu}–>————————->头部广告(后台站点广告处可以添加)
& N2 W$ Z. C* _% c7 A' Z# n, A
<!–{subtemplate common/pubsearchform}–>——–>搜索(此处调用common/pubsearchform文件) </div>
' Q' `2 p' p' l3 ?
</div><!–{hook/global_header}–>插件嵌入点
, {8 h- ^; H; S8 f0 b& p4 {% |& z% _5 u
总结:大家在修改的时候他的每个DIV和ul、li、和会有if语句,大家在看明白以上图后,在添加的时候要注意一下IF语句的作用,我就没有把代码复制到上面一一解析,希望大家去妍究下!利用这些资源,自己可以做出很漂亮的头部,举一反三!