WordPress美化方案:修改主题文件

 

基础知识

通过修改主题文件来实现一些外观和功能效果,这样避免了使用大量插件,不会影响加载速度,也没有兼容性的问题。

这个系列的另外两篇:
WordPress美化方案系列:插件篇
WordPress美化方案系列:插入代码

主题文件编辑入口:仪表盘——外观——编辑
主题文件的构成

主题文件主要构成

主题文件主要构成(点击查看大图)

下面一些应用示例。

 

一、修改页脚的文字

编辑主题文件:footer.php
找到相关的文字(一般是“自豪地采用WordPress”或是”Proudly by WordPress“),可以删除或修改。然后点击更新文件。

 

二、在每一页加入版权声明

编辑主题文件:single.php
在图中位置插入代码,会在文章下方生成一个文本,效果见第二张图。

版权声明代码

版权声明代码(single.php)

版权声明效果图

版权声明效果图

 

三、文章字数统计

编辑主题文件:functions.php,single.php
在functions.php末尾插入下面这段代码(一个统计文章字数的函数):

//字数统计
function count_words ($text) {
global $post;
if ( '' == $text ) {
 $text = $post->post_content;
 if (mb_strlen($output, 'UTF-8') < mb_strlen($text, 'UTF-8')) $output .= '文章字数:' . mb_strlen(preg_replace('/\s/','',html_entity_decode(strip_tags($post->post_content))),'UTF-8') . '字';
 return $output;
}
}

然后在single.php需要显示字数的地方插入:

<?php echo count_words ($text); ?>

 

四、个性化评论框

编辑主题文件:comments.php
这里可以实现的功能主要有:

  1. 自定义评论区的各个字段
  2. 增加或删除输入框,修改字段,增加提示字符
  3. 更改样式

首先在comments.php里加入一个评论框函数(comment_form()):

<?php comment_form($args); ?>

$args是你想要修改的字段或输入框,用来覆盖原有的内容。

比如你想修改评论框的标题(一般为“留下评论”)。通过增加下面这段代码即可实现:

<?php $args = array('title_reply'=>'说说你的想法吧!')?>
<?php comment_form($args); ?>

其中‘title_reply’是代表评论框标题的参数,后面是你要设置的内容。
类似的,可以在数组(array)加入更多参数,比如评论框上面的文字(’comment_notes_before)、评论框下面的文字(’comment_notes_after’)。更多的参数见官方文档

评论输入框通过传入$fields参数实现,但直接放到$args里更方便些:

<?php $args = array(
'fields' => array(
 'author' => '<p class="comment-form-author"><label for="author">昵称</label><input type="text" placeholder="姓名或昵称" aria-required="true" size="30" value="' . esc_attr( $commenter['comment_author'] ) . '" name="author" id="author"><span class="required">*</span></p>',
 'email' => '<p class="comment-form-email"><label for="email">邮箱</label><input type="text" placeholder="不想填的话可以用null@null.com" aria-required="true" size="30" value="' . esc_attr( $commenter['comment_author_email'] ) . '" name="email" id="email"><span class="required">*</span></p>',
 'url' => '<p class="comment-form-url"><label for="url">站点</label><input type="text" placeholder="个人主页网址,可留空" size="30" value="'.$comment_author_url.'" name="url" id="url"></p>' 
)?>

下面是我博客上的评论框代码(效果见下方评论区):

<?php $args = array(
  'title_reply'       => __( '说说你的想法吧!' ),

  'comment_notes_before' => '<p>邮箱不会被公开,必填项已用<span class="required">*</span>标出。',

  'fields' => array(
 'author' => '<p class="comment-form-author"><label for="author">昵称</label><input type="text" placeholder="姓名或昵称" aria-required="true" size="30" value="' . esc_attr( $commenter['comment_author'] ) . '" name="author" id="author"><span class="required">*</span></p>',
 'email' => '<p class="comment-form-email"><label for="email">邮箱</label><input type="text" placeholder="不想填的话可以用null@null.com" aria-required="true" size="30" value="' . esc_attr( $commenter['comment_author_email'] ) . '" name="email" id="email"><span class="required">*</span></p>',
 'url' => '<p class="comment-form-url"><label for="url">站点</label><input type="text" placeholder="个人主页网址,可留空" size="30" value="'.$comment_author_url.'" name="url" id="url"></p>' 
),

 'comment_field' => '<p class="comment-form-comment"><label for="comment">' . _x( 'Comment', 'noun' ) . '</label><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true">' . '</textarea></p>',

);?>

<?php comment_form($args); ?>

你可以只更改你想要设置的内容,删掉其他的内容。不要忘记把参数放进函数里(最后一行)。

具体内容见官方文档:Function Reference/comment form

 

五、修改边栏小工具

文件位置:wp-includes/widgets
样式文件:style.css

举两个小例子:

  1. 删除功能里的WordPress.org字段
    找到wp-includes/widgets文件夹下找到class-wp-widget-meta.php,打开后找到无序列表<ul></ul>里的四个<li>标签,删除最后一个即可。
  2. 修改日历中有活动日期的显示样式
    默认的日历样式太朴素,看不出今天的日期,有活动的日期也不够明显。在style.css中加入下面这段,即可使有发表文章的日期数字显示为粗体,绿色。
#wp-calendar tbody a { /*当天发表文章的*/
        font-weight:bold;
        color:green;
}

      其他的比如设置今天的日期数字为斜体加粗体:

#wp-calendar #today { /*今天*/
        font-weight:bold;
        font-style:italic;
}

 

总结

以上只是给出了几个修改主题文件的示例,具体还有很多内容可以探索,从官方文档开始新旅途吧!

 

撰写评论

电子邮件地址不会被公开,必填项已用 * 标出。