10 Feb 2012

艺术分享 | by | 阅读 5,176 次

代码实现WordPress归档页面模板【不同的效果】

代码实现WordPress归档页面模板【不同的效果】

2012年春节这段时间一直在折腾网站,细心的朋友也许发现了网站有了些细微的变化。

曾经听见有朋友说“为什么不能够在网站上以目录的形式将所有文章列出来呢,这样查找某篇文章多方便啊”,于是我就一直在思考这种方式,参照了zwwooooo写的《代码实现WordPress归档页面模板》后,做好了“归档”页面,但是问题也出现了,这个“展开”按钮,就是弹不开全部日志,始终都是收缩得紧紧的,于是便放弃了。

参考了威言威语后,终于使用代码写入了一个更加适合我的“归档”页面,将代码分享出来给更多需要的朋友,同时也记录下来,以免自己忘记了。

特点:

01.访问速度快。

02.显示每月文章数。

03.显示每篇文章的评论数。

效果:见我网站的存档页


下面是详细步骤

1. 把下面的函数代码扔进主题的 functions.php 里面 :

class hacklog_archives
{
	function GetPosts()
	{
		global  $wpdb;
		if ( $posts = wp_cache_get( 'posts', 'ihacklog-clean-archives' ) )
			return $posts;
		$query="SELECT DISTINCT ID,post_date,post_date_gmt,comment_count,comment_status,post_password FROM $wpdb->posts WHERE post_type='post' AND post_status = 'publish' AND comment_status = 'open'";
		$rawposts =$wpdb->get_results( $query, OBJECT );
		foreach( $rawposts as $key => $post ) {
			$posts[ mysql2date( 'Y.m', $post->post_date ) ][] = $post;
			$rawposts[$key] = null;
		}
		$rawposts = null;
		wp_cache_set( 'posts', $posts, 'ihacklog-clean-archives' );;
		return $posts;
	}
	function PostList( $atts = array() )
	{
		global $wp_locale;
		global $hacklog_clean_archives_config;
		$atts = shortcode_atts(array(
			'usejs'        => $hacklog_clean_archives_config['usejs'],
			'monthorder'   => $hacklog_clean_archives_config['monthorder'],
			'postorder'    => $hacklog_clean_archives_config['postorder'],
			'postcount'    => '1',
			'commentcount' => '1',
		), $atts);
		$atts=array_merge(array('usejs'=>1,'monthorder'   =>'new','postorder'    =>'new'),$atts);
		$posts = $this->GetPosts();
		( 'new' == $atts['monthorder'] ) ? krsort( $posts ) : ksort( $posts );
		foreach( $posts as $key => $month ) {
			$sorter = array();
			foreach ( $month as $post )
				$sorter[] = $post->post_date_gmt;
			$sortorder = ( 'new' == $atts['postorder'] ) ? SORT_DESC : SORT_ASC;
			array_multisort( $sorter, $sortorder, $month );
			$posts[$key] = $month;
			unset($month);
		}
		$html = '</pre>
<div class="car-container'; 		if ( 1 == $atts['usejs'] ) $html .= ' car-collapse'; 		$html .= '">'. "\n";
 if ( 1 == $atts['usejs'] ) $html .= '<a class="car-toggler" href="#">展开所有月份'."</a>\n\n";
 $html .= '
<ul class="car-list">
<ul class="car-list">' . "\n";</ul>
</ul>
<ul class="car-list">
<ul class="car-list">$firstmonth = TRUE;</ul>
</ul>
<ul class="car-list">
<ul class="car-list">foreach( $posts as $yearmonth => $posts ) {</ul>
</ul>
<ul class="car-list">
<ul class="car-list">list( $year, $month ) = explode( '.', $yearmonth );</ul>
</ul>
<ul class="car-list">
<ul class="car-list">$firstpost = TRUE;</ul>
</ul>
<ul class="car-list">
<ul class="car-list">foreach( $posts as $post ) {</ul>
</ul>
<ul class="car-list">
<ul class="car-list">if ( TRUE == $firstpost ) {</ul>
</ul>
<ul class="car-list">
<ul class="car-list">
<ul class="car-list">$html .= '</ul>
</ul>
</ul>
<ul class="car-list">
<ul class="car-list">
	<li><span class="car-yearmonth">+ ' . sprintf( __('%1$s %2$d'), $wp_locale->get_month($month), $year );
 if ( '0' != $atts['postcount'] )
 {
 $html .= ' <span title="文章数量">(共' . count($posts) . '篇文章)</span>';
 }
 $html .= "</span>\n
<ul class="car-monthlisting">
<ul class="car-monthlisting">\n";</ul>
</ul>
<ul class="car-monthlisting">
<ul class="car-monthlisting">$firstpost = FALSE;</ul>
</ul>
<ul class="car-monthlisting">
<ul class="car-monthlisting">}</ul>
</ul>
<ul class="car-monthlisting">
<ul class="car-monthlisting">
<ul class="car-monthlisting">$html .= '</ul>
</ul>
</ul>
<ul class="car-monthlisting">
<ul class="car-monthlisting">
	<li>' . mysql2date( 'd', $post->post_date ) . '日: <a href="' . get_permalink( $post->ID ) . '" target="_blank">' . get_the_title( $post->ID ) . '</a>';
 if ( '0' != $atts['commentcount'] && ( 0 != $post->comment_count || 'closed' != $post->comment_status ) && empty($post->post_password) )
 $html .= ' <span title="评论数量">(' . $post->comment_count . '条评论)</span>';
 $html .= "</li>
</ul>
</ul>
<ul class="car-monthlisting">
<ul class="car-monthlisting">\n";</ul>
</ul>
<ul class="car-monthlisting">
<ul class="car-monthlisting">}</ul>
</ul>
<ul class="car-monthlisting">$html .= "</ul>
\n</li>
</ul>
</ul>
<ul class="car-list">
<ul class="car-list">\n";</ul>
</ul>
<ul class="car-list">
<ul class="car-list">}</ul>
</ul>
<ul class="car-list">$html .= "</ul>
\n</div>
<pre>\n";
		return $html;
	}
	function PostCount()
	{
		$num_posts = wp_count_posts( 'post' );
		return number_format_i18n( $num_posts->publish );
	}
}
if(!empty($post->post_content))
{
	$all_config=explode(';',$post->post_content);
	foreach($all_config as $item)
	{
		$temp=explode('=',$item);
		$hacklog_clean_archives_config[trim($temp[0])]=htmlspecialchars(strip_tags(trim($temp[1])));
	}
}
else
{
	$hacklog_clean_archives_config=array('usejs'=>1,'monthorder'   =>'new','postorder'    =>'new');
}
$hacklog_archives=new hacklog_archives();

2. 复制一份主题的 page.php 更名为 archives.php,然后在最顶端加入:

<!--?php /* Template Name: archives */ ?-->

在<?php get_header();?>下面,加入如下代码:

<script type="text/javascript">
		/* <![CDATA[ */
			jQuery(document).ready(function() {
				jQuery('.car-collapse').find('.car-monthlisting').hide();
				jQuery('.car-collapse').find('.car-monthlisting:first').show();
				jQuery('.car-collapse').find('.car-yearmonth').click(function() {
					jQuery(this).next('ul').slideToggle('fast');
				});
				jQuery('.car-collapse').find('.car-toggler').click(function() {
					if ( '展开所有月份' == jQuery(this).text() ) {
						jQuery(this).parent('.car-container').find('.car-monthlisting').show();
						jQuery(this).text('折叠所有月份');
					}
					else {
						jQuery(this).parent('.car-container').find('.car-monthlisting').hide();
						jQuery(this).text('展开所有月份');
					}
					return false;
				});
			});
		/* ]]> */
	</script>

再然后找到类似 <?php content(); ?>,在其下面加入如下代码:

<!--?php echo $hacklog_archives--->PostList();?>

3.进wp后台添加一新页面,在右侧栏模板选择 archives。


剩下的就是对CSS进行调整以达到你想要的效果,比如字体大小,颜色等等。

好了,弄完,收工。



无觅相关文章插件,快速提升流量

该日志由 Mack 于2012年02月10日发表在 艺术分享 分类下, 你可以发表评论,并在保留原文地址及作者的情况下引用到你的网站或博客。

原创文章转载请注明: 代码实现WordPress归档页面模板【不同的效果】

本文固定链接: http://www.sweetbao.com/2012/02/code-to-achieve-the-wordpress-archive-page-template/

,

评论

5
19 十月 2013

网站建设 Mozilla Firefox Windows

知不知道文章归档的访问链接啊?求一个,不记得了额。

回复
    21 十月 2013

    Mack Google Chrome Windows

    就是按照那个步骤来弄。一步步就出来了!

    回复
30 三月 2012

郑凯彬 Google Chrome Windows

我是郑凯彬,一起交流下,可以来我博客看看。

回复
    9 四月 2012

    Mack Google Chrome Windows

    看了,内容很多,很全。

    回复

喜欢不喜欢,都留个言呗