移植主题TwentyFourteen

2014-02-27

2分钟阅读时长

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

唔，前两天有人求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）

#Wordpress #主题 #theme #Typecho #移植 #twentyfourteen

编辑本页

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

上一页你是猴子请来的逗比么

下一页论“赞”引发的血案

83 评论

aerwe Firefox72.0 Windows 10

2020-01-11 03:03:01 回复

无法下载了

公子 Chrome79.0 Mac OS 10.15.2

2020-01-12 03:32:42 回复

@aerwe 百度盘的链接失效了，BOX 的还是可以的。百度盘的重新上传了下。链接: https://pan.baidu.com/s/1YkCNOvFqHErLWbhJWiO11g 提取码: hvkx

Twenty Fourteen双栏Typecho主题-高岸姬

2019-11-18 13:28:11 回复

[…]下载：请到作者原文中下载作者原文[…]

六弦胖爷 WeChat7.0 iOS 12.1

2019-06-18 16:35:47 回复

又遇到一个问题啦。使用了banner图后，宽屏情况下第一次打开网页，“文字站名+导航栏”这个黑条置顶，盖住了部分banner图，网页下翻再回来就正常了。非宽屏情况下正常，直接是banner图置顶的。求帮助。

六弦胖爷 Chrome70.0 Windows 7

2019-06-16 14:02:24 回复

独立页面的文章的正文内容，在电脑浏览器显示没有问题。手机端UC浏览器和微信直接打开页面，均看不到正文内容，不懂是哪里的问题。

公子 Chrome74.0 Mac OS 10.14.5

2019-06-17 13:45:34 回复

@六弦胖爷提供下地址我去看下吧。

六弦胖爷 WeChat7.0 iOS 12.1

2019-06-17 14:04:09 回复

@公子就看这个吧，一样的测试环境evaym.free.idcfengye.com

六弦胖爷 Chrome70.0 Windows 7

2019-06-17 15:01:32 回复

@公子手机端有事打开慢，没有完整加载css的情况，反而出现文章正文了，一旦样式加载完（界面正常了），就看不到文章正文。独立页面和文章都是如此。会是css的问题吗？能否加一下微信或QQ？

公子 Chrome75.0 Mac OS 10.14.5

2019-06-18 11:33:42 回复

@六弦胖爷 style.css 里面有一个 display:none 的逻辑，大概 3001 行的位置，你注释下就好了。

.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;*/
}

六弦胖爷 Chrome70.0 Windows 7

2019-06-18 13:01:54 回复

@公子果然是这个问题，真厉害，怎么定位出来的啊？之前你也碰到了吗？我看wordpress主题里的style.css，此处也是写着“display: none;”。注释掉就正常了，原因是什么呢？

六弦胖爷 UCBrowser12.4 iOS 12.1

2019-06-16 07:37:48 回复

从建站开始一直就用Wordpress，且没有看上过除TwentyFourteen以外的任意一款主题，自己的博客一直稳定用到现在，也没敢对程序大更新。最近帮朋友搭个环境，新版wp一直有些各种各样问题，不能轻易搞定，遂试了zblog和typecho，typecho除主题外都尽如意，没想到看到这个，真的惊喜。

苟保罗 Firefox47.0 Windows 10

2016-07-28 06:40:19 回复

听大气的博客模板，谢谢分享

DT27 Firefox46.0 Mac OS 10.11

2016-05-30 00:57:50 回复

博客按分类浏览文章翻页有问题。

黑暗游侠 Chrome48.0 Windows 7

2016-03-08 16:32:36 回复

居然移植到了te，不错~

edward Firefox33.0 Windows 7

2014-11-27 04:41:12 回复

请问我的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。是什么问题呀？非常感谢~~

公子 Chrome41.0 Windows 7

2014-11-29 00:16:37 回复

@edward汗Σ( ° △ °|||)︴小少年别被骗了，我这里写的是一个Typecho主题，不是WordPress啊(╯‵□′)╯︵┻━┻

Capricornusoel Firefox32.0 Windows XP

2014-09-19 06:58:48 回复

实在想不到这个居然是wp的默认主题。。。超好看

公子 Chrome37.0 Windows 7

2014-10-12 02:33:47 回复

@Capricornusoel 谢谢支持~

顾杨 Chrome21.0 Windows XP

2014-09-05 13:24:45 回复

请问wp的2014主题怎么让它页面居中呢？

公子 Chrome39.0 Windows 7

2014-09-06 07:24:12 回复

@顾杨 http://imnerd.org/twentyfourteen-for-typecho.html/comment-page-2#comment-1186404 估计你需要的是这个。

burncode Sogou Explorer1.0 Windows 7

2014-09-02 16:17:38 回复

看来我们审美观不同，我倒是觉得Twenty Thirteen很好看，而twentyfourteen却始终没什么好感

Mike Chrome37.0 Windows 7

2014-08-28 09:11:57 回复

移植到TE上来了哇
14是蛮好看的就是内容两边空着太多了有点奇怪= =

公子 Chrome39.0 Windows 7

2014-08-29 10:36:30 回复

@Mike 是的，所以准备有空换掉-。-|||

AvalonDragoN龙龙 Firefox31.0 Linux x86_64

2014-08-21 02:58:00 回复

我超喜欢官方的主题～～XD

公子 Chrome36.0 Windows 7

2014-08-23 14:30:31 回复

@AvalonDragoN龙龙嗯，我也超级喜欢的，不过好像新款的这版不是很好看，哎！

dvorak Safari7.0 Mac OS 10.9.4

2014-07-15 14:58:48 回复

求问下这款主题右边的白边怎么搞掉啊？谢！

公子 Chrome35.0 Windows 7

2014-07-15 15:02:39 回复

@dvorak 1.1版已经修复了这个问题了吧，你下1.1版试试呗。

dvorak Safari7.0 Mac OS 10.9.4

2014-07-15 15:10:56 回复

@公子用的是1.1啊，网页右边有很大一片空白…
http://v1.freep.cn/3tb_140715230726etbp512293.png

公子 Chrome35.0 Windows 7

2014-07-15 15:24:16 回复

@dvorak马丹，我写的是Typecho的主题，你拿着WordPress过来问真为什么不来事真的大丈夫么… WP的话请自行到style.css文件里面搜索max-width:1260px;并都删掉就好了…

dvorak Safari7.0 Mac OS 10.9.4

2014-07-16 03:25:38 回复

@公子抱歉我没说清楚。。。😛 我是从搜索引擎上搜索主题名字搜到这里来的，没仔细看，sorryyyyyyyy啦～之前把max-width改成2560px一点反应都没有，居然删掉就好使了，好奇怪，谢谢！

鲜活 IE11.0 Windows 7

2014-07-11 04:09:26 回复

不喜欢这款主题呢

阿飞 Chrome31.0 Windows 7

2014-04-09 02:42:34 回复

太、太、太不协调了，宽屏下空得太多了。
留言分页的页码是竖着的。chrome

公子 Chrome34.0 Windows 7

2014-04-13 15:24:32 回复

@阿飞嗯，我比较喜欢空着的感觉，个人癖好吧，哈哈哈哈…… 分页的那个一直没做，等有空的时候补上吧，谢谢大非老师~

WayJam Chrome33.0 Windows 8.1

2014-04-02 07:51:18 回复

感覺左邊欄太擠了。

公子 Chrome33.0 Windows 7

2014-04-02 14:08:47 回复

@WayJam 我倒觉得还好，可能我比较喜欢这种拥挤的感觉吧。

ccc Chrome33.0 Windows 7

2014-03-26 03:18:34 回复

话说怎么截全图的呀？？公子

ccc Chrome33.0 Windows 7

2014-03-26 02:59:31 回复

公子这个主题好棒！

公子 Chrome33.0 Windows 7

2014-03-26 04:31:14 回复

@ccc嘿嘿，总算有同好啦，西西妹最赞~关于截全图的话我使用的是Chrome的插件，叫“网页截图”。

hanabi Chrome31.0 Windows 8

2014-03-24 09:48:33 回复

左右都留了好多白额=-=

公子 Chrome33.0 Windows 7

2014-03-24 09:59:16 回复

@hanabi嗯，这个主题默认就是这个样子的，以后看烦了考虑一下加宽，哈哈~

浩子 Firefox27.0 Windows 7

2014-03-20 15:05:52 回复

不和谐啊~

公子 Chrome33.0 Windows 7

2014-03-21 04:10:56 回复

@浩子肿么不和谐了OAQ…

Jclyn Chrome33.0 Windows 8.1

2014-03-19 04:19:17 回复

真的好丑哈哈哈哈哈
P.S. 小插件上首页精选了~~~

公子 Chrome33.0 Windows 7

2014-03-19 04:59:07 回复

@Jclyn 拍死你(￣ε(#￣)☆╰╮o(￣皿￣///)
唔，那个字幕下载的？地址给我看看呗，感觉有点小激动，哈哈。

牧风 Chrome33.0 Windows 7

2014-03-18 09:21:58 回复

天空飘来四个字: 丑! 爆! 了!

公子 Chrome33.0 Windows 7

2014-03-18 10:17:35 回复

@牧风明明就是三个字好么！！！以及要……你……管！哼哼！

echochi Firefox27.0 Windows XP

2014-03-17 14:19:49 回复

我不太喜欢这次更新为全屏，能否给我一个老版（右侧空白的那个）的下载地址呢？

公子 Chrome33.0 Windows 7

2014-03-17 15:28:38 回复

@echochi OMG!居然还有人喜欢在旁边留白么…好吧，果然是很神奇的世界。老版下载地址：https://app.box.com/s/qxew0imypk2jemqr7a2z

echochi Firefox27.0 Windows XP

2014-03-18 04:20:59 回复

@公子谢谢

Kunr Chrome33.0 Windows 8.1

2014-03-15 11:38:13 回复

话说 max-width: 1260px; 这个是什么意思…大屏的人伤不起。

公子 Chrome33.0 Windows 7

2014-03-15 15:18:26 回复

@Kunr 额，作死的WP官方主题写的，我也不知道他们到底在想什么…

Kunr Chrome33.0 Windows 7

2014-03-28 13:24:02 回复

@公子
话说评论的分页没样式耶，评论回复提示又没了么…？

公子 Chrome33.0 Windows 7

2014-03-28 14:19:45 回复

@Kunr 嗯，评论分页的话之前没弄，后面还没想起来要弄，等闲下来再说吧。评论回复提示有的啊…

Kunr Chrome33.0 Windows 7

2014-03-29 00:20:25 回复

@公子
进垃圾了…

公子 Chrome33.0 Windows 7

2014-03-29 00:49:22 回复

@Kunr 邮件么，我待会儿试试去~

灰常记忆 Chrome24.0 Windows XP

2014-03-11 15:08:16 回复

强大收藏先

动漫那点事 Chrome30.0 Windows 7

2014-03-11 02:48:25 回复

我用的不是wp不过还是支持一下

小十 Chrome33.0 Windows 7

2014-03-04 01:56:48 回复

右边应该是自响应布局造成的。。PO主改下呗

羽中 Firefox27.0 Windows 7

2014-03-03 04:26:22 回复

我觉得还行吧，就绿色有点奇怪

lovee Safari7.0 Mac OS 10.9.2

2014-03-02 17:32:31 回复

提个意见（喂！），话说现在最外面这一层div没有居中，于是在超宽屏上看主题是全部靠左的看着很难受的说=w=a

公子 Chrome33.0 Windows 7

2014-03-03 02:32:12 回复

@lovee 额，居然有这回事？是div#page这个标签么？没有大屏真是桑不起啊OAQ… 以及lovee酱撒西不理~

Andrew Baidu26.3 Windows 7

2014-03-02 12:44:49 回复

wp的主题还是多

头像吧贴吧 Chrome28.0 Windows 7

2014-03-01 06:57:50 回复

关注下，是移动版？

公子 Chrome33.0 Windows 7

2014-03-01 07:23:01 回复

@头像吧贴吧 Responsive Theme。

Kunr Chrome32.0 Windows 7

2014-02-28 13:14:12 回复

唔。不错的样子

生活点滴 Chrome33.0 Windows 8.1

2014-02-28 12:45:47 回复

哈哈哈，刚开始还以为是Wordpress，赞一个

syoubunn Firefox27.0 Windows 8.1

2014-02-28 09:40:52 回复

@公子留言簿打不开

公子 Chrome33.0 Windows 7

2014-02-28 10:54:48 回复

@syoubunn 额，手贱有个错误，page.php第30行把

this->date(‘Y年m月d日’)

，少了一个引号，还有post.php也是一样的。

Louis Han Firefox27.0 Windows 7

2014-02-27 10:18:31 回复

默认主题还需要扒？

公子 Chrome33.0 Windows 7

2014-02-27 10:54:41 回复

@Louis Han 额，WordPress的默认主题跑Typecho来不要扒么？还是我没理解你的话的意思？

Louis Han Firefox27.0 Windows 7

2014-02-28 05:46:47 回复

@公子呃原来是te

公子 Chrome33.0 Windows 7

2014-02-28 10:51:07 回复

@Louis Han 汗，是呀…看来移植的比较成功，哈哈！

syoubunn Firefox27.0 Windows 8.1

2014-03-08 05:18:22 回复

@公子天哪，博主终于敢直面对“这个主题真是丑”这个现实了

公子 Chrome33.0 Windows 7

2014-03-09 01:54:50 回复

@syoubunn 滚蛋！我什么时候说这主题丑了？一个SPAM就好好的当你的SPAM好么，不要毫无意义的跳尸出来好么！

syoubunn Firefox27.0 Windows 8.1

2014-02-27 09:52:13 回复

哦，右侧有空白

公子 Chrome33.0 Windows 7

2014-02-27 09:53:48 回复

@syoubunn尽量忠于原主题…我只能这么说…虽然我也不明白那个空白是拿来干嘛的…

冰剑 LBBROWSER Windows 7

2014-02-28 00:57:41 回复

@公子右侧应该是留着贴巨幅广告的。。

公子 Chrome33.0 Windows 7

2014-02-28 03:58:04 回复

@冰剑就那么一点位置如何贴巨幅广告？

冰剑 LBBROWSER Windows 7

2014-02-28 06:37:54 回复

@公子我的屏幕还有160多像素的位置。。

挂个1024的广告足矣。

公子 Chrome33.0 Windows 7

2014-02-28 10:52:25 回复

@冰剑！！不会吧！Responsive也会出现这种情况？能给个截图看看么？有那么大的空白岂不是超级丑！！

syoubunn Firefox27.0 Windows 8.1

2014-02-27 09:50:07 回复

虽然不好看但是很吊的样子

冰剑 LBBROWSER Windows 7

2014-02-27 09:32:35 回复

我想说不好看可以吗？？

公子 Chrome33.0 Windows 7

2014-02-27 09:52:05 回复

@冰剑完全可以…仁者见仁智者见智嘛…反正我觉得还挺不错的就是拉。

移植主题TwentyFourteen

更新:

相关

83 评论