软件简介:4 Y- J2 u C6 Q* D4 s
大家好,我是NetPuter(QQ:279692373)
5 H" m1 t5 m v. _我的 远景ID:网海飞龙 黑鹰ID:网海飞龙 (以前的网名)
) h+ {" T! E- P& o/ W今天给大家带来的教程是:BlogBus模板美化系列教程 之三!1 z7 r% F: M% H* Y; x0 v8 `$ c
本次系列教程的大概安排:
: S: l6 J1 l. X- e3 I1 _$ ?; n8 K0 B* d1.BlogBus模板介绍,简单修改模板(以 玩美I 为例)! C( {: h4 I# ~& O( Y6 C6 H2 A4 {
2.BlogBus模板之Vista模板制作(以 玩美II 为例) N l" m! \8 V$ v
3.BlogBus模板细节修改) r" e; E- A: `" I( Y+ A7 Q+ \
感谢远景(http://BBS.PCBeta.Com)提供交流空间,感谢黑鹰(http://www.3800HK.Com)提供下载空间^_^: m! X3 m; n, p( T: x8 W6 {
今天的教程是:BlogBus模板细节修改.' Y6 q' O) ?/ {
博客除了要有漂亮的模板,还要布局的合理,内容的精彩.今天给大家带来几个小玩具.2 L, a8 ^! [2 e' T9 e D2 n! j: k' [
1.文章置顶; ]& Z6 C# G& l, L/ t7 M* J
2.留言板2 t, V- @! ? S7 x. {
3.Google广告9 R) C: B) G) i _# n. V& Q$ \+ O5 F
4.模块调整5 ~. k5 W& g, f) P5 }5 D
好,现在开始教程!( y9 T/ K+ c$ B. P; D
*************************华丽的分割线*************************; }' i( A0 f2 g& ]
首先是文章置顶.相信大家博客都有一些公告或者什么文章需要置顶的吧!但是BlogBus没有提供这一功能,网上也有文章说使用代码可以实现文章的置顶,但是那样实在是太麻烦了!而且对于某些模板还不能用!而我的方法更为简单----修改时间!因为BlogBus默认采用的排序,所以最新(也就是最晚)的文章显示在最上方!因此,如果把发表时间修改为未来的某一天,那么到这一天前这篇文章都是在最上方的!下面看我操作,就不多打字了.& B _8 l( m! Y) w I
先写一篇日志!刚刚才想起来,我的电脑的Maxthon2不能在BlogBus上发表文章,只有在IE才可以,由于时间关系,就先这样吧!大家可以看到,新文章BlogBus模板美化系列教程 之三在最下方,好,我们修改在下面的文章,让它置顶!在时间那儿.好我们刷新一下!看到了么,文章在最上面了,在2008.7.24之前一直都是置顶的!
* N3 D/ M$ W( {8 G4 M3 h3 t------------------------------------------------------------------------------
$ ]' ^5 n/ g7 Q下面就是留言板.留言板就不用我们多介绍了吧!我们今天要申请的是类似于这样的留言板.下面看我操作.
+ y5 t; j. Z3 Q(鼠标不是很好用.)
# |5 v1 c; w9 c0 B2 o, [申请地址:http://www.cbox.ws/getone.phphttp://www.cbox.ws/getone.php
- l8 u# |( d, S然后填写表格.Skin这里,可以选择皮肤!后面我们可以自己修改!这里我就选择默认的吧!. N' C: Y, O6 I2 B0 w+ @
Your cbox has been created!3 r( e: y7 e5 X/ u
We have sent your login details to the email address you provided. You may now log in and get your cbox up and running right away.
K$ ^9 j0 ]5 `) j9 @9 c/ ]Your cbox has been created!8 I( o; U. t5 w: K) n) }
We have sent your login details to the email address you provided. You may now log in and get your cbox up and running right away.
R7 X* g, P2 V+ A" Q好,现在我们登陆!好,这里就是后台,左侧的菜单我们可以看看,设置.% {2 u6 b: b2 o$ P. y
我们的留言本的代码:5 G" V0 M5 |; a0 p& A, [ c, c* @
!-- BEGIN CBOX - www.cbox.ws --
9 E6 ^ D/ h! |div align=center id=cboxdiv/ A2 b; R6 [2 P# v; l9 n
iframe frameborder=0 width=160 height=305 src=http://www4.cbox.ws/box/?boxid=3381713 marginheight=2 marginwidth=2 scrolling=auto allowtransparency=yes name=cboxmain style=border:#DBE2ED 1px solid; id=cboxmain/iframebr/; k+ F. K' Z T' N* D: L' E
iframe frameborder=0 width=160 height=75 src=http://www4.cbox.ws/box/?boxid=3381713 marginheight=2 marginwidth=2 scrolling=no allowtransparency=yes name=cboxform style=border:#DBE2ED 1px solid;border-top:0px id=cboxform/iframe
/ q# R) L& X6 C8 Z/ m/div% U* P- [" a' l" A' }7 k
!-- END CBOX --!-- BEGIN CBOX - www.cbox.ws --
+ T1 E- J. {) n/ Ediv align=center id=cboxdiv- M4 W# ?" V$ E9 M: j! y7 |
iframe frameborder=0 width=160 height=305 src=http://www4.cbox.ws/box/?boxid=3381713 marginheight=2 marginwidth=2 scrolling=auto allowtransparency=yes name=cboxmain style=border:#DBE2ED 1px solid; id=cboxmain/iframebr/- @7 P3 o( o6 x% u: _
iframe frameborder=0 width=160 height=75 src=http://www4.cbox.ws/box/?boxid=3381713 marginheight=2 marginwidth=2 scrolling=no allowtransparency=yes name=cboxform style=border:#DBE2ED 1px solid;border-top:0px id=cboxform/iframe8 x5 q7 T% n- }2 N. r5 s
/div$ D3 T! e: N* W
!-- END CBOX --- z) {9 y: U7 n3 N
国外的网站有点慢.在Cbox Options可以设置长宽.我们默认
6 I5 Q$ p+ s8 Q9 w7 q- x在 Colors 以网养网,如果博客流量大的话其效益也是不言而喻的!关于Google广告的申请我就不多介绍了,下面我们获得广告代码!
1 E$ S3 u& t, m! k. D, ], ] i N这就是我们的代码:
! f+ r2 M. D) r0 [script type=text/javascript!--
6 B; q. R& R& z% k$ Fgoogle_ad_client = pub-5887133461851770;
* J) R; W# @+ o- ugoogle_ad_width = 728;
/ N" B3 L3 K5 i8 ^% ^. egoogle_ad_height = 15;+ e4 a. ^4 f5 m' b `
google_ad_format = 728x15_0ads_al_s;
/ j/ [! q2 A N! F9 Y//2007-09-02: 软件, 美化, 博客, XP, Vista
+ K& \6 C) U( v$ vgoogle_ad_channel = 5687494152+7397746446+7707635961+0854331436+1945272108;
+ [* m2 }6 A+ z: i, Q" y- k//--& W/ X/ v6 h: \) j' d& x
/script
6 R% o) M& \( O5 g `script type=text/javascript+ K2 g) Z' J# h1 S( L
src=http://pagead2.googlesyndication.com/pagead/show_ads.js
/ @$ m9 s: K0 A/ D4 i; |2 ]7 N/scriptscript type=text/javascript!--2 n& T/ F* q% {1 ^7 S
google_ad_client = pub-5887133461851770;7 a5 L! e; L6 s( p( \. J- Z1 ^+ |4 R
google_ad_width = 728;
* X8 A5 H* q: v5 N6 d' y+ e8 p, _google_ad_height = 15;
" C7 s- P0 D+ o; ~; X* {google_ad_format = 728x15_0ads_al_s;
4 t! l$ f4 y4 u1 m& @% q/ ?0 [//2007-09-02: 软件, 美化, 博客, XP, Vista; t1 M. L2 U' g4 { S, s
google_ad_channel = 5687494152+7397746446+7707635961+0854331436+1945272108;
; c( E; ^3 k0 O7 V& d7 g//--6 F) l+ J0 w4 k1 d& {
/script- x8 [3 ?; }, Y. Z1 ]/ O. z3 l* E- K6 r
script type=text/javascript# {$ r) S8 y4 ]
src=http://pagead2.googlesyndication.com/pagead/show_ads.js; t' I, o/ K) d% H
/script2 t% |# _% V# h) V: ?
我们等下在添加+ A' v g8 j( W, j0 \0 W4 N( m
------------------------------------------------------------------------------
6 m+ W, q7 F, r! d最后是模块调整.在BlogBus模板设置里有许多代码块,它们分别是:
1 o% h7 ]& P4 V* T5 ~/ c- }Header (无多大用处,但是又不能不用)
1 v0 S! ~( [+ r$ t+ @2 VIndex (首页,分类和按存档浏览页面的代码)
% I" q3 N, I: @5 }% J- iIndex.LogContent (首页显示文章的代码) 7 _2 v' G6 M8 y- q
Log (文章页面的代码)
1 O' y: X* D" e2 K3 Q) D+ Y! kComment (文章评论内容的代码)
5 a3 m7 O& W, z) e" J3 A* k! o3 OComment.Form (文章评论发表的代码)
2 j9 d' J1 M3 O* z4 ICSS (样式表代码,应用于Header,Index,Log中,非常重要)4 H& ]+ W- f* e4 x
我们需要修改的是Index和Log,这里我以Index为例,Log的修改类似.( S9 K, M$ `! ^
我们打开Index代码块!将其内容备份(重要)!再将其放在记事本里.% H3 j8 [& T K1 d1 w
这就是Index的代码!我们可以看到,有许多的DIV标签,这就类似于表格一样,一个DIV标签里有一个内容.现在,我们在合适的位置里添加留言版代码.在HTML里空格和换行都是不影响代码的.然后添加广告.好了,代码就是这样!如果需要给模块换位,就直接把DIV标签块转移就好了,比如说我把登陆放在下方!就是这样,我们把内容放回Index中.现在我们打开看看!
! Q [7 R; ?4 u t可能是电脑问题吧,怎么复制都复制双份./ Z4 {/ j4 F( s% w' ]! ?4 K i% G
*************************华丽的分割线*************************
- k- X# K3 o% ]9 H/ _. Y1 J8 a; R5 M到此,本系列教程的内容就全部结束了!
7 M8 u& c( k1 c- `0 e如果有任何问题,欢迎与我交流(QQ:279692373)
$ z6 V1 W9 Y: F( |. ] t# t( I, v8 y同时欢迎大家到我的博客:5 [" Y8 j2 U- K0 o! m: n+ n
玩美[FunStyle]:http://NetPuter.BlogBus.Com9 }# [% s8 S! x7 z2 S3 B' q V
大家88!: {! X+ z7 ^% @& H2 P
下载地址:
|