对不住大家了,偶最近比较忙,请大家原谅!

X-Space教程——详解模板源代码

上一篇 / 下一篇  2006-09-09 15:33:11 / 天气: 晴朗 / 心情: 高兴 / 个人分类：BLOG相关分享

查看( 599 ) / 评论( 6 )

模板初始代码:

<DIV class=wrap>
#M;R5d+z d9[0<DIV id=header>
8M0_:t[P:]ON0<DIV id=poweredby></DIV>
#]S0zxr4LkF0<DIV id=menu>{{menu}} </DIV>爱好者博墅z3j9q2f/A | aMb
<DIV id=spacename>{{spacename}} </DIV></DIV>
$Cs~l4x,R$YH0<DIV id=content>
*W{`\dd}0<DIV id=sidearea>爱好者博墅0`z3l_md?l
<DIV class=sideblock id=useravatar>{{photo}} </DIV>
{&T j ]7e??:UW0C"o0<DIV class=sideblock id=useraction>爱好者博墅Y$MW&W7g[c T#a
<H3>用户菜单</H3>{{action}} 爱好者博墅 N$E"}}ah}#RGOc
<DIV class=hackbox></DIV></DIV>
1m[joE6BC0<DIV class=sideblock id=calendar>爱好者博墅O VD sJk
<H3>日历</H3>{{calendar}} </DIV>爱好者博墅5DJ pm,tAd9l,n
<DIV class=sideblock id=archive>爱好者博墅&Bl8V4V:tl
<H3>存档</H3>{{archive}} </DIV>爱好者博墅#y"} S{C7{X
<DIV class=sideblock id=search>
Gyw m3GF$kCT0<H3>搜索标题</H3>{{search}} </DIV>爱好者博墅&HkOu-A9Q
<DIV class=sideblock id=infomation>爱好者博墅I9y M!} yE.e n
<H3>统计信息</H3>{{information}} </DIV>
pv?R#^h$?V U0<DIV class=sideblock id=newreplay>爱好者博墅,j#jG0U.u;GD$z7J:k
<H3>最新评论</H3>{{newcomment}} </DIV>爱好者博墅3|(h R/J+t U(wO
<DIV class=sideblock id=favorite>爱好者博墅4QL{i*W_
<H3>我的收藏</H3>{{favorite}} </DIV>爱好者博墅PQ'^,b6K*u]
<DIV class=sideblock id=myfriend>爱好者博墅$?ND2^$s `
<H3>我的好友</H3>{{friend}} </DIV>爱好者博墅$zSX"Jf{z2u3@
<DIV class=sideblock id=userlink>爱好者博墅 GVv%yX4QI+M(Ju(|
<H3>友情链接</H3>{{userlink}} </DIV>爱好者博墅yc3N#]-J%{f8n
<DIV class=sideblock id=guestbook>
%O6{#@-Lt0<H3>最新留言</H3>{{newguestbook}} </DIV><!--{if music}-->爱好者博墅3`4m[|E,wx?R
<DIV class=sideblock id=music>{{music}} </DIV><!--{/if}-->
:H$y5el-RuD`\v0<DIV class=sideblock id=sideicons>爱好者博墅k7Eiq.y*HO:?
<H3>RSS订阅</H3>{{xml}} </DIV></DIV>
`|Q3p]oxa0w0<DIV id=mainarea>爱好者博墅O6\t"m2| Y-s)Y&O
<DIV id=guide>{{guide}}</DIV><!--{if announcement}-->爱好者博墅)r-R V6FC+n J+CM
<DIV id=announcement>{{announcement}} </DIV><!--{/if}--><!--{if blog}-->
.BEUY"T0<DIV id=blog>
zL&t4]X|V9Vo0<H3>我的日志</H3>{{newblog}} </DIV><!--{/if}--><!--{if mybbs}-->爱好者博墅uOS%^j'vhY
<DIV id=formmessage>
X&e$C;Kk0j_0<H3>论坛文集</H3>{{bbsthread}} </DIV><!--{/if}--><!--{if image}-->
7E3Oe RW2Dm0<DIV id=imagelist>爱好者博墅!Btp0m-w
<H3>我的图片</H3>{{newimage}} </DIV><!--{/if}--><!--{if file}-->
yu)TI;EmC f0<DIV id=file>
?] V2L3f%r?9DQ[ T0<H3>我的下载</H3>{{newfile}} </DIV><!--{/if}--><!--{if goods}-->
-L0f4j2m+n.N(s0kmR d0<DIV id=goods>
mt4u.Q0rl yb!o0<H3>我的商品</H3>{{newgoods}} </DIV><!--{/if}--><!--{if link}-->
j-Kqe*tw;G$P2k7Y0<DIV id=link>爱好者博墅cB#s ZxQ
<H3>我的书签</H3>{{newlink}} </DIV><!--{/if}--></DIV>
4[h9D3_0[~:qT+S0<DIV class=hackbox></DIV></DIV></DIV>

 

上面是一个未修改的模板的源代码，也许看着比较杂乱，我们可以将其从新规整一下

 

模板规整后的代码

<DIV class=wrap>
Oz C'bE0    <DIV id=header>
xMM P'F{s*V3K&?0        <DIV id=poweredby></DIV>爱好者博墅,i+^ j.?o |5Jb7L
        <DIV id=menu>{{menu}} </DIV>爱好者博墅v.[%m%us2g3t
        <DIV id=spacename>{{spacename}} </DIV>

    </DIV>爱好者博墅q#{tmT
    <DIV id=content>爱好者博墅4H+p$Y+PL,f(T ?
        <DIV id=sidearea>爱好者博墅rh)c+{L
            <DIV class=sideblock id=useravatar>{{photo}} </DIV>
E7k?o'u.g0            <DIV class=sideblock id=useraction>
_)G C B`l~:q0                <H3>用户菜单</H3>{{action}}
NE2Ivh'e/f!C0                <DIV class=hackbox></DIV>

            </DIV>
K2? pN&f0UeP0            <DIV class=sideblock id=calendar><H3>日历</H3>{{calendar}} </DIV>爱好者博墅&LH @?5|#B gF[+bz
            <DIV class=sideblock id=archive><H3>存档</H3>{{archive}} </DIV>
(L XdN6ot0            <DIV class=sideblock id=search><H3>搜索标题</H3>{{search}} </DIV>
kT#pR ?.ALa4aHy0            <DIV class=sideblock id=infomation><H3>统计信息</H3>{{information}} </DIV>
a:U4S*[j4[s D0            <DIV class=sideblock id=newreplay><H3>最新评论</H3>{{newcomment}} </DIV>
}tbN(x(yj l0f-Z0            <DIV class=sideblock id=favorite><H3>我的收藏</H3>{{favorite}} </DIV>爱好者博墅?_+]P%G0S u|x w
            <DIV class=sideblock id=myfriend><H3>我的好友</H3>{{friend}} </DIV>
QERI&NG1Y0            <DIV class=sideblock id=userlink><H3>友情链接</H3>{{userlink}} </DIV>爱好者博墅1W&[%h mi:Fzm&r
            <DIV class=sideblock id=guestbook><H3>最新留言</H3>{{newguestbook}} </DIV>

            <!--{if music}--><DIV class=sideblock id=music>{{music}} </DIV><!--{/if}-->
'm2?Mv;Q&n0            <DIV class=sideblock id=sideicons><H3>RSS订阅</H3>{{xml}} </DIV>

        </DIV>爱好者博墅FV*e h |l7Ic*J;r
        <DIV id=mainarea>爱好者博墅"?&A#_~%^.e
            <DIV id=guide>{{guide}}</DIV>

            <!--{if announcement}--><DIV id=announcement>{{announcement}} </DIV><!--{/if}-->

            <!--{if blog}--><DIV id=blog><H3>我的日志</H3>{{newblog}} </DIV><!--{/if}-->

            <!--{if mybbs}--><DIV id=formmessage><H3>论坛文集</H3>{{bbsthread}} </DIV><!--{/if}-->

            <!--{if image}--><DIV id=imagelist><H3>我的图片</H3>{{newimage}} </DIV><!--{/if}-->

            <!--{if file}--><DIV id=file><H3>我的下载</H3>{{newfile}} </DIV><!--{/if}-->

            <!--{if goods}--><DIV id=goods><H3>我的商品</H3>{{newgoods}} </DIV><!--{/if}-->

            <!--{if link}--><DIV id=link><H3>我的书签</H3>{{newlink}} </DIV><!--{/if}-->

        </DIV>爱好者博墅/N"L8zh$~ \
        <DIV class=hackbox></DIV>

    </DIV>

</DIV>

 

代码详解：

 

外围框架：

<DIV class=wrap></DIV>    整个页面的外围框架，如我的BLOG底部的版权信息，就是放在外围框架之外的

顶部框架：

<DIV id=header></DIV>     顶部框架，其中包含了

        <DIV id=poweredby></DIV>               
u9G [5[q6W/z0        <DIV id=menu>{{menu}} </DIV>              这两项随意怎么修改并不会引起任何变化-___-|
HA/\&S,o{ DK0        <DIV id=spacename>{{spacename}} </DIV>    显示你的BLOG名称以及复制网址、加入收藏夹按钮及BLOG地址

内容框架：

 <DIV id=content></DIV>    内容框架，其中包含了

        <DIV id=sidearea></DIV>        侧边栏框架，其下包含的元素均比较容易理解，我就不详细描述了，只提一下音乐播放器部分

            <!--{if music}--><DIV class=sideblock id=music>{{music}} </DIV><!--{/if}-->

            <!--{if music}--><!--{/if}-->用于辨别是否添加了音乐地址，如果“否”则不显示音乐播放器      

        <DIV id=mainarea></DIV>        主要部分框架，其下内容有中文标题，应该不难理解，我说说前两项：

            <DIV id=guide>{{guide}}</DIV>    用于显示“系统功能”菜单，什么是系统功能？请查看空间管理－配置

            <!--{if announcement}--><DIV id=announcement>{{announcement}} </DIV><!--{/if}-->    用于显示“个人公告”，什么是个人公告？请查看空间管理－配置

 

如果你想要于BLOG页面中插入一些元素，只需要通过上面的介绍，找准相应的位置，插入相关代码即可。

 

当然，你也可以通过对上面内容的了解，去掉、加入、修改或者从新布局那些功能模块。

 

如果你把模板代码修改的乱七八糟了，别担心，在空间管理－浏览模板中，删除你修改的模板，从新导入你选择的从头再来即可

 

 

 

最后再说几个写作中常用到的代码：

 

1、目录树

 

增加一个章节，左侧目录树中参照以下更改：

……爱好者博墅5m%Vc9ts!AQ9o2OU
<li><a href="http://www.edonkey2000.cn/blog/i2616">X-Space系列教程——详解模板源代码</a>
k5G f5n?s Z0　　<ul>
O6@&K6DeR*j0　　　　<li><a href="http://www.edonkey2000.cn/blog/i2616#2_1">模板初始代码</a></li>爱好者博墅_RL7qT6p%vvRm
　　　　<li><a href="http://www.edonkey2000.cn/blog/i2616#2_2">模板规整后的代码</a></li>爱好者博墅Ydi CU8m
　　　　<li><a href="http://www.edonkey2000.cn/blog/i2616#2_3">代码详解</a>爱好者博墅t"W-Z[?_/F@"n
　　　　　　<ul>爱好者博墅pL:V%v? D|
　　　　　　　　<li><a href="http://www.edonkey2000.cn/blog/i2616#2_3_1">外围框架</a></li>
lQ,}qG!? y h_0　　　　　　　　<li><a href="http://www.edonkey2000.cn/blog/i2616#2_3_2">顶部框架</a></li>
-E+rl+c E0　　　　　　　　<li><a href="http://www.edonkey2000.cn/blog/i2616#2_3_3">内容框架</a></li>爱好者博墅4}I&z Ut&s0M"P sg
　　　　　　</ul>爱好者博墅MF s:l;qd k*s
　　　　</li>
1R N#L]M0　　</ul>
K2ag m:C!m&d4Dgp0</li>
6Y)pXv:~ Zi:AH`0……

效果：

……
  • X-Space系列教程——详解模板源代码 　　

    ……

    与目录树中的链接相对应，文档中应添加相应的锚点：

    <H4 id=2_1>模板初始代码:</H4>

    ……

    <H4 id=2_2>模板规整后的代码</H4>
    H o0aMaK S o0……
    b'IIG ?-ba9Sl0<H4 id=2_3>代码详解：</H4>爱好者博墅1Tp8LQ?
    ……爱好者博墅.a@+p;],`"p9U_-]
    <H5 id=2_3_1>外围框架：</H5>
    3h;~ZXT:mf'caF"L0……
    Y8u+g0R8\0<H5 id=2_3_2>顶部框架：</H5>
    '?[A4vm? m0……
    ;d(fh^t Q0<H5 id=2_3_3>内容框架：</H5>

    2、标题

     

    页面中的大标题用

     

    <h1>标题1</h1>

    <h5>标题5</h5>

    效果如下：

    标题1

    标题5

     

     

    3、列表

    • 有序列表用

    <ol>
    !] q3K|-Wuf0　　<li>列表1</li>爱好者博墅Nz:WJzU$E)Z^
    　　<li>列表2</li>
    ,j"y`'b$}3T;q0</ol>

     

    显示效果为：

    1. 列表1
    2. 列表2
    • 无序列表用

    <ul>
    K/\"o_p1vyfV^0　　<li>列表1</li>爱好者博墅$|k oAtcw
    　　<li>列表1</li>
    $n@/}$l-q0</ul>

     

    显示效果为：

    • 列表1
    • 列表2

     

    4、其它

     

    编写源代码

    • 文字段落请用<p></p>
    • 中文的标点请用全角
    • 删除不必要的空格
    • 英文可部分应适当大写

     

    这里我只介绍了“主页面”的代码，“索引页面”和“内容页面”基本是一致的


    • 论坛模式 推荐 收藏 分享给好友 推荐到圈子 管理

    TAG: 情感 BLOG相关分享

    一天 akira 发布于2006-09-09 15:35:12
    不懂，略过
    ~Endless~ jack54gwt 发布于2006-09-09 15:37:39
    慢慢看还是很好理解的
    影 飘落 发布于2006-09-09 15:42:02
    框架网页。偶还是蛮喜欢的了现在。blog.cfan.com.cn        p;H'l9YTt,D
    以前觉得不爽。现在觉得框架网页真是好啊。
            j9[
    GJ3C*`    还有嵌入式的也好。电脑爱好者|电脑爱好者论坛|电脑爱好者网站|软件使用|软件技巧|数码使用|数码技巧|硬件使用|硬件技巧%u,F?\ G
    不喜欢DIV
    ℡語無倫次ゞ's universe ℡語無倫次ゞ 发布于2006-09-09 15:44:04
    很麻烦
    (d?-K:GMMC ~$}电脑爱好者|电脑爱好者论坛|电脑爱好者网站|软件使用|软件技巧|数码使用|数码技巧|硬件使用|硬件技巧
    uq'zb*r-K;W4Cr电脑爱好者|电脑爱好者论坛|电脑爱好者网站|软件使用|软件技巧|数码使用|数码技巧|硬件使用|硬件技巧用别人的
    ~Endless~ jack54gwt 发布于2006-09-09 15:58:49
    原来有些没显示出来怪不得会看不懂，从BLOG导过来就是有些不方便啊，希望Discuz!能尽快改正~呵呵
    小蜗牛的壳 飞出黑洞的cpu 发布于2007-04-10 15:58:44
    看来我得好好研究研究了
    我来说两句

    (可选)

    日历

    « 2008-12-05  
    日 一 二 三 四 五 六
     123456
    78910111213
    14151617181920
    21222324252627
    28293031   

    数据统计

    • 访问量: 229147
    • 日志数: 66
    • 图片数: 14
    • 建立时间: 2006-06-07
    • 更新时间: 2007-10-02

    RSS订阅

    Open Toolbar