罗码网络discuz插件模板教程微信小程序安卓电脑软件htmlphp源码下载

罗码gitluo

 找回密码
 立即注册

QQ登录

只需一步,快速开始

微信登录

微信扫一扫,快速登录

手机动态码快速登录

手机号快速注册登录

搜索
开启左侧

[DZ教程] Discuz!模板代码解析–header(头部文件)

[复制链接]
罗码男神 实名认证 官方 发表于 2020-1-20 03:01:00 来自手机 | 显示全部楼层 |阅读模式
很多站长在使用DZ的时候,很想修改(header)头部文件,却无从下手,今天我就从文件第一行到最后一行来给大家解剖一下此文件,熟悉的站长都应该知道,Dx的模板制作无不是三个部分,头部(hd)、主体(wp)、底部(ft),这三个部分就是制作模板的关键,然而其中三个部分个人觉得最难的还是主体部分,今天讲下头部文件代码,因为是代码教程,有些代码太长,没必要粘贴过来!我会尽量的写详细点,后须我会将一些常用 的模板文件进行解剖!在这里希望大家支持一下!随便AD下!
$ V: L2 D; \& t2 J* B; E+ T3 e) B" r9 O
header.html这个文件存储于common文件下,这个大家应该不陌生吧,我是每个DIV为小节来讲,头部的核心div我就不加if语句来讲解!因为代码太多了!我会在最下面给大家总结一下!修改应该注意的地方!
' I8 D3 o* {, M3 m+ Q3 B6 e1 U' R4 O0 M) H0 p5 w: z! b7 ?  y
第1行代码:
3 d& k" {% t2 Z* G% [7 t<!–{subtemplate common/header_common}–># z  H+ F& g, _! R
代码解释:用于调用common文件下的header_common.html文件," f" y# c8 j  q0 K1 l3 ~
备注:<!–{subtemplate}–>与<!–{template}–}–>是有区别的,<!–{subtemplate }–>后面的模板文件通常都是被包含在其他模板文件中的子体。这样在解析模板的时候,程序就会判断<!–{subtemplate }–>所引入的模板会被再一次解析一遍然后再和入口模板拼合,组成一个完整的模板。也就是说,如果我们添加的模板是在别的模板中被调用的话我们需要以<!–{subtemplate 模板名称}–>的方式引入进来。- j+ E# X% j  i3 S( H  S$ T

- `2 Y1 N2 w, |/ o, M- ^第2-29行代码:
( x+ Z' T% p% ^$ [* i# M从<meta name=”application-name” content=”$_G[‘setting’][‘bbname’]” />开始到以</head>结尾. B% q+ o4 F9 W& W
代码解释:这里主要放置一些外部文件,其中的代码不多作解释,大家在加的时候请考虑官方的书写规范!
' _* V7 |4 G8 M9 R9 d6 \备注:此处虽然不解释太多,但大家还是会用到!如果要加外部调用JS、css请按官方的模板制作规范来书写) A2 x) U" p+ }

8 S' j1 a  A4 {# E9 i" D6 E8 Y第30-186行代码:
: |; p1 I; C  j从<body>处开始到此文件的最下方
. q1 ~5 m* h( A代码解释:这是首部文件的核心2 Z7 D4 E/ f$ N# e0 R7 R7 _% i0 T
备注:在修改时请注间要提前备份文件
  k# a! B- f1 y& A. s1 p6 x
+ i: f8 x8 {. q- o# ]第32-44行代码:
0 [) [3 B: E: ?  K从<div id=”append_parent”></div><div id=”ajaxwaitid”></div>处开始到<!–{/if}–><div id=”toptb” class=”cl”>结尾
. z! f, S* r) E: ?代码解释:此处是整的DIY样式导入、导出及样式修改等,此处代码是隐藏的,# W! \$ A& I8 y, A* L
备注:<div id=”toptb” class=”cl”>是方便你查找才写出!此代码不要修改,在修改模板时也不要漏了!
1 _" W  I# k" A8 F9 W; d9 V" f
% Q! [( Y+ B! V7 E  Y: O第32-44行代码:
& T2 N/ a; P0 K1 _1 P2 L. |0 @2 I从代码:<div id=”toptb” class=”cl”>到</div><!–{if !IS_ROBOT}–>
7 y9 x4 a/ A  i' L代码解释:顶部文件,用于放置导航与dz内部的一些功能,<div class=”y”>右处内容</div>,<div class=”z”>左处内容</div>
1 i' W' x7 y) g备注:在后台=》界面=》顶部导航。可以设置$ n6 H3 H+ i0 I( w

; O) w$ b7 ?0 ]) D) [3 n第70-78行代码:
) I. L& F8 H: W6 B/ q1 ]; H& D' Z5 x* K0 ]7 @5 n& m/ M# }3 E5 P
<!–{if !IS_ROBOT}–>% g* J5 l* @: F- s. r3 P# S
                        <!–{if $_G[‘uid’] && !empty($_G[‘style’][‘extstyle’])}–>
. L5 f* b* L& K4 X# U6 B+ }* H                                <div id=”sslct_menu” class=”cl p_pop” style=”display: none;”>
$ }; I% g& q, N+ z                                        <!–{if !$_G[style][defaultextstyle]}–><span class=”sslct_btn” onClick=”extstyle(”)” title=”{lang default}”><i></i></span><!–{/if}–>
7 e7 o$ ], x. s+ t% E- l8 \                                        <!–{loop $_G[‘style’][‘extstyle’] $extstyle}–>
$ G* e) ?- |" r  q4 z                                                <span class=”sslct_btn” onClick=”extstyle(‘$extstyle[0]’)” title=”$extstyle[1]”><i style=’backgroundextstyle[2]’></i></span>) q6 L( p7 ^6 m$ ^+ @7 n
                                        <!–{/loop}–>
! T4 Z- G' C$ ?! w0 t                                </div>
1 r+ v. L; t1 m* @5 ]3 `! t$ x                        <!–{/if}–>& r& c/ U+ h! S
% j- \* S8 ^3 H1 Y( C7 B
代码解释:此处是拓展色的切换的菜单+ K/ ~7 R) A9 K+ S3 T5 G; a3 B
备注:如里不需要可以删除
% _; c- D% j) p5 S- Y; L& |, M4 {+ Z, j/ D8 G0 S+ ?9 ?
第80-96行代码:
4 X  N/ H% m3 a; ?
( Z! f3 E4 q# k* }4 r: S<div id=”qmenu_menu” class=”p_pop {if !$_G[‘uid’]}blk{/if}” style=”display: none;”>; n: ^* R; K' _2 S! v
                                        <!–{if $_G[‘uid’]}–>
9 \6 w$ W  P, z+ K                                        <ul>
% R! A% f0 }' P1 P; e2 f1 R- R6 S                                                <!–{loop $_G[‘setting’][‘mynavs’] $nav}–>
* N. E5 C3 {0 V5 G, ]: f                                                        <!–{if $nav[‘available’] && (!$nav[‘level’] || ($nav[‘level’] == 1 && $_G[‘uid’]) || ($nav[‘level’] == 2 && $_G[‘adminid’] > 0) || ($nav[‘level’] == 3 && $_G[‘adminid’] == 1))}–>+ Q3 h! r! m, m7 l! }; {" y
                                                                <li>$nav[code]</li>
* X* h2 t- F( @: Z                                                        <!–{/if}–>& ^6 z, j& x; Q& I, O9 |  }9 b
                                                <!–{/loop}–>: l. n$ `5 W5 ?$ x
                                        </ul>, Y( l% V, F$ n$ |
                                        <!–{else}–>, `- `  S' a% v6 q) v' l* N
                                                <div class=”ptm pbw hm”>
1 g: V; N/ \5 x- O                                                        {lang my_nav_login}
# F6 O% w% ?6 V9 O, a                                                </div>
3 |1 q7 R; O; [& Y  O7 T5 V                                        <!–{/if}–>
  w6 @0 `2 W! p/ ]# _                                </div>9 g0 D5 n. ?6 h' ?- s' l
                <!–{/if}–>* G4 j. q! ^+ i+ ^2 z
5 G! k! Q' [. d* Z
代码解释:此处是快捷导航弹出的菜单,里面用到了<!–{if $_G[‘uid’]}–>语句进行判断,意思是只有会员才可以浏览此处内容,循环我就不多讲了哈& p2 j9 ]( \7 I+ A
备注:<!–{if $_G[‘uid’]}–>语句可以用到很多地方,自己在做模板的时候,可能会用到!
. Z, n, V* l$ d; f: d# }: s! M6 q; J5 E, a4 O+ V
第97行代码:9 F4 J* k: r2 ?) N) |

3 [$ h/ ^' d% v& }4 `<!–{ad/headerbanner/wp a_h}–>
* C+ M* w* A) k$ G' W- |% ]  y/ T3 t' M% P
代码解释:头部的广告代码,7 g# p  m% _. q' w
备注:可以在后台=》运营=站内广告添加第98-184行代码:
/ j7 n6 u2 H" O, k- U0 ?8 W8 X从<div id=”hd”>到 </div><!–{/if}–>
( I8 m$ [# u3 [8 I: J9 t& v代码解释:头部的核心文件  n% t$ a* F2 Q+ }& R. D
备注:下面是头部核心的DIV指引# z, l# ~+ U7 B* G
<div id=”hd”>
0 W; P4 {+ X2 @- ?<div class=”wp”>
, f+ f' o, L4 t& v( I2 M7 r8 q9 J<div class=”hdc cl”>
: W" O7 w6 m* |, R5 }<h2>logo</h2>———————————->logo
. G4 m# y4 O3 g; v- W: {. Q9 L# q2 ^) y                 <div id=”um”>5 P+ d" M. d# X4 G7 ?5 ~- P# r* R  b
<div class=”avt y”>头像</div>—————————–头像# P  x7 H$ c' Z/ y0 \4 `- g0 ]
                       <p>$ U3 d6 v  R0 f3 b) H  N
<!–{hook/global_usernav_extra1}–>————————————>插件嵌入点14 H8 ^" |' C: K* i+ F, B7 F6 j: R6 U( K
                          <!–{hook/global_usernav_extra2}–>———————————>插件嵌入点2
- O" W+ \7 `  i% E3 }% v7 [- Q个人信息—————————————->个人信息4 {+ ]: b4 S  G9 `
</p>
) `$ |! U/ ?( d3 L3 s* U<p>9 c( H4 ^, u/ E$ D7 T0 M9 X
<!–{hook/global_usernav_extra3}–>—————————>插件嵌入点34 h. ^) k4 ], T4 K9 T5 z
个人信息—————————————->个人信息; D$ p" q/ b9 v
</p>
/ z; l$ h; E; i8 S5 h</div>. a6 V% N+ r$ |- {, {4 k
<!–{template member/login_simple}–>—– > 登录框(此处调用member/login_simple.html文件)                         </div>9 E1 Q/ P' @& A( y; v. v& p0 }& l
<div id=”nv”>% ~+ D' `8 L9 {2 R7 \/ c
<a href=”javascript:;” id=”qmenu” >快捷导航</a>————–>快捷导航
5 `% b6 L. n; n9 K  {                <ul>
# V' u6 i8 Y* v0 d<li>栏目导航</li>———————————>栏目导航
; |8 M$ q5 [" o4 ?5 |3 [                 </ul>% S3 p( b5 L+ V0 M- e3 b: m
</div>5 U' [* z1 B1 s1 \9 ^2 H$ c8 t# m9 c
<ul class=”p_pop h_pop” id=”plugin_menu” style=”display: none”>) N, y' e: F4 j) ?* I) J  X
二级导航菜单样式——————————————————>二级导航菜单样式4 X  R, \/ F4 K6 r
</ul>
) A5 ?& @6 w. c4 o+ Q; i. ]< div id=”mu” class=”cl”>. S# ]5 Z6 E/ ?1 \
二级导航横排>————->二级导航横排样式
8 ~7 o- _& W% [5 Q              </div>
% v1 |( n5 Y* f/ d) D/ G<!–{ad/subnavbanner/a_mu}–>————————->头部广告(后台站点广告处可以添加)) Y6 x* ~" j4 i7 V/ Z
<!–{subtemplate common/pubsearchform}–>——–>搜索(此处调用common/pubsearchform文件)                   </div>0 G: ?" e) t( t: h% T1 R
</div><!–{hook/global_header}–>插件嵌入点
8 x- n7 f+ q  e% p( L& s4 H! N
1 X' P4 L- e0 |9 V总结:大家在修改的时候他的每个DIV和ul、li、和会有if语句,大家在看明白以上图后,在添加的时候要注意一下IF语句的作用,我就没有把代码复制到上面一一解析,希望大家去妍究下!利用这些资源,自己可以做出很漂亮的头部,举一反三!

想说又不敢说,说了又怕被拒绝,拒绝了又怕尴尬,就是这样的。内心很痛苦的那种。
起什么名字呢? 发表于 2020-1-20 13:44:18 | 显示全部楼层
沙发!沙发!

回复

使用道具 举报

MR.Z 发表于 2020-1-21 08:00:48 | 显示全部楼层
有道理。。。

回复

使用道具 举报

hgfhgf 发表于 2020-1-21 17:55:29 | 显示全部楼层
我是个凑数的。。。

回复

使用道具 举报

1287252690 发表于 2020-1-22 10:59:32 | 显示全部楼层
支持一下

回复

使用道具 举报

雨后晴天 发表于 2020-1-22 21:38:49 | 显示全部楼层
学习了,不错,讲的太有道理了

回复

使用道具 举报

岁月神偷 发表于 2020-1-23 11:01:26 | 显示全部楼层
过来看看的

回复

使用道具 举报

瑾瑾 发表于 2020-1-26 03:05:05 | 显示全部楼层
路过,支持一下啦

回复

使用道具 举报

 shu1332725 发表于 2020-1-26 04:06:46 | 显示全部楼层
过来看看的

回复

使用道具 举报

张红霞 发表于 2020-1-26 11:12:24 | 显示全部楼层
我是个凑数的。。。

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册 微信登录 手机动态码快速登录

本版积分规则

QQ|Archiver|手机版|小黑屋|罗码 ( 粤ICP备17073043号 )https://beian.miit.gov.cn/#/home

GMT+8, 2025-11-7 19:38 , Processed in 0.140757 second(s), 59 queries .

Powered by 罗码网络! X3.4

© 2001-2017

快速回复 返回顶部 返回列表