最新消息:点击查看大S的省钱秘笈

纠结再三,不换主题,曲线救国

WordPress Slyar 101浏览 0评论

文章作者:姜南(Slyar) 文章来源:Slyar Home (www.slyar.com) 转载请注明,谢谢合作。

有两个原因使我产生了换主题的想法,将现有的fixed-width主题替换成flexible-width主题:

1、网民的PC机显示器越来越大,而fixed-width通常只有700px-1000px宽,在大屏幕显示器上看起来非常别扭;

2、越来越多的人使用移动终端如4-5寸的手机(iphone, note2)以及平板(ipad)来浏览网站,fixed-width的网站由于文字换行不能适应屏幕,往往非常不友好。

如果采用经过Responsive Web Design的主题,宽度是可以自动适应屏幕大小来改变的,文字的换行以及图片的大小都可以随心所欲,非常灵活。我在Wordpress Theme sites上看了几个主题,发现由Wordpress官方出品的Twenty-twelve主题非常不错,很简单也很清晰。将max-width改成1400px后,在24寸的显示器上看非常舒服,而且上传长边1024px的图片后,自适应下可以显示到960px,写游记非常壮观。唯一的几个缺点就是对中文不是很友好,大量的字体需要修改;默认不支持分页插件,好解决;其它一些常用插件也不支持,需要自己修改主题。

但最后有几个原因使我最终决定不在这个中文博客使用flexible-width主题,继续使用原先的主题并修改一下特性以满足我的需求。(flexible-width主题用在以后的英文站上)

1、为了满足中文用户的阅读习惯,大量的修改工作需要做,我懒;

2、对于大屏幕读者,文字阅读并不难解决,使用相对字号即可。而图片可以使用lightbox解决;

3、移动用户是个问题,但我查看了一下从2012/8/21 - 2013/8/21的用户终端统计,移动端浏览器在我博客的访问量几乎可以忽略,不理他们...

用户终端统计

所以最后需要解决的一个问题是如何让图片看起来满足大屏幕用户的需求。

答案是用lightbox,即上传大图,让css自动按比例缩小图片显示在文章里。如果用户需要看大图,点击图片即可,再次点击取消放大。插件或者JS都可以很轻松的解决。

搞定之后发现一个问题,iNove主题只会自动缩小宽度,而不会按比例缩小长度,然后就畸形了。。。看了下css发现作者就没写height定义,只能自己来了:

.post .content img {
max-width:644px;
width: expression(this.width > 644 ? "644px" : true);
height:auto;
}

反正我不是搞前端的,写的好不好不管了,最后结果是能用。贴张去年拍的照片试下,点击可放大。

天坛

至此基本上是能满足我写中文生活类日志和游记的需求了,技术文估计以后要写英文的了,囧

转载请注明:Slyar Home » 纠结再三,不换主题,曲线救国

发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

网友最新评论 (2)

  1. 好高端的样子,我和你一个主题,这个主题还不错,14寸笔记本看着挺爽的,大屏幕确实有点怪.最近博客更新了呀,加油少年.
    HeHe.wang|52coder.net3年前 (2013-08-28)回复
  2. 好高端的样子,我和你一个主题,这个主题还不错,14寸笔记本看着挺爽的,大屏幕确实有点怪.最近博客更新了呀,加油少年.
    我爱程序员3年前 (2013-08-28)回复