软件简介:% e5 Z% l7 i+ p$ h" f8 ^- ]. a
大家好,我是NetPuter(QQ:279692373)' U0 ], T# ]8 |; {4 N
我的 远景ID:网海飞龙 黑鹰ID:网海飞龙 (以前的网名)
6 B& g A- e0 `) C* s' W* C7 a7 u今天给大家带来的教程是:BlogBus模板美化系列教程 之三!- I( |) O5 T2 v* s# n3 }
本次系列教程的大概安排:
+ Q f/ I3 }% b J. U' {1.BlogBus模板介绍,简单修改模板(以 玩美I 为例), b2 v! ^3 i; \, k# w3 Y; l2 w
2.BlogBus模板之Vista模板制作(以 玩美II 为例)
8 V6 |) m+ @1 `% G3.BlogBus模板细节修改
& s+ t3 `0 z/ v9 J- K2 j$ S感谢远景(http://BBS.PCBeta.Com)提供交流空间,感谢黑鹰(http://www.3800HK.Com)提供下载空间^_^
# t/ b% J+ S" P V! n, F6 w4 @今天的教程是:BlogBus模板细节修改.* H; |: E& Q# X+ g$ L
博客除了要有漂亮的模板,还要布局的合理,内容的精彩.今天给大家带来几个小玩具.% b4 k& Y6 L( E: v6 P5 O
1.文章置顶; ^: ]& R9 ?1 u. o7 z, t+ L% k
2.留言板
$ S8 q& x3 \/ m. ?1 Z3.Google广告
7 b' T8 G/ F* o3 Y$ r# A$ Y4.模块调整
6 H) x M. ^0 \0 v, D% x/ \' i" ?+ l好,现在开始教程!
; c( h. O1 U) d& J6 C*************************华丽的分割线*************************2 O/ T* D m% P& f$ I8 d6 W" p9 w
首先是文章置顶.相信大家博客都有一些公告或者什么文章需要置顶的吧!但是BlogBus没有提供这一功能,网上也有文章说使用代码可以实现文章的置顶,但是那样实在是太麻烦了!而且对于某些模板还不能用!而我的方法更为简单----修改时间!因为BlogBus默认采用的排序,所以最新(也就是最晚)的文章显示在最上方!因此,如果把发表时间修改为未来的某一天,那么到这一天前这篇文章都是在最上方的!下面看我操作,就不多打字了.. O) R2 ]' ~7 p8 _/ |; L
先写一篇日志!刚刚才想起来,我的电脑的Maxthon2不能在BlogBus上发表文章,只有在IE才可以,由于时间关系,就先这样吧!大家可以看到,新文章BlogBus模板美化系列教程 之三在最下方,好,我们修改在下面的文章,让它置顶!在时间那儿.好我们刷新一下!看到了么,文章在最上面了,在2008.7.24之前一直都是置顶的!
8 A* N3 a, B! B------------------------------------------------------------------------------
2 @$ [5 E+ U- [" R下面就是留言板.留言板就不用我们多介绍了吧!我们今天要申请的是类似于这样的留言板.下面看我操作.2 T Y5 {! i* o# f+ D& J
(鼠标不是很好用.)) e7 C& x2 d2 l1 o7 W3 T. x7 H
申请地址:http://www.cbox.ws/getone.phphttp://www.cbox.ws/getone.php f0 J: y7 I% t, V" l) F& z
然后填写表格.Skin这里,可以选择皮肤!后面我们可以自己修改!这里我就选择默认的吧!6 H6 J0 M" O I6 X
Your cbox has been created!
5 a8 M/ Q# @- f" K1 I3 I2 W! Z* m( `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.
2 b8 X3 |. f: l) o* c% QYour cbox has been created!
- _$ z9 ]; M0 B/ N. f, HWe 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.2 ]+ C' @9 {5 C
好,现在我们登陆!好,这里就是后台,左侧的菜单我们可以看看,设置.
: u* g* p/ W" j& {) ^- P我们的留言本的代码:* H m. `% Y& B
!-- BEGIN CBOX - www.cbox.ws --4 u# k) U) C- t+ G9 ?, C
div align=center id=cboxdiv
2 X2 o9 r; q* r0 h2 u5 {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/1 z* w y% F! f8 t+ w
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
% A, Q2 H4 w/ S( a k5 Y/div! Q8 P& v6 X7 S
!-- END CBOX --!-- BEGIN CBOX - www.cbox.ws --
) B0 U1 `$ x0 x" B! ]div align=center id=cboxdiv! o" I+ W5 g2 y) P) e
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/0 G3 R5 H/ `3 I. [, J
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" U' n( L' Q2 E2 `2 f5 m, Z& p
/div3 T: ?8 ^& J+ f. t9 y
!-- END CBOX --, C; X8 e& o1 T# z5 T- P% t
国外的网站有点慢.在Cbox Options可以设置长宽.我们默认
2 R( |1 v4 }" F2 j. B8 W5 b, K. q) ?( |在 Colors 以网养网,如果博客流量大的话其效益也是不言而喻的!关于Google广告的申请我就不多介绍了,下面我们获得广告代码!/ a& H/ \+ U% l x
这就是我们的代码:1 z/ Q# l& g3 l0 ^% {
script type=text/javascript!--
. K4 z* J4 R/ R! x4 W3 |& c# Vgoogle_ad_client = pub-5887133461851770;( T4 e+ \ u3 h8 l
google_ad_width = 728;# c3 G2 |8 d. n$ d" ]) k
google_ad_height = 15; b% R( ~0 U0 a! _/ q t* k( ]
google_ad_format = 728x15_0ads_al_s;
% r4 g, `* D8 F1 S- f( u6 ` {# o//2007-09-02: 软件, 美化, 博客, XP, Vista1 Q2 F9 c7 `8 c4 d3 _4 r
google_ad_channel = 5687494152+7397746446+7707635961+0854331436+1945272108;
& Q3 G$ }- X) e% q. O( k' B6 [: c//--
9 k3 F ~1 t% K1 ]4 T3 S \' f3 e4 S/script. t L L4 G) ]
script type=text/javascript# U. y( s2 H4 x' d" x
src=http://pagead2.googlesyndication.com/pagead/show_ads.js1 F8 x1 V9 c" }( V% l8 Z: X
/scriptscript type=text/javascript!--
1 e3 J' D& `3 D, Egoogle_ad_client = pub-5887133461851770;
5 S$ O. d( W5 _+ igoogle_ad_width = 728;
. N8 x/ s# n q6 @% _google_ad_height = 15;. |. g4 g4 T; d% P+ ~
google_ad_format = 728x15_0ads_al_s;
`" l9 [. ?2 V7 I- g. {, h//2007-09-02: 软件, 美化, 博客, XP, Vista# ]: e5 c& I4 g. g w
google_ad_channel = 5687494152+7397746446+7707635961+0854331436+1945272108;8 y3 k' v$ p4 g v
//--* Z8 ?) Y$ B8 \
/script
4 j8 F- P6 N1 }- T. I4 _3 h5 bscript type=text/javascript8 ]5 g; y* F- F7 B9 i# k
src=http://pagead2.googlesyndication.com/pagead/show_ads.js
}3 k5 I0 p$ B' J7 U' r/script
: d4 H: W3 q# Z. ?2 [0 ~' G我们等下在添加
3 \# {& l' }* M7 L4 w------------------------------------------------------------------------------3 P8 v" x$ ^5 ~
最后是模块调整.在BlogBus模板设置里有许多代码块,它们分别是:
& ^4 f- H* s5 \' l# h9 aHeader (无多大用处,但是又不能不用): S$ u/ F* h0 Q9 y$ Q
Index (首页,分类和按存档浏览页面的代码)
6 n1 ?7 a5 V* x1 _9 b8 `Index.LogContent (首页显示文章的代码)
. y$ e$ b5 s1 B \3 [! n' G0 cLog (文章页面的代码)
1 A: z/ [" M: |* e, a" H4 I0 K- X. W EComment (文章评论内容的代码)
1 ~ E* D8 j7 }: T' D% FComment.Form (文章评论发表的代码)9 E$ n) K, a% B" p5 k
CSS (样式表代码,应用于Header,Index,Log中,非常重要)
! g$ ^& W. ^; C) I8 v+ H8 [" Y7 s我们需要修改的是Index和Log,这里我以Index为例,Log的修改类似.2 S8 u! h$ A# I) E
我们打开Index代码块!将其内容备份(重要)!再将其放在记事本里.
; f) T0 ~0 B, R8 k) r这就是Index的代码!我们可以看到,有许多的DIV标签,这就类似于表格一样,一个DIV标签里有一个内容.现在,我们在合适的位置里添加留言版代码.在HTML里空格和换行都是不影响代码的.然后添加广告.好了,代码就是这样!如果需要给模块换位,就直接把DIV标签块转移就好了,比如说我把登陆放在下方!就是这样,我们把内容放回Index中.现在我们打开看看!! _- h; n& i/ n2 l: t
可能是电脑问题吧,怎么复制都复制双份.8 y) ~! A- y' U9 {6 F6 F
*************************华丽的分割线*************************
* q# }2 [1 H5 g" v' h到此,本系列教程的内容就全部结束了!
6 b8 ~, V" w& Q' Q如果有任何问题,欢迎与我交流(QQ:279692373)7 Y' U5 o) P$ t
同时欢迎大家到我的博客:; m. T( V7 }0 |" U2 w$ A3 U- w
玩美[FunStyle]:http://NetPuter.BlogBus.Com1 H0 M$ p" s# O& f1 o
大家88!
% _6 D) A" x7 z下载地址:
|