wordpress主题优化菜鸟版(陆续更新)

网络博客 郑永 9844℃ 11评论 单栏模式

 刚接触wordpress的时候,是自己在服务器上安装整个wordpress系统,找系统版本,入数据库,找主题找插件,修改代码等等,如今 yo2 为我们提供了wordpress中文系统,给写博客的朋友们省去了安装系统的烦琐步骤,把这么好的系统更快更简单的分享给我们,当然很多人是为了学习而认真的将wordpress上手,有一部分只想要现成的,刚接触wordpress,因为太复杂也就放弃了,不然的话,估计大部分的精力都投入到对wordpress的认识、接触、优化seo等等,结果大部分的时间和精力花在了博客系统上。
现在 yo2 的后台增加了主题编辑器,这个给我们带来了方便,以往要改个主题总是重复上传的动作,不仅如此,外一到了其他电脑上,还要携带原来的主题文件,我当时是放在Page Creator里,尽管如此,还是非常麻烦。因为多了个主题编辑器,我们就可以很方便的在原来的主题上修改代码了,今天 郑永 在这里写这篇文章,也是为了让大家共同学习修改主题代码或css样式的方法,掌握了修改方法,大家就可以自由的添加或修改主题代码来优化自己的博客了。提示:虽然作者认为修改代码要多尝试实践,但是新手修改代码的时候一定要用个记事本备份一下原代码,以防外一修改的不理想而导致不能恢复。
好了,下面开始谈谈如何修改优化代码,因为本人时间有限,文章会陆续更新,暂时先加点内容,我们的文章会谈到css和其他页面优化修改等,先谈谈自己站的修改方案,如果有什么问题可以在评论里提出。

1. 去掉评论的图标。
有一部分的主题样式自带了美化功能,故在评论的前面加上了个性图标,如果你不喜欢的话,可以删除掉,当然你要加上的话相反。
/*recent comments widget */
li.widget_recent_comments li{
background: url(images/mini-recent-comments.gif) no-repeat !important;
padding-left: 20px !important;
}
修改样式表文件,找到上面一段,把红色部分替换为#FFFFFF; 要其他颜色可以去查颜色表 ,去掉了图标,这个时候文本是靠右对齐,你可以替换代码中蓝色部分的left为right就OK了。

2.去掉博客的背景图片
body {
font: 75%/150% “Trebuchet MS”, Tahoma, Arial;
color: #333333;
background: #FFFFFF url(images/main-bg.gif);
margin: 0px;
padding: 0px 0px 30px;
}
修改样式表,找到上面这一段,删除红色一段,还可以修改博客背景颜色,把蓝色代码替换为你喜欢的颜色代码。

3.字体优化
仔细看看样式表,其实里面各个样式都很明确,比如:h1 的参数设置,在页面代码里所有有调用到h1的标签时候,就会按照装样式表里的设置参数来显示效果,我们来看看代码:
h1 {
margin:0px;
background: url(images/header-icon.gif) no-repeat;
padding-left: 70px;
height: 60px;
font: bold 36px/100% “Trebuchet MS”, Tahoma, Arial;
color: #c9eefe;
}
h1 a, h1 a:visited{
color: #c9eefe;
text-decoration: none;
}
h1 a:hover{
color: #ffffff;
text-decoration: none;
}

看看h1 { 这个,这是无超链接的时候样式,h1 a:hover{ 这个是超链接鼠标经过的样式,在里面你可以改字体大小,颜色等等,其他一些类似 h2,h3,h4等都可以修改或添加,然后在页面上应用。提示: google 收入一个网页重要的部分,一般先考虑 h1 ,h2,h3标签里面的内容,所以作者以前就有尝试把关键字放在里面。

4. 给单篇文章页面添加“上一篇,下一篇”文章显示
打开“单篇文章页面”文件,在你认为合适的位置添加如下代码:
<div align=”center”>上一篇:<?php previous_post_link(‘« %link’) ?>        (下一篇):<?php next_post_link(‘%link »’) ?></div>
提示:作者在上一篇和下一篇的中间使用了很多 代码,这是个空格代码,为了不让它们显示一块,影响阅读。当然你还可以添加<p>换行代码等,让他们两行显示。如果你使用<p>换行,会发现换行空的很大,很浪费显示空间,可以使用如下代码:
<div align=”center”>
把你的内容放这里
</div>

5.标题优化
 

title(页标题)是最重要的HTML标签,在搜索引擎里,文章的前部分比较重要,SEOmoz 的文章谈到,在页标题中最好带有网站名称和一些关键词、长度不超过32个中文字、不要放置没有关联的关键词、使用分割符,可以是 “|”(竖线)“-”(中划线)“«” “»”、还可以在文章内容中用 H1 来重复一次页标题内容。我个人观点不提倡使用«符号,感觉用-这个比较好。

<title>文章标题 – 网站名称</title>

如果有人调用 wp_title() 这个的话,标题里带了一个符号«,直接在括号里加‘’就OK了。本博的标题代码如下:
<title><?php wp_title(”); ?><?php if ( is_single() ) { ?> – <?php } ?> <?php bloginfo(‘name’); ?></title>
不怎么占同把网站的简介信息也加进去,因为遇到长的标题,再加上信息,标题太长不好。

本文章陆续更新,谢谢一起探讨,作者也是菜鸟,只要你提出,我就会去研究下解决方法。

转载请注明:郑永博客 » wordpress主题优化菜鸟版(陆续更新)

历史上的今天:

(11)个小伙伴在吐槽
Loading...
  1. mercy2007-08-06 23:06 Unknown Unknown 回复

    不错,对初学者很有帮助。

    回复:呵呵。

    沙发!
    • 郑 永2010-08-12 02:03 Internet Explorer 8 Windows XP 回复

      谢谢哈

  2. 舍予之间2007-08-25 17:54 Unknown Unknown 回复

    学习了,谢谢楼主分享! 8)

    板凳!
    • 郑 永2010-08-12 02:04 Internet Explorer 8 Windows XP 回复

      不客气。

  3. lokr2007-11-10 11:15 Unknown Unknown 回复

    :oops: 根本没用吧

    地板!
    • 郑 永2010-08-12 02:04 Internet Explorer 8 Windows XP 回复

      试了,便知道。

  4. Dang2007-11-18 02:42 Unknown Unknown 回复

    不错,对我有帮助!

    4楼
    • 郑 永2010-08-12 02:04 Internet Explorer 8 Windows XP 回复

      希望。

  5. 海天渺渺2009-09-01 03:36 Unknown Unknown 回复

    本人也是新加入wordpress的菜鸟。你的文章对我很有帮助,我就转载啦。

    5楼
    • 郑 永2010-08-12 02:04 Internet Explorer 8 Windows XP 回复

      呵呵 :) 欢迎转载。

  6. 养生保健2011-09-01 11:59 Opera 9 Windows XP 回复

    写的还真不错,以后有机会会场来的,希望能回访下。

    6楼
gravatar
发表我的评论
取消评论


Hi,请填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址