移植主题TwentyFourteen

唔,前两天有人求WordPress主题,交流一番之后知道了WordPress居然又发新的默认主题了!之前那款TwentyTwelve也很是不错的说,看了下新发的TwentyFourteen,我也很是喜欢,果断就开始了扒皮行动。话说我也是现在才知道WordPress的默认主题对应着年份的,这么后知后觉真心好忧桑。至于TwentyThirteen那款默认主题由于个人不喜欢甚至觉得有些难看而自动过滤掉了。

在跟各种神奇的WordPress语法大干一场后,抄袭移植就基本完成了。秉承着尽量忠于原主题的原则(说的好像自己扒皮多有原则似的,→_→),主题的资源文件当然是毫不犹豫的是从原主题拷贝过来的啦。发现WordPress现在真是各种高度集成,乱七八糟什么样的函数都有,通过函数能做大部分的事情。同时今天看到一句话“Typecho就是早期整合度不高的WordPress”,对此也深表同意。原来做WordPress主题跟Typecho一样,也就是header index footer sidebar post page comments functions几个文件而已。现在的WordPress主题动不动就是十几个模板文件,各种嵌套引用,头都大了。以及觉得Typecho果然还是有不足的地方啊,好几个需求都没办法直接实现,有些甚至没法实现,只能各种“黑魔法”。

虽然花了我一些时间去移植,但是不保证完全没有问题啦,有问题的同学请留言提出来,我会尽我所能解决的。最后放上页面预览和下载地址:

TwentyFourteen Theme

更新:

本主题更新至1.1版修复了WP官方的定宽(最大只能显示1260px)的问题,以及搜索页面的一些排版问题。

下载地址:BOX | 百度云

移植主题TwentyTwelve

之前帮Jclyn修改个主题,呐,这个暂且不提。反正因为这个我装了下WordPress,解压出来14M让我稍微汗颜了一下,呐,这个也暂且不提。总之就是装了WordPress之后发现新版自带的默认主题好好看哇!然后我就当机立断毫不犹豫地准备抄袭移植到Typecho上来了。

在跟各种神奇的DOM大干一场之后,抄袭移植就基本完成了。话说这回CSS什么的是赤果果的拷贝引用原主题的呢,所以原主题的响应式设计也非常完备的给继承了下来,不过总共35KB的CSS文件,让人不禁捏把汗啊,果然WordPress有着整体变大的趋势。至于别的什么特性我也不大清楚啦,有就有啦,木有的话大家就凑合着用吧[揉脸]。

页面预览:

目前已经更新至1.1版,修复了IE8以下被识别成小屏幕分辨率样式的问题。

目前已经更新至1.2版,修复了评论回复点击回复需要重新载入页面的问题,如果使用此版还会出现重新载入现象的同学可以考虑在</body>之前加入<script type="text/javascript" src="http://imnerd.org/usr/themes/twentytwelve/js/comment.js"></script>

下载地址:1.2版下载地址 | 1.1版下载地址 | 1.0版下载地址

把主站换成Typecho了

[1g1g]天空之城-钢琴曲#playID:-3900[/]

我还是忍不住把主站换成了Typecho了,换成Typecho的原因仅仅是喜欢Google Pretty插件的代码高亮效果。为了保存主站的链接,花了点时间把主站换了一颗心。

转换的过程比较简单,重要的是做好备份。Typecho的WordPress To Typecho插件做的非常的棒,基本上能完美的转换数据库。而更令我欣喜的是,之前我都是使用Synatx来代码高亮的,没想到的是Google Pretty也无缝衔接上了。这让我省了不少的麻烦。

利用这个时间逐一的看了一下以前的文章,发现较早的文章配图都失效了,到时候做一下清理吧。主题暂时用着自己仿的Typecho主题。等什么时候有心情了再把http://blog.imnerd.org换成WordPress就OK了~不过还是挺舍不得之前的WordPress的,Simple Forum里头几篇转载的文章给我还是带来了不少的流量的。

显示PC的最近消息模板

< ?php get_sidebar(); ?> < ?php get_footer(); ?>

然后在WP后台添加新页面,在高级选项的自定义模板中选择刚才上传的Microblog就可以了。

然后对于我这个模板您最后修改一下您的PageCookery的RSS输出样式。具体是将如下代码保存为rss_update.php并上传覆盖掉cron/rss_update.php文件。

< ?php
ob_start();

$entry = $SQL->RunQuery("SELECT * FROM entry ORDER BY time DESC LIMIT 0, 50");

$title = SITE_NAME . ' - RSS';

echo urldecode('%3C%3Fxml+version=%221.0%22+encoding=%22utf-8%22%3F%3E');
?>

<title>< ?php echo $title; ?></title>
<link>< ?php echo BASE_URL; ?></link>
Powered by PageCookery Microblog v< ?php echo $pcm_version; ?> Build < ?php echo $pcm_build; ?>
zh
< ?php while ($item = $SQL->FetchArray($entry)) { ?>

<title>< ?php echo Format::Time($item['time'], 1); ?> 来自 < ?php echo $item['from']; ?></title>
<link>< ?php echo BASE_URL; ?>?act=view&id=< ?php echo $item['id']; ?></link>
< ![CDATA[
< ?php $item['picture'] = $SQL->QueryRowsArray("SELECT * FROM picture WHERE entryid = " . $item['id']); ?>
< ?php if ($item['picture']['id']) { ?>

< ?php echo $item['picture']['filename']; ?>

< ?php } ?>]]>
< ?php echo Format::Date($item['time'], 'D, j M Y H:i:s' , 0); ?> +0000
< ?php } ?>
< ?php $data = ob_get_contents(); ob_end_clean(); file_put_contents('rss.xml', $data);

最后附上我的样式表,复制下列代码到WP当前主题的style.css中即可。

.pagecookery_list {
list-style-type:disc;
font-size:14px;
color:#666666;
line-height:1.7;
font-family:Georgia,Times,"Times New Roman",serif;
}
.pagecookery_list li {
border-bottom:1px dashed #CCCCCC;
list-style-type:none;
padding:5px 0;
margin:0;
}
.pagecookery_list li:hover {
background:none repeat scroll 0 0 #E7E7E7;
}
.pagecookery_list li img {
width:100px;
}
.pagecookery_list a {
color:#999999;
}
.entry-meta {
background:url("http://storage.live.com/items/8AAEE749DE3922BE!558?filename=digu-time.png") no-repeat scroll 0 0 transparent;
padding:0 0 0 19px;
}
.entry-meta a {
border-bottom:none;
}
.entry-meta a:hover {
color:#FF6633;
}
#panel {
text-align:right;
}
#panel:hover {
background:none;
}
#panel a {
border:none;
padding:2px 5px;
}
#panel a:hover {
color:#FF6633;
background:none repeat scroll 0 0 #E7E7E7;
}
-->

论坛有人问能否做一个显示微博的单页面,之前我写过一个Typecho的,现在特地转到WP中来。

复制一下代码命名为microblog.php上传到你当前主题文件夹中

< ?php
/*
Template Name:Microblog
*/
?>
< ?php get_header(); ?>
< ?php get_sidebar(); ?> < ?php get_footer(); ?>

然后在WP后台添加新页面,在高级选项的自定义模板中选择刚才上传的Microblog就可以了。

然后对于我这个模板您最后修改一下您的PageCookery的RSS输出样式。具体是将如下代码保存为rss_update.php并上传覆盖掉cron/rss_update.php文件。

< ?php
ob_start();

$entry = $SQL->RunQuery("SELECT * FROM entry ORDER BY time DESC LIMIT 0, 50");

$title = SITE_NAME . ' - RSS';

echo urldecode('%3C%3Fxml+version=%221.0%22+encoding=%22utf-8%22%3F%3E');
?>

<title>< ?php echo $title; ?></title>
<link>< ?php echo BASE_URL; ?></link>
Powered by PageCookery Microblog v< ?php echo $pcm_version; ?> Build < ?php echo $pcm_build; ?>
zh
< ?php while ($item = $SQL->FetchArray($entry)) { ?>

<title>< ?php echo Format::Time($item['time'], 1); ?> 来自 < ?php echo $item['from']; ?></title>
<link>< ?php echo BASE_URL; ?>?act=view&id=< ?php echo $item['id']; ?></link>
< ![CDATA[
< ?php $item['picture'] = $SQL->QueryRowsArray("SELECT * FROM picture WHERE entryid = " . $item['id']); ?>
< ?php if ($item['picture']['id']) { ?>

< ?php echo $item['picture']['filename']; ?>

< ?php } ?>]]>
< ?php echo Format::Date($item['time'], 'D, j M Y H:i:s' , 0); ?> +0000
< ?php } ?>
< ?php $data = ob_get_contents(); ob_end_clean(); file_put_contents('rss.xml', $data);

最后附上我的样式表,复制下列代码到WP当前主题的style.css中即可。

.pagecookery_list {
list-style-type:disc;
font-size:14px;
color:#666666;
line-height:1.7;
font-family:Georgia,Times,"Times New Roman",serif;
}
.pagecookery_list li {
border-bottom:1px dashed #CCCCCC;
list-style-type:none;
padding:5px 0;
margin:0;
}
.pagecookery_list li:hover {
background:none repeat scroll 0 0 #E7E7E7;
}
.pagecookery_list li img {
width:100px;
}
.pagecookery_list a {
color:#999999;
}
.entry-meta {
background:url("http://storage.live.com/items/8AAEE749DE3922BE!558?filename=digu-time.png") no-repeat scroll 0 0 transparent;
padding:0 0 0 19px;
}
.entry-meta a {
border-bottom:none;
}
.entry-meta a:hover {
color:#FF6633;
}
#panel {
text-align:right;
}
#panel:hover {
background:none;
}
#panel a {
border:none;
padding:2px 5px;
}
#panel a:hover {
color:#FF6633;
background:none repeat scroll 0 0 #E7E7E7;
}

拷贝修改了两个模板

最近又有变懒的趋势了啊,博客又有好几天没有更新了,额/过年没啥事好说的,无非是走亲访友,吃吃喝喝的,不太好玩……/*主要还是听不懂这里的地方话,他们讲话无异于对我唱摇篮曲*/ 话说最近又百无聊赖的操起DIY的折腾精神修改了两个模板,一个是我的班级网站的,一个是PageCookery的。班级网站的是以WP主题库的某款主题为原型,添加了以酷狗叮咚网站的导航栏为原型的菜单栏,然后增加了两个大图标以及几个小图标改版过来而成……原版的主题很简单,就一个头部图像,这个主题貌似强大之处在于在IE下也能显示圆角/*貌似利用了图片*/,仅此而已,本人也奉行简单原则……爽乎乎……话说要想在WP中找到一款合适的CMS主题还真不容易额…… PageCookery的这个是以凳子童鞋的饭推 / 姑且让我这么称呼这个网站 / 中的某个主题为原型,主要是取材了它的气泡显示消息的形式。本来也想搞成两栏型/*entry + sidebar*/的,但是人太懒了,不愿意搞了,这个样子已经达到了我的最初目标了。话说我还真是天天为抵制IE大行动做贡献呢……这次的PageCookery很华丽丽的在IE下显示的一塌糊涂/*IE8已经测试,IE6未测试,不过我想也好不到哪里去吧,说到IE6,上面那个WP主题似乎在IE6下也是显示一团糟啊,不知道是不是我修改了的原因*/,这个我是早就预料到的,不过没预料到的是Safari的显示也有些问题,囧……另外,搜狗2.0下也有问题/*搜狗2.0不是Webkit内核的么?!*/然后是好消息,在Firefox, Chrome, Opera, 傲游3.0下显示都没有问题,灰常正常/*完美就没有了,本身模板就不完美……*/鉴于主题毛病重重,我就不发出来了,如果真的想要的童鞋可以留言给我~ 好了,其它的不说了,上图: 这个是班级网站的,点击浏览大图哦!里面的内容我稍加修改了一下,大致的框架是这样的啦!

image

这个是PageCookery的,背景本来不想用Twitter的,无奈真的找不到什么好的素材了,咳咳……要围观的话图片上面有地址的,我这里就不放出来了啊~

image

我在使用的WP插件

丑话说前头啊,咱少说也用了几十个插件了吧,对插件也有些心得,但是还是要提醒你一下:有的插件在我这儿能成,在你那儿并不一定能成,要视自己的情况选择插件哦!

1. 中文 WordPress 工具箱

这个官方解释说是增强WordPress对中文的支持,具体怎么样我也没察觉出来,因为好像我一开始用WordPress就装上了这个插件了。我看基本上中文博客都应该装了这个插件了吧!

推荐等级:★★★★★

2.唐诗宋词(chinese poem)

用了这个插件可以在自己博客的边栏中显示唐诗/宋词/名曲/菜根谭/道德经/笑话集/论语/谚语/增广贤文/毛泽东诗词/毛泽东语录,喜欢文艺点的孩子可以安装下这个插件。

推荐等级:★★★☆☆

3.Akismet

WordPress注明的防SPAM的插件,拦截效率灰常之高,灰常精确(但是某些童鞋居然说它错杀无数?!),强烈建议安装!虽然说这个API KEY很难搞,但是,咨询下广大网民,应该也不难吧?

推荐等级:★★★★★

4.Better Extended Live Archives

强大的日志树插件,能够给WordPress博客的日志生成目录,并且可以有多种形式浏览,而且还能进行强大的DIY!预览地址:日志

推荐等级★★★☆☆

5.Comment Reply Notification

从WP Thread Comment提取出来的邮件回复提醒插件,对于不喜欢WP Thread Comment的评论嵌套或者其它的而仅仅是想要一个邮件回复提醒功能的话,这个还是很不错的!

推荐等级:★★★★☆

6.Comments Shortcut

能够为你的博客添加快捷回复,对我们这些习惯使用Ctrl + Enter发表文章的人来说还是有必要的。不过我装上去之后一直不知道怎么用?!

推荐等级:★★☆☆☆

7.cos_slug_translator

能够将你的日志链接自动转换成英文,当然,必须要你的固定链接形式是包含%postname%的。这个插件可省了我很大的一个麻烦啊,自动调用Google翻译,翻译结果大家可以想象了!

推荐等级:★★★☆☆

8.Crab Blog Sync Plugin

那个河蟹微博的同步插件,当你发表新日志时可以在河蟹发消息通知,不用河蟹的童鞋可以忽略了。
下载地址:传送门

推荐等级:★☆☆☆☆

9.Custom Smilies

表情插件,可以为博客添加表情,功能强大,可以自定义表情,自定义表情符号。博客必备级插件,虽然在安装过程中偶尔会有些波折!

推荐等级:★★★★☆

10.Delete-Revision

删除WordPress数据库内冗余日志,减少数据库体积。对于某些经常保存草稿再修改,修改再修改的童鞋来说这个插件应该数据必备级别的了。我也用了很久,没出什么状况,啥状况也没好!

推荐等级:★★★☆☆

11.Du RSS

这个插件能够在侧边栏增加一个小工具显示你在uushare.com最近上传的文件,插件作者是友链里面的视为哦!

推荐等级:★★☆☆☆

12.Google XML Sitemaps

这插件,似乎就是能够自动生成sitemapi文件并自动提醒谷歌,bing啊什么的(没有我们百毒大叔!),作为博客推广及收录的必备级插件。

推荐等级:★★★★★

13.GZippy

听说是能压缩CSS和JS,提高网站的反应速度,但是我装了这么久,没感觉的说?

推荐等级:★★☆☆☆

14.Highslide4WP

为你博客的图片添加Lightbox特效,操作简单,仅仅需要你给出缩略图和原图的网址就行!==!

推荐等级:★★★★☆

15.Hot Friends

可以对你的友情链接进行管理,可以按照月评论排名等等形式对友情链接进行优化和排序。不过比较麻烦的是每次更新完友情链接后必须更新下Hot Friends的设置……

推荐等级:★★★★☆

16.KPicasa Gallery

该插件能够为你创建一个相册照片全处于Picasa的照片集页面,如果想用Picasa制作相册的话,这个人插件是不二选择。虽然大陆看不到Picasa了,但是偶相信Picasa还会回来的

推荐等级:★★★★☆

17.Live Comment Preview

该插件能够使评论有预览功能,不过做的还不是很好玩,居然不能识别表情符号~而且你换行之后上面的字体会变粗,下面的就不会……不知道是不是个例

推荐等级:★★★☆☆

18.My Category Order

管理你的文章分类的,当初装了就没用,感觉没多大用。

推荐等级:★★☆☆☆

19.Quick Comments

能够实现Ajax评论回复,也就是说当你发表回复的时候,仅刷新评论,不刷新文章。但是这个插件对主题比较苛刻,比如我的comment-template.php给人改造了一下就不支持这个插件了……囧,这个插件不错,但是能不能装上,看你的造化吧!

推荐等级:★★★★☆

20.Quote Comments

字面上就是引用评论,就是给评论增加引用的功能,可以引用其它人的评论。

推荐等级:★★★☆☆

21.Simple:Press Forum

能够给WordPress装上一个轻量型的BBS,这个插件很不错的说,能够极大的使论坛和博客整合,而且功能上丝毫不逊色于其他专用论坛程序!同时这个插件也有着4M的体积,所以这个插件很好,但是不是每个人都需要的。预览地址:BBS

推荐等级:★★★★☆

22.WordPress Database Backup

这个不用我说了吧,WordPress御用数据库备份插件,能够自动备份WordPress的数据库,可以存在一个文件夹或者发送到一个邮箱等等。数据控者或杞人忧天者必备!

推荐等级:★★★★★

23.WP-PageNavi

能够给博客加上分页代替WordPress老套的新的文章和老的文章的翻页方法。似乎没用过别的分页插件,这个分页插件做的不错的说,但是似乎要添加代码,我记得我为我的博客添加这个代码似乎有些麻烦啊……

推荐等级:★★★★☆

24.WP-Reader-Wall

能够显示所有在你博客评论过的评论者的头像,然后组成一面头像墙,最近很不错的插件。推荐!

推荐等级:★★★★☆

25.WP-T-Wap

这个也不用我说了吧,给WordPress制作WAP浏览页面,相当不错的说!

推荐等级:★★★★★

25.WP-T-Wap

这个也不用我说了吧,给WordPress制作WAP浏览页面,相当不错的说! 推荐等级:★★★★★

26.Page Links To

这个插件可以给WP页面自定义一个链接,也就是说你的WP页面可以链接到任何网址上去了。预览地址:相册

推荐等级:★★★★★

27.Sam-Sarin PHP Widget

这个插件能够让边栏支持PHP语言,相当实用的说!

推荐等级:★★★

......本文于2010/3/3更新

本地安装WP

这些天突然发现现在的这个主题还不是很好看啊,找了另外一个主题,居然发现它对中文的支持超级差!改了也没有用,于是就考虑本地来修改。本地修改吧,那肯定要本地模拟服务器才行,网上这样的软件一大把,XAMPP, PHPStudy, EasyPHP......但是不知道怎么搞的,我的电脑装XAMPP老错,EasyPHP也是,郁闷死我了。到论坛搜了下,发现另外一个傻瓜式的,BitNami,真的很傻瓜呢,连WP都帮你装好了。好了,不多说了,这个是下才地址:

阅读全文