移植主题TwentyFourteen

提醒:本文最后更新于 2597 天前,文中所描述的信息可能已发生改变,请谨慎使用。

唔,前两天有人求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 | 百度云(提取码:hvkx)

Avatar
怡红公子 擅长前端和 Node.js 服务端方向。热爱开源时常在 Github 上活跃,也是博客爱好者,喜欢将所学内容总结成文章分享给他人。

83 评论

aerwe Firefox 72.0 Windows 10
2020-01-11T03:03:01.000Z 回复
无法下载了
公子 Chrome 79.0.3945.88 Mac OS 10.15.2
2020-01-12T03:32:42.000Z 回复
@aerwe 百度盘的链接失效了,BOX 的还是可以的。百度盘的重新上传了下。链接: 提取码: hvkx
2019-11-18T13:28:11.000Z 回复
[...]下载:请到作者原文中下载作者原文[...]
六弦胖爷 WeChat 7.0.4 iOS 12.1
2019-06-18T16:35:47.000Z 回复
又遇到一个问题啦。使用了banner图后,宽屏情况下第一次打开网页,“文字站名+导航栏”这个黑条置顶,盖住了部分banner图,网页下翻再回来就正常了。非宽屏情况下正常,直接是banner图置顶的。求帮助。
六弦胖爷 Chrome 70.0.3538.67 Windows 7
2019-06-16T14:02:24.000Z 回复
独立页面的文章的正文内容,在电脑浏览器显示没有问题。手机端UC浏览器和微信直接打开页面,均看不到正文内容,不懂是哪里的问题。
公子 Chrome 74.0.3729.169 Mac OS 10.14.5
2019-06-17T13:45:34.000Z 回复
@六弦胖爷 提供下地址我去看下吧。
六弦胖爷 WeChat 7.0.4 iOS 12.1
2019-06-17T14:04:09.000Z 回复
@公子就看这个吧,一样的测试环境evaym.free.idcfengye.com
六弦胖爷 Chrome 70.0.3538.67 Windows 7
2019-06-17T03:01:32.000Z 回复
@公子手机端有事打开慢,没有完整加载css的情况,反而出现文章正文了,一旦样式加载完(界面正常了),就看不到文章正文。独立页面和文章都是如此。会是css的问题吗?能否加一下微信或QQ?
公子 Chrome 75.0.3770.90 Mac OS 10.14.5
2019-06-18T11:33:42.000Z 回复
@六弦胖爷 style.css 里面有一个 `display:none` 的逻辑,大概 3001 行的位置,你注释下就好了。 ```css .list-view .site-content .cat-links, .list-view .site-content .entry-content, .list-view .site-content .entry-summary, .list-view .site-content footer.entry-meta { /**display: none;*/ } ````
六弦胖爷 Chrome 70.0.3538.67 Windows 7
2019-06-18T13:01:54.000Z 回复
@公子果然是这个问题,真厉害,怎么定位出来的啊?之前你也碰到了吗?我看wordpress主题里的style.css,此处也是写着“display: none;”。注释掉就正常了,原因是什么呢?
六弦胖爷 UCBrowser 12.4.7.1178 iOS 12.1
2019-06-16T07:37:48.000Z 回复
从建站开始一直就用Wordpress,且没有看上过除TwentyFourteen以外的任意一款主题,自己的博客一直稳定用到现在,也没敢对程序大更新。最近帮朋友搭个环境,新版wp一直有些各种各样问题,不能轻易搞定,遂试了zblog和typecho,typecho除主题外都尽如意,没想到看到这个,真的惊喜。
苟保罗 Firefox 47.0 Windows 10
2016+00-28T06:40:19.000Z 回复
听大气的博客模板,谢谢分享
DT27 Firefox 46.0 Mac OS 10.11
2016-05-30T00:57:50.000Z 回复
博客按分类浏览文章翻页有问题。
黑暗游侠 Chrome 48.0.2564.116 Windows 7
2016-03-08T16:32:36.000Z 回复
居然移植到了te,不错~
edward Firefox 33.0 Windows 7
2014-11-27T04:41:12.000Z 回复
请问我的wordpress4.0安装了你的主题后,打开首页出现Fatal error: Using $this when not in object context in E:\workspace\PHP\wp-content\themes\twentyfourteen1.1\index.php on line 12。是什么问题呀?非常感谢~~
公子 Chrome 41.0.2224.3 Windows 7
2014-11-29T00:16:37.000Z 回复
@edward汗Σ( ° △ °|||)︴小少年别被骗了,我这里写的是一个Typecho主题,不是WordPress啊(╯‵□′)╯︵┻━┻
Capricornusoel Firefox 32.0 Windows XP
2014-09-19T06:58:48.000Z 回复
实在想不到这个居然是wp的默认主题。。。超好看
公子 Chrome 37.0.2062.124 Windows 7
2014-10-12T02:33:47.000Z 回复
@Capricornusoel 谢谢支持~
顾杨 Chrome 21.0.1180.89 Windows XP
2014-09-05T13:24:45.000Z 回复
请问wp的2014主题怎么让它页面居中呢?
公子 Chrome 39.0.2145.4 Windows 7
2014-09-06T07:24:12.000Z 回复
@顾杨 http://imnerd.org/twentyfourteen-for-typecho.html/comment-page-2#comment-1186404 估计你需要的是这个。
burncode MetaSr Windows 7
2014-09-02T16:17:38.000Z 回复
看来我们审美观不同 ,我倒是觉得Twenty Thirteen很好看,而twentyfourteen却始终没什么好感
Mike Chrome 37.0.2062.94 Windows 7
2014-08-28T09:11:57.000Z 回复
移植到TE上来了哇 14是蛮好看的 就是内容两边空着太多了 有点奇怪= =
公子 Chrome 39.0.2138.3 Windows 7
2014-08-29T10:36:30.000Z 回复
@Mike 是的,所以准备有空换掉-。-|||
AvalonDragoN龙龙 Firefox 31.0 Linux x86_64
2014-08-21T02:58:00.000Z 回复
我超喜欢官方的主题~~XD
公子 Chrome 36.0.1985.143 Windows 7
2014-08-23T14:30:31.000Z 回复
@AvalonDragoN龙龙 嗯,我也超级喜欢的,不过好像新款的这版不是很好看,哎!
dvorak Safari 7.0.5 Mac OS 10.9.4
2014+00-03T14:58:48.000Z 回复
求问下这款主题右边的白边怎么搞掉啊?谢!
公子 Chrome 35.0.1916.153 Windows 7
2014+00-03T03:02:39.000Z 回复
@dvorak 1.1版已经修复了这个问题了吧,你下1.1版试试呗。
dvorak Safari 7.0.5 Mac OS 10.9.4
2014+00-03T03:10:56.000Z 回复
@公子用的是1.1啊,网页右边有很大一片空白… http://v1.freep.cn/3tb_140715230726etbp512293.png
公子 Chrome 35.0.1916.153 Windows 7
2014+00-03T03:24:16.000Z 回复
@dvorak马丹,我写的是Typecho的主题,你拿着WordPress过来问真为什么不来事真的大丈夫么... WP的话请自行到style.css文件里面搜索`max-width:1260px;`并都删掉就好了...
dvorak Safari 7.0.5 Mac OS 10.9.4
2014+00-16T03:25:38.000Z 回复
@公子抱歉我没说清楚。。。:P 我是从搜索引擎上搜索主题名字搜到这里来的,没仔细看,sorryyyyyyyy啦~之前把max-width改成2560px一点反应都没有,居然删掉就好使了,好奇怪,谢谢!
鲜活 IE 11.0 Windows 7
2014+00-11T04:09:26.000Z 回复
不喜欢这款主题呢
阿飞 Chrome 31.0.1650.57 Windows 7
2014-04-09T02:42:34.000Z 回复
太、太、太不协调了,宽屏下空得太多了。 留言分页的页码是竖着的。chrome
公子 Chrome 34.0.1847.116 Windows 7
2014-04-13T03:24:32.000Z 回复
@阿飞 嗯,我比较喜欢空着的感觉,个人癖好吧,哈哈哈哈…… 分页的那个一直没做,等有空的时候补上吧,谢谢大非老师~
WayJam Chrome 33.0.1750.117 Windows 8.1
2014-04-02T07:51:18.000Z 回复
感覺左邊欄太擠了。
公子 Chrome 33.0.1750.154 Windows 7
2014-04-02T14:08:47.000Z 回复
@WayJam 我倒觉得还好,可能我比较喜欢这种拥挤的感觉吧。
ccc Chrome 33.0.1750.154 Windows 7
2014-03-26T03:18:34.000Z 回复
话说怎么截全图的呀??公子
ccc Chrome 33.0.1750.154 Windows 7
2014-03-26T02:59:31.000Z 回复
公子这个主题好棒!
公子 Chrome 33.0.1750.154 Windows 7
2014-03-26T04:31:14.000Z 回复
@ccc嘿嘿,总算有同好啦,西西妹最赞~关于截全图的话我使用的是Chrome的插件,叫“网页截图”。
hanabi Chrome 31.0.1650.63 Windows 8
2014-03-24T09:48:33.000Z 回复
左右都留了好多白额=-=
公子 Chrome 33.0.1750.154 Windows 7
2014-03-24T09:59:16.000Z 回复
@hanabi嗯,这个主题默认就是这个样子的,以后看烦了考虑一下加宽,哈哈~
浩子 Firefox 27.0 Windows 7
2014-03-20T03:05:52.000Z 回复
不和谐啊~
公子 Chrome 33.0.1750.154 Windows 7
2014-03-21T04:10:56.000Z 回复
@浩子 肿么不和谐了OAQ..
Jclyn Chrome 33.0.1750.154 Windows 8.1
2014-03-19T04:19:17.000Z 回复
真的好丑哈哈哈哈哈 P.S. 小插件上首页精选了~~~
公子 Chrome 33.0.1750.154 Windows 7
2014-03-19T04:59:07.000Z 回复
@Jclyn 拍死你( ̄ε(# ̄)☆╰╮o( ̄皿 ̄///) 唔,那个字幕下载的?地址给我看看呗,感觉有点小激动,哈哈。
牧风 Chrome 33.0.1750.154 Windows 7
2014-03-18T09:21:58.000Z 回复
天空飘来四个字: 丑! 爆! 了!
公子 Chrome 33.0.1750.154 Windows 7
2014-03-18T10:17:35.000Z 回复
@牧风明明就是三个字好么!!!以及要……你……管!哼哼!
echochi Firefox 27.0 Windows XP
2014-03-17T14:19:49.000Z 回复
我不太喜欢这次更新为全屏,能否给我一个老版(右侧空白的那个)的下载地址呢?
公子 Chrome 33.0.1750.154 Windows 7
2014-03-17T03:28:38.000Z 回复
@echochi OMG!居然还有人喜欢在旁边留白么..好吧,果然是很神奇的世界。老版下载地址:https://app.box.com/s/qxew0imypk2jemqr7a2z
echochi Firefox 27.0 Windows XP
2014-03-18T04:20:59.000Z 回复
@公子谢谢
Kunr Chrome 33.0.1750.117 Windows 8.1
2014-03-03T11:38:13.000Z 回复
话说 max-width: 1260px; 这个是什么意思..大屏的人伤不起。
公子 Chrome 33.0.1750.146 Windows 7
2014-03-03T03:18:26.000Z 回复
@Kunr 额,作死的WP官方主题写的,我也不知道他们到底在想什么...
Kunr Chrome 33.0.1750.117 Windows 7
2014-03-28T13:24:02.000Z 回复
@公子 话说 评论的分页没样式耶,评论回复提示又没了么...?
公子 Chrome 33.0.1750.154 Windows 7
2014-03-28T14:19:45.000Z 回复
@Kunr 嗯,评论分页的话之前没弄,后面还没想起来要弄,等闲下来再说吧。评论回复提示有的啊...
Kunr Chrome 33.0.1750.117 Windows 7
2014-03-29T00:20:25.000Z 回复
@公子 进垃圾了...
公子 Chrome 33.0.1750.154 Windows 7
2014-03-29T00:49:22.000Z 回复
@Kunr 邮件么,我待会儿试试去~
灰常记忆 Chrome 24.0.1312.57 Windows XP
2014-03-11T03:08:16.000Z 回复
强大 收藏先
动漫那点事 Chrome 30.0.1599.101 Windows 7
2014-03-11T02:48:25.000Z 回复
我用的不是wp不过还是支持一下
小十 Chrome 33.0.1750.27 Windows 7
2014-03-04T01:56:48.000Z 回复
右边应该是自响应布局造成的。。PO主改下呗
羽中 Firefox 27.0 Windows 7
2014-03-03T04:26:22.000Z 回复
我觉得还行吧,就绿色有点奇怪
lovee Safari 7.0.2 Mac OS 10.9.2
2014-03-02T17:32:31.000Z 回复
提个意见(喂!),话说现在最外面这一层div没有居中,于是在超宽屏上看主题是全部靠左的看着很难受的说=w=a
公子 Chrome 33.0.1750.117 Windows 7
2014-03-03T02:32:12.000Z 回复
@lovee 额,居然有这回事?是`div#page`这个标签么?没有大屏真是桑不起啊OAQ... 以及lovee酱撒西不理~
Andrew Chrome 26.3.9999.1648 Windows 7
2014-03-02T12:44:49.000Z 回复
wp的主题还是多
头像吧贴吧 Chrome 28.0.1500.95 Windows 7
2014-03-01T06:57:50.000Z 回复
关注下,是移动版?
公子 Chrome 33.0.1750.117 Windows 7
2014-03-01T07:23:01.000Z 回复
@头像吧贴吧 Responsive Theme。
Kunr Chrome 32.0.1700.76 Windows 7
2014-02-28T13:14:12.000Z 回复
唔。不错的样子
生活点滴 Chrome 33.0.1750.117 Windows 8.1
2014-02-28T12:45:47.000Z 回复
哈哈哈,刚开始还以为是Wordpress,赞一个
syoubunn Firefox 27.0 Windows 8.1
2014-02-28T09:40:52.000Z 回复
@公子 留言簿打不开
公子 Chrome 33.0.1750.117 Windows 7
2014-02-28T10:54:48.000Z 回复
@syoubunn 额,手贱有个错误,page.php第30行把
$this->date('Y年m月d日)
改成
$this->date('Y年m月d日')
,少了一个引号,还有post.php也是一样的。
Louis Han Firefox 27.0 Windows 7
2014-02-27T10:18:31.000Z 回复
默认主题还需要扒?
公子 Chrome 33.0.1750.117 Windows 7
2014-02-27T10:54:41.000Z 回复
@Louis Han 额,WordPress的默认主题跑Typecho来不要扒么?还是我没理解你的话的意思?
Louis Han Firefox 27.0 Windows 7
2014-02-28T05:46:47.000Z 回复
@公子 呃 原来是te
公子 Chrome 33.0.1750.117 Windows 7
2014-02-28T10:51:07.000Z 回复
@Louis Han 汗,是呀...看来移植的比较成功,哈哈!
syoubunn Firefox 27.0 Windows 8.1
2014-03-08T05:18:22.000Z 回复
@公子 天哪,博主终于敢直面对“这个主题真是丑”这个现实了
公子 Chrome 33.0.1750.146 Windows 7
2014-03-09T01:54:50.000Z 回复
@syoubunn 滚蛋!我什么时候说这主题丑了?一个SPAM就好好的当你的SPAM好么,不要毫无意义的跳尸出来好么!
syoubunn Firefox 27.0 Windows 8.1
2014-02-27T09:52:13.000Z 回复
哦,右侧有空白
公子 Chrome 33.0.1750.117 Windows 7
2014-02-27T09:53:48.000Z 回复
@syoubunn尽量忠于原主题...我只能这么说..虽然我也不明白那个空白是拿来干嘛的...
冰剑 LBBROWSER Windows 7
2014-02-28T00:57:41.000Z 回复
@公子右侧应该是留着贴巨幅广告的。。
公子 Chrome 33.0.1750.117 Windows 7
2014-02-28T03:58:04.000Z 回复
@冰剑 就那么一点位置如何贴巨幅广告?
冰剑 LBBROWSER Windows 7
2014-02-28T06:37:54.000Z 回复
@公子我的屏幕还有160多像素的位置。。 挂个1024的广告足矣。
公子 Chrome 33.0.1750.117 Windows 7
2014-02-28T10:52:25.000Z 回复
@冰剑 !!不会吧!Responsive也会出现这种情况?能给个截图看看么?有那么大的空白岂不是超级丑!!
syoubunn Firefox 27.0 Windows 8.1
2014-02-27T09:50:07.000Z 回复
虽然不好看 但是很吊的样子
冰剑 LBBROWSER Windows 7
2014-02-27T09:32:35.000Z 回复
我想说不好看可以吗??
公子 Chrome 33.0.1750.117 Windows 7
2014-02-27T09:52:05.000Z 回复
@冰剑 完全可以..仁者见仁智者见智嘛..反正我觉得还挺不错的就是拉。