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

罗码gitluo

 找回密码
 立即注册

QQ登录

只需一步,快速开始

微信登录

微信扫一扫,快速登录

手机动态码快速登录

手机号快速注册登录

搜索
开启左侧

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

[复制链接]
罗码男神 实名认证 官方 发表于 2020-1-20 03:01:00 来自手机 | 显示全部楼层 |阅读模式
很多站长在使用DZ的时候,很想修改(header)头部文件,却无从下手,今天我就从文件第一行到最后一行来给大家解剖一下此文件,熟悉的站长都应该知道,Dx的模板制作无不是三个部分,头部(hd)、主体(wp)、底部(ft),这三个部分就是制作模板的关键,然而其中三个部分个人觉得最难的还是主体部分,今天讲下头部文件代码,因为是代码教程,有些代码太长,没必要粘贴过来!我会尽量的写详细点,后须我会将一些常用 的模板文件进行解剖!在这里希望大家支持一下!随便AD下!+ }7 h% }- Q9 K" Y! K$ J3 p2 f& _1 S
' F% S- P0 {: I+ l$ p/ B# T, G
header.html这个文件存储于common文件下,这个大家应该不陌生吧,我是每个DIV为小节来讲,头部的核心div我就不加if语句来讲解!因为代码太多了!我会在最下面给大家总结一下!修改应该注意的地方!/ o1 e  \  ~  t1 a7 }& d3 D
: _& L/ p- w  w# h3 l. I
第1行代码:
4 S  R6 V; A6 I6 g8 Z& \1 n<!–{subtemplate common/header_common}–>' x3 }& s) J+ }( c+ z- Y  Z
代码解释:用于调用common文件下的header_common.html文件,8 @! i% n' C% }9 u" _2 ]- H9 v3 p
备注:<!–{subtemplate}–>与<!–{template}–}–>是有区别的,<!–{subtemplate }–>后面的模板文件通常都是被包含在其他模板文件中的子体。这样在解析模板的时候,程序就会判断<!–{subtemplate }–>所引入的模板会被再一次解析一遍然后再和入口模板拼合,组成一个完整的模板。也就是说,如果我们添加的模板是在别的模板中被调用的话我们需要以<!–{subtemplate 模板名称}–>的方式引入进来。5 R  v+ `1 N" r/ U& k8 ^1 u( @
# q# y2 H% R6 _3 x
第2-29行代码:
( \% M: z+ `) Y" R从<meta name=”application-name” content=”$_G[‘setting’][‘bbname’]” />开始到以</head>结尾
: [+ w; ~2 K3 C代码解释:这里主要放置一些外部文件,其中的代码不多作解释,大家在加的时候请考虑官方的书写规范!
: w0 l) d# j" {1 P6 y. {备注:此处虽然不解释太多,但大家还是会用到!如果要加外部调用JS、css请按官方的模板制作规范来书写+ N& [& c( j6 M, e$ L
1 ?1 F0 Z7 Z" M
第30-186行代码:- T  I) }% v0 M
从<body>处开始到此文件的最下方  ~4 W8 G* K3 H- x. g5 M% M7 \
代码解释:这是首部文件的核心
/ E) U' Z  l8 x8 g* ~备注:在修改时请注间要提前备份文件+ R) b. ^# L' X% W  E
( {" e& G" Y9 t* \: a4 `- Y: t' V
第32-44行代码:. s; b6 _( F- F8 M
从<div id=”append_parent”></div><div id=”ajaxwaitid”></div>处开始到<!–{/if}–><div id=”toptb” class=”cl”>结尾
# W6 @( l  G8 B- i代码解释:此处是整的DIY样式导入、导出及样式修改等,此处代码是隐藏的," x, \+ l  J& J" p+ `
备注:<div id=”toptb” class=”cl”>是方便你查找才写出!此代码不要修改,在修改模板时也不要漏了!7 U, Z  m+ h- m8 z, S
1 M$ I' j; I4 r% U4 ]/ V7 x' w
第32-44行代码:
; }1 E9 z5 w9 l从代码:<div id=”toptb” class=”cl”>到</div><!–{if !IS_ROBOT}–>0 E; ~' |' {: V, o- ]0 Z; L
代码解释:顶部文件,用于放置导航与dz内部的一些功能,<div class=”y”>右处内容</div>,<div class=”z”>左处内容</div>
9 R# x3 y5 P$ x0 _, t备注:在后台=》界面=》顶部导航。可以设置
: j2 i2 c7 Y  Q( L  M) Y) L. o
4 x& q- E8 ^; u! f第70-78行代码:( O. e: C0 o# E
$ g  Z; i9 ?4 s, p8 ?: q0 P
<!–{if !IS_ROBOT}–>
, }0 F& P. h; H2 v5 y                        <!–{if $_G[‘uid’] && !empty($_G[‘style’][‘extstyle’])}–>
1 t0 Y; T- e+ K7 N% b4 Z                                <div id=”sslct_menu” class=”cl p_pop” style=”display: none;”>$ H: ^2 Z+ q5 L0 {% ?/ ?
                                        <!–{if !$_G[style][defaultextstyle]}–><span class=”sslct_btn” onClick=”extstyle(”)” title=”{lang default}”><i></i></span><!–{/if}–>
5 l! B: u, }/ r) [& V3 p, c& g                                        <!–{loop $_G[‘style’][‘extstyle’] $extstyle}–>
9 `0 ?' G' l5 T$ n                                                <span class=”sslct_btn” onClick=”extstyle(‘$extstyle[0]’)” title=”$extstyle[1]”><i style=’backgroundextstyle[2]’></i></span>( Q7 m5 q4 L* }7 ]
                                        <!–{/loop}–>  C2 j1 B3 x7 R; H: O- N
                                </div>/ J0 L/ D( u& {7 J6 F3 k7 Q# V
                        <!–{/if}–>! ^2 q9 J/ H% S! N- k
/ Q' ]4 l$ `4 G! m
代码解释:此处是拓展色的切换的菜单8 T2 B% o* ^  `$ n! I
备注:如里不需要可以删除* W9 d+ f3 ]% y) ^, V9 E

% Y7 U5 g+ O+ S第80-96行代码:. l! s! f9 ], X2 v. O6 L
. w) @" y/ F9 y% G7 [
<div id=”qmenu_menu” class=”p_pop {if !$_G[‘uid’]}blk{/if}” style=”display: none;”>0 a. e/ F/ v0 f) B
                                        <!–{if $_G[‘uid’]}–>
; j6 _0 N. L- h                                        <ul>
3 O; K0 K# U7 m5 [( [                                                <!–{loop $_G[‘setting’][‘mynavs’] $nav}–>, A% K, v) n8 }. N: O' ]
                                                        <!–{if $nav[‘available’] && (!$nav[‘level’] || ($nav[‘level’] == 1 && $_G[‘uid’]) || ($nav[‘level’] == 2 && $_G[‘adminid’] > 0) || ($nav[‘level’] == 3 && $_G[‘adminid’] == 1))}–>: y$ C* f3 W6 l# k- o% ~  x
                                                                <li>$nav[code]</li>0 p# o9 `( _% h+ w! T6 o
                                                        <!–{/if}–>
. j" {9 q/ O; F0 R5 M+ H8 H                                                <!–{/loop}–>
/ D4 I( F- t; P% A; r                                        </ul>) v4 y4 G/ x/ }) R
                                        <!–{else}–>, C3 z: k7 K+ G
                                                <div class=”ptm pbw hm”>; r' C/ r) a- G5 Q/ x
                                                        {lang my_nav_login}
2 |2 ?4 |$ s+ v1 m  z  t8 L5 [* L+ Y                                                </div>
; P* _2 U, W: z. A- t" c3 |6 W. Y                                        <!–{/if}–>
0 M, c0 P* }5 {$ K6 U: z* L) r( l6 k7 I$ ]                                </div>7 h( r4 t* z* o7 w
                <!–{/if}–>$ @3 p0 k$ }- Z( u" s

1 F2 t1 l% _* `+ M; I$ A. C" {代码解释:此处是快捷导航弹出的菜单,里面用到了<!–{if $_G[‘uid’]}–>语句进行判断,意思是只有会员才可以浏览此处内容,循环我就不多讲了哈* j/ J# K* z$ y: Z. p) o
备注:<!–{if $_G[‘uid’]}–>语句可以用到很多地方,自己在做模板的时候,可能会用到!
1 T7 ]! P" @6 M9 Z* [5 c  N' x, h, C$ ]6 W1 \) f3 r# d6 H
第97行代码:
) j8 `, f& u7 h( n+ A4 Q6 t2 n, w. |* x% ?) k# m
<!–{ad/headerbanner/wp a_h}–>
4 D4 ~- x2 V' p2 @2 Z, t* Q
3 ]; }, t7 F1 P4 v代码解释:头部的广告代码,
0 w! j7 i' |0 z1 d1 x% ]) J备注:可以在后台=》运营=站内广告添加第98-184行代码:
- V* |3 U4 |- M; x! s6 [# R从<div id=”hd”>到 </div><!–{/if}–>
( V$ Y! A. T4 I) D9 |0 B1 M1 E代码解释:头部的核心文件3 ?8 d7 a6 w$ s+ h( e
备注:下面是头部核心的DIV指引
# y* {" d) A+ v+ T% p5 y/ E<div id=”hd”># k, a' ~. b9 ~; n$ r% o
<div class=”wp”>
* P9 i7 `0 F5 v. _  Z<div class=”hdc cl”>
1 f2 H- _! T, f% _/ x& a( k<h2>logo</h2>———————————->logo8 ?& d6 S( {0 V( w" g% f" n/ o
                 <div id=”um”>
# I" e5 ~. _* C2 K<div class=”avt y”>头像</div>—————————–头像- L" t5 S. @+ q8 `, O; B4 L/ A
                       <p>
/ w& t9 {- ]/ |- O<!–{hook/global_usernav_extra1}–>————————————>插件嵌入点1
0 k" @$ s: `2 x+ [7 J* ~/ q' {; J                          <!–{hook/global_usernav_extra2}–>———————————>插件嵌入点26 ~* m; H6 P0 F! m! |4 M
个人信息—————————————->个人信息
) h- c$ n- S+ l$ f' |- L2 p</p>
; I0 R1 t) q, N<p>
! Q+ k  x: |+ T" V, L4 H<!–{hook/global_usernav_extra3}–>—————————>插件嵌入点3
. h* W. e5 ?: H7 x9 m2 E* Z* O个人信息—————————————->个人信息# c3 X* `7 H1 E
</p>
; }/ i  u+ c8 y9 v0 q' f- d( Y</div>: k1 ]  u* U( y) |" A
<!–{template member/login_simple}–>—– > 登录框(此处调用member/login_simple.html文件)                         </div>, i  g# @/ y  K6 E$ `
<div id=”nv”>
; U3 m3 ]9 P5 c$ c<a href=”javascript:;” id=”qmenu” >快捷导航</a>————–>快捷导航$ F" I% {. n; t& r
                <ul>( W4 ^; v2 w7 p; G
<li>栏目导航</li>———————————>栏目导航" s8 l0 P8 K7 _5 L* |4 X. _, n& K
                 </ul>
, m2 C% S% Q5 @# D( }( a' `; f</div>8 [% G, p# l2 }/ e6 Q& X
<ul class=”p_pop h_pop” id=”plugin_menu” style=”display: none”>
2 S: P' c6 [. t3 G; s- J二级导航菜单样式——————————————————>二级导航菜单样式' {5 l  y* S) X( o# d
</ul>
+ g$ E0 h( b/ K8 d6 k/ W# ]! t< div id=”mu” class=”cl”>
! `" Y% l# e0 g3 c9 C二级导航横排>————->二级导航横排样式
+ |+ D7 E7 l  A: i, n0 A2 u8 F* c0 Q              </div>7 ~/ A  @2 S6 [9 p" q3 `
<!–{ad/subnavbanner/a_mu}–>————————->头部广告(后台站点广告处可以添加)
/ W, p* P# w' E7 U+ F& q$ J<!–{subtemplate common/pubsearchform}–>——–>搜索(此处调用common/pubsearchform文件)                   </div>9 R0 D* G, D+ m3 x; G
</div><!–{hook/global_header}–>插件嵌入点/ a2 R- G2 s9 O6 c, @

5 ]$ t4 h: u# f总结:大家在修改的时候他的每个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-8-15 12:27 , Processed in 0.142042 second(s), 59 queries .

Powered by 罗码网络! X3.4

© 2001-2017

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