
前言
建站以来,我更换了好几款主题。每次更换我都会花一些时间改写主题,以符合自己的需要。我想挑选主题的过程是最“艰辛”的吧,也是最考验耐心的。好不容易找到一款,穿上之后又嫌这嫌那的,真觉得自己的要求很高。几个月过去了,想着换一种清爽又大气的主题。于是这款Oulipo主题就映入了眼帘。
主题基调为白色,其他为天蓝及灰色相衬,给人的感觉就是非常清新。起初通过我简单的修改发现这款主题比较容易mod,所以我就准备对它进行大手术,并长期使用。下面就讲讲我的手术过程。
1.增加主题nosidebar模版
就像每个人都喜欢舒适宽大的房间一样,我喜欢文章页显示得大一点,方便一些图片及flash的展示,所以一般我都喜欢选择两栏的主题框架。期间我看到有些人的网站首页显示有侧边栏,但是文章页没有,这种方式很值得借鉴。所以我更改了主题默认的single.php模版。
去除了
<? php get_sidebar(); ?>,这样在浏览单篇日志时,不会出现侧边栏,文章的宽度大大增加了。为了应用于page模版,于是就新建一个page-noside.php文件,并做同样的修改。当然别忘了删除了侧边,原文的宽度也要随之改变。
2.顶栏使之浮动
这里我们要用到CSS里面的float属性和position属性。首先找到顶栏ID对应的CSS样式,加入
position: fixed;使顶栏的这个div层相对于浏览器窗口进行定位。然后再对顶栏内的元素进行浮动处理。就如你看到的,我把twitter浮动在了左边,把搜索框浮动在了右边。
经过修改后,你也许会在上下滚动时发现,文章内容会把顶栏盖在下面。这时我们可以更改顶栏层与其他内容层的上下关系。加入z-index: 1;属性,就相当于上了一个台阶,其他层就可以在他底下任意穿梭啦![]()
3.定制导航栏
大家都知道,wordpress升级到3.0后,新增了一个导航配置功能,使得站长能够更加方便的管理网站的导航栏。我对这个功能函数并不是十分熟悉,幸运的是原主题已经将其集成了,所以我只要更改一下样式就可以了。修改导航栏样式的工作并不是十分的顺利,由于结构比较复杂,而且当时的我对CSS的编写也不十分在行,所以一开始被我搞的一团糟。于是我就上网搜索相关的模版,最后找到一款纯CSS编写的导航栏,支持多级菜单。我就在Dreamweaver的帮助下,看清了其本质
,从此以后我也学会了怎么运用类选择器来编写CSS。多级菜单CSS编写要点主要在于
position参数和display参数两点,前者决定了菜单是横向展开还是垂直展开,后者则控制了菜单的动态效果。
4.增加分页插件wp-pagenavi和页脚回到顶部功能
wp-pagenavi是公认的必装的插件,回到顶部也是增强来客体验的一个功能。插件主要是修改一下样式,符合自己主题的色调,回到顶部我是copy他人主题内的code完成,这两个修改还是挺简单的。
5.首页文章摘要输出
很多人会想到用
<!--more-->标签,或者在模版里用<?php the_excerpt(); ?>函数输出excerpt里的东西。但这些都缺乏灵活性,前者得到的摘要跟文章内容一样,在我这种主页与文章页模版格式不一样的情况下并不适用,例如摘要中的一张图片在主页中的宽度最大不能超过500px,而在文章页却可以达到735px;后者的功能单一,无法输出诸如图片、flash等带格式标签的内容。于是经过搜寻,有一款插件正是满足了我一苛刻的要求。
“wp-utf8-excerpt”,这款插件可以兼容<!--more-->标签,支持多字节语言(如中文),不会产生乱码,摘要可保留文章中的格式标签,如字体、颜色、链接、图片等(需保留的标签可在后台设置),摘要输出的字数也可以设置,功能可谓非常强大。喜欢的朋友不妨一试。
其他的一些改动都是通过wordpress常用的函数自己稍微运用了一下,然后在CSS上面美化美化,只要自己有一份耐心和好的idea,我想你都会创造出属于自己的成果的。

nice site! 只是有些地方字太小了 最好统一一下 :)