墙人使用Blogger.com新模板的方法(仅供参考)

这篇文章适用于使用ghs反向代理绑定BloggerBlogger用户。其他同学请无视这篇文章。

Blogger.com升级推出了新的模板样式,新模板更加漂亮,修改模板样式更加容易,但是我们使用新模板后如果在不使用代理的情况下会发现页面排版一塌糊涂,侧边栏无法正常显示,这是因为有一些代码被写在了一个专门的css文件里面:
<link type='text/css' rel='stylesheet' href='http://www.blogger.com/static/v1/widgets/4246919960-widget_css_2_bundle.css' />
注:这段数字每个人的每个博客都不一样,可以在博客源代码中查看到.
我首先想到的方法是把这个文件保存到没有被和谐的地方,然后对其进行引用,我把代码放在了Google Code存储,把这段代码加在<head>前面:
<meta content='tc' http-equiv='Default-Style'/>
<link href='http://forbloggeruse.googlecode.com/svn/trunk/bundle.css' rel='stylesheet' title='tc' type='text/css'/>
经过测试发现这个方法只是对IE8下有效,能正常显示,Firefox3.66,chrome 6.0均不能正常显示,后来想到的方法是直接把这个文件里的css代码复制到模板里面,还真是奏效了,在不使用代理的情况下,IE8,Firefox3.66,chrome 6.0均能显示正常,IE6下显示有点小问题,但影响不大。

这种方法虽然能够正常显示样式,但不知道除了产生代码冗余之外还有什么弊端没有,目前还没有发现,所有你如果使用新模板一定要有充分的准备,尽可能的测试不同浏览器下的显示状况,我这里提供一个网络服务用于网站的跨平台,跨浏览器的测试:http://browsershots.org/,欢迎大家提出新的解决方法。

更新:星星同学提出了一个更好的方法,改成HTTPS连接,把那段css代码用https加密:
<link type='text/css' rel='stylesheet' href='https://www.blogger.com/static/v1/widgets/4246919960-widget_css_2_bundle.css' />
把代码放在模板</title>后面即可,非常的方便好用。

本文地址:http://oceanban.blogspot.com/2010/07/bloggercom_06.html
原创文章如转载,请注明链接: 转自OceanBan的空间

17 评论:

匿名 说... 回复此评论

但是模板图片一般都是在墙外的.还是用第三方的模板吧

Ocean Ban : 回复此评论

@匿名
新模板图片是可以显示出来的,Blogger.com和iStockphoto合作,iStockphoto提供图片,没有被和谐。

星星 说... 回复此评论

更好的方法是改成HTTPS连接,https://www.blogger.com/……widget_css_2_bundle.css

Ocean Ban : 回复此评论

@星星
确实可以,这个很简单。但是如果那个原来的代码不加载最好,不知道有没有方法?

Kenji 说... 回复此评论

你的模板不錯,修改了幾處地方。也拿過來用用。

会飞的泥鳅 说... 回复此评论

悲剧的是我怎么在模板里没找到<link type='text/css' rel='stylesheet' ......这段代码?????
我用的是新版模板啊~~~

Ocean Ban : 回复此评论

@会飞的泥鳅
我说的就是新模板,模板里面没有显示出来,直接把代码放入你的title下面就可以了,代码在http://forum.kban.info/Blogger-com-css-tp1125395p1125395.html

会飞的泥鳅 说... 回复此评论

@Ocean Ban

已搞定~~十分感谢啊~~~~!!!

骗子手 说... 回复此评论

我也来顶!刚刚弄的博客,问题多多啊,以后还要多多来请教~
www.kongqinan.com

骗子手 说... 回复此评论

我也来谢谢~

匿名 说... 回复此评论

我很疑惑“直接把代码放入你的title下面”,新模板不能编辑代码,<link type='text/css' rel='stylesheet' ...... 具体是放在哪里?

Ocean Ban : 回复此评论

@匿名
对,不能编辑代码,你把这个代码放在title下面他默认就是加载这个加密的代码了.

最好留下你的地址我也好参考下你的博客

gov 说... 回复此评论

请问怎么看我博客的代码啊??在哪看啊.唯一的代码怎么看呢。。速回啊。我在线等的.在线等啊。。。在线等。。。mail:ljw256@gmail.com

Ocean Ban : 回复此评论

@江湖客
打开网页后,右键选择查看源文件就可以查看源代码了.搜索 <link type='text/css' rel='stylesheet' href='http://www.blogger.com/static/v1/widgets
就可以了,你应该能看到数字不一样,如果你的模板是旧模板的话可以忽略.

gov 说... 回复此评论

太感谢博主了!!!激动中。CSS完美的解决了。还要感谢星星同学。解救水火中的同胞啊,:D

那时花开 说... 回复此评论

那个数字是会变的 我试过了

Ocean Ban : 回复此评论

@那时花开
对的,每个人都不一样,我文章中说过的。