Thursday, September 6, 2007

Flash header for blogger

一个简单教程,参考 Techno Juice,演示效果也在此。
1.备份原模板
2.贴图不说话

3.依旧贴图不说话

4.把flash文件上传至自己的空间,记住外链地址。
5.修改html,勾选“扩展窗口小部件模板”,找到"!--Show just the image, no text-- "这句,然后用下面的代码替换选中的蓝色代码部分(继续看图):

其中各项参数都是可以修改滴,src的地址要改成flash外链地址

6.保存模板,大功告成!

友情提醒:作者原文的第4-7步全部说的是css问题,作者的修改(调整宽度及去边框)是基于个人需要,仅供参考。
(1)header wrapper的修改
#header-wrapper {width:670px;margin:0 auto 10px;border:1px solid $bordercolor;}
变成
#header-wrapper {width:800px;margin:0 auto 10px;border:0px solid $bordercolor;}
(2)header的修改
#header { margin: 5px; border: 1px solid $bordercolor; text-align: center; color:$pagetitlecolor; }
变成
#header { margin: 5px; border: 0px solid $bordercolor; text-align: center; color:$pagetitlecolor; }
(3)outer wrapper的修改
#outer-wrapper { width: 760px; margin:0 auto; padding:10px; text-align:left; font: $bodyfont; }
变成
#outer-wrapper { width: 900px; margin:0 auto; padding:10px; text-align:left; font: $bodyfont; }
(4)main wrapper的修改
#main-wrapper { width: 410px; float: left;
变成
#main-wrapper { width: 510px; float: left;

0 Comments:

Post a Comment

Subscribe to Post Comments [Atom]

<< Home