落絮飞雁的个人网站

顺流而下,把梦做完

Twentyfourteen主题简单修改

博客目前在用的主题是WP自带的twentyfourteen主题。觉得还不错,拿来稍加修改就用了。

  • 适配宽屏

这套主题默认显示的最大宽度是1260px,就导致了在宽屏上浏览时网页右侧有一条很难看的白边。可以通过修改style.css实现:

.site-header {
	background-color: #000;
	max-width: 1260px;
	position: relative;
	width: 100%;
	z-index: 4;

其中max-width由1260px修改为max-width:100%;即可。

  • 修改默认配色

同样是style.css种修改背景色:

网站标题的背景色:
.site-header {
background-color: #000;

左侧边栏的背景色:
.site:before {
background-color: #000;

底边的背景色:
.site-footer {
background-color: #000;

或是插件解决:fourteen-colors

  • 修改每行正文显示宽度

每行正文显示的内容较少,同样通过修改style.css解决

 .page-content {
 margin: 0 auto;
 max-width: 474px;

474px修改为合适值,我选的630px。


原文标题:Twentyfourteen主题简单修改|落絮飞雁的个人网站
原文链接:https://www.luoxufeiyan.com/2014/12/26/twentyfourteen%e4%b8%bb%e9%a2%98%e7%ae%80%e5%8d%95%e4%bf%ae%e6%94%b9/
授权协议:创作共用 署名-非商业性使用 2.5 中国大陆
除注明外,本站文章均为原创;转载时请保留上述链接。
  1. 老牛博客说道:

    你的“发现更多”用的哪个插件?

    1. 落絮飞雁说道:

      用的是大侠-SEO工具(DX-SEO)这个插件里『相关文章』这个功能:-)

  2. 匿名说道:

    奋斗者的幸福是从痛苦起步的,享乐者的痛苦是从“幸福”开始的。

  3. 大程哥说道:

    终于看到一个使用一样主题的网站了,不过改得没有原版好看。