我爱你不是因为你是谁,而是我在你面前可以是谁。

给WordPress添加快速导航功能

技术文档 9410浏览 0评论

给您的主题添加如小站所示的快速导航功能,如下图所示:

ksdh

步骤如下:

1、在header.php中<head></head>之间加入如下代码:

 <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/facebox.js"></script>
 <script type="text/javascript">
  jQuery(document).ready(function($) {
    $('a[rel*=facebox]').facebox()
  })
 </script>

 
2、在header.php(或者其他文件)适当的位置加上:
<span><a href="#mydiv" rel="facebox">快速导航</a></span>
在header.php(或者其他文件)适当的位置加上:

 <div id="mydiv" style="display:none">
  <div>
   <h2>按月归档</h2>
   <ul>
    <?php wp_get_archives('type=monthly&limit=12'); ?>
   </ul>
  </div>
  <div>
   <h2>网站分类</h2>
   <ul>
    <?php wp_list_cats('show_count=1'); ?>
   </ul>
  </div>
  <div>
   <h2>随机阅读</h2>
   <ul>
    <?php random_posts ($limit=11, $length=400) ; ?>
   </ul>
  </div>
 </div>

3.将random_posts函数的相关定义放入functions.php中:

function random_posts ($limit = 5, $length = 400, $before = '<li>', $after = '</li>', $show_pass_post = false, $show_excerpt_in_title = true) {
    global $wpdb, $tableposts;
    $sql = "SELECT ID, post_title, post_date, post_content FROM $tableposts WHERE post_status = 'publish' ";
 if(!$show_pass_post) $sql .= "AND post_password ='' ";
 $sql .= "ORDER BY RAND() LIMIT $limit";
    $posts = $wpdb->get_results($sql);
 $output = '';
    foreach ($posts as $post) {
       $post_title = stripslashes($post->post_title);
 $post_date = mysql2date('j.m.Y', $post->post_date);
       $permalink = get_permalink($post->ID);
 $post_content = strip_tags($post->post_content);
 $post_content = stripslashes($post_content);
 $post_strip = substr($post_content,0,$length);
       $post_strip = utf8_trim($post_strip);
 $post_strip = str_replace('"', '', $post_strip);
 $output .= $before . '<a href="' . $permalink . '" rel="bookmark" title="';
 if($show_excerpt_in_title) {
  $output .= $post_strip . '...  ';
          } else  {
  $output .= 'Permanent Link: ' . str_replace('"', '', $post_title) . '...   ';
 }
 $output .= $post_date . '">' . $post_title . '</a>';
 if(!$show_excerpt_in_title) {
  $output .= ': ' . $post_strip . '...  ';
          }
 $output .= $after;
 }
 echo $output;
}

4、将js,images文件夹中的文件拷入相应文件夹,将style.css中的内容加入到您的相应文件中

5、修改js/facebox.js中loading_image和close_image变量的值,大概位置在49和50行

ok!

文件下载:点击下载

转载请注明:自由的风 » 给WordPress添加快速导航功能

发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

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

网友最新评论 (1)

  1. 这个不错哟,很强悍~

    tangzhehao2010-02-27 01:03 回复