WordPress制作一个首字母排序的标签页面

很早就想制作这样一个页面了，废话不多说， 先看看效果：传送门

在网上找了很多的代码，试了很久，修改了一些代码，最终就达到了现在的效果。
实现方法：（里面增加了缓存功能，打开页面更快，对数据进行了缓存，不用每次打开页面都查询所有标签然后按首字母分类。）
1.在functions.php函数文件中添加以下代码：

展开/收缩

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135

/** * 根据标题首字母制作标签页面 */ /** * 拼音首字母 */ function specs_getfirstchar($s0){ $fchar = ord($s0{0}); if($fchar >= ord("A") and $fchar <= ord("z") )return strtoupper($s0{0}); $s1 = iconv("UTF-8","gb2312", $s0); $s2 = iconv("gb2312","UTF-8", $s1); if($s2 == $s0){$s = $s1;}else{$s = $s0;} $asc = ord($s{0}) * 256 + ord($s{1}) - 65536; if($asc >= -20319 and $asc <= -20284) return "A"; if($asc >= -20283 and $asc <= -19776) return "B"; if($asc >= -19775 and $asc <= -19219) return "C"; if($asc >= -19218 and $asc <= -18711) return "D"; if($asc >= -18710 and $asc <= -18527) return "E"; if($asc >= -18526 and $asc <= -18240) return "F"; if($asc >= -18239 and $asc <= -17923) return "G"; if($asc >= -17922 and $asc <= -17418) return "H"; if($asc >= -17417 and $asc <= -16475) return "J"; if($asc >= -16474 and $asc <= -16213) return "K"; if($asc >= -16212 and $asc <= -15641) return "L"; if($asc >= -15640 and $asc <= -15166) return "M"; if($asc >= -15165 and $asc <= -14923) return "N"; if($asc >= -14922 and $asc <= -14915) return "O"; if($asc >= -14914 and $asc <= -14631) return "P"; if($asc >= -14630 and $asc <= -14150) return "Q"; if($asc >= -14149 and $asc <= -14091) return "R"; if($asc >= -14090 and $asc <= -13319) return "S"; if($asc >= -13318 and $asc <= -12839) return "T"; if($asc >= -12838 and $asc <= -12557) return "W"; if($asc >= -12556 and $asc <= -11848) return "X"; if($asc >= -11847 and $asc <= -11056) return "Y"; if($asc >= -11055 and $asc <= -10247) return "Z"; return null; } function specs_pinyin($zh){ $ret = ""; $s1 = iconv("UTF-8","gb2312", $zh); $s2 = iconv("gb2312","UTF-8", $s1); if($s2 == $zh){$zh = $s1;} $s1 = substr($zh,$i,1); $p = ord($s1); if($p > 160){ $s2 = substr($zh,$i++,2); $ret .= specs_getfirstchar($s2); }else{ $ret .= $s1; } return strtoupper($ret); } /** * 标签页面 */ function specs_show_tags() { if(!$output = get_option('specs_tags_list')){ $categories = get_terms( 'post_tag', array( 'orderby' => 'count', 'hide_empty' => 1 ) ); foreach($categories as $v){ for($i = 65; $i <= 90; $i++){ if(specs_pinyin($v->name) == chr($i)){ $r[chr($i)][] = $v; } } for($i=48;$i<=57;$i++){ if(specs_pinyin($v->name) == chr($i)){ $r[chr($i)][] = $v; } } } ksort($r); $output = "<ul class='list-inline' id='tag_letter'>"; for($i=65;$i<=90;$i++){ $tagi = $r[chr($i)]; if(is_array($tagi)){ $output .= "<li><a href='#".chr($i)."'>".chr($i)."</a></li>"; }else{ $output .= "<li>".chr($i)."</li>"; } } for($i=48;$i<=57;$i++){ $tagi = $r[chr($i)]; if(is_array($tagi)){ $output .= "<li><a href='#".chr($i)."'>".chr($i)."</a></li>"; }else{ $output .= "<li>".chr($i)."</li>"; } } $output .= "</ul>"; $output .= "<ul id='all_tags' class='list-unstyled'>"; for($i=65;$i<=90;$i++){ $tagi = $r[chr($i)]; if(is_array($tagi)){ $output .= "<li id='".chr($i)."'><h4 class='tag_name'>".chr($i)."</h4>"; foreach($tagi as $tag){ $output .= "<a href='".get_tag_link($tag->term_id)."'>".$tag->name."(".$tag->count.")</a>"; } } } for($i=48;$i<=57;$i++){ $tagi = $r[chr($i)]; if(is_array($tagi)){ $output .= "<li id='".chr($i)."'><h4 class='tag_name'>".chr($i)."</h4>"; foreach($tagi as $tag){ $output .= "<a href='".get_tag_link($tag->term_id)."'>".$tag->name."(".$tag->count.")</a>"; } } } $output .= "</ul>"; update_option('specs_tags_list', $output); } echo $output; } function clear_tags_cache() { update_option('specs_tags_list', ''); // 清空 specs_archives_list } add_action('save_post', 'clear_tags_cache'); // 新发表文章/修改文章时 /** * 根据标签ID活动标签文章数 */ function specs_post_count_by_tag ( $arg ,$type = 'include'){ $args=array( $type => $arg, ); $tags = get_tags($args); if ($tags) { foreach ($tags as $tag) { return $tag->count; } } }

2.复制一份page.php，然后更名为page-tag.php，然后上传到cpanel面板和page.php相同的路径下面
3.在page-tag.php中最上面添加下面代码：

1 2 3 4 5

<?php /* Template Name: Tags */ ?>

4.把page-tag.php页面中的下面代码

1	<?php the_content(); ?>

修改为：

1	<?php specs_show_tags(); ?>

5.在style.css中加入下面的代码，我根据网上的代码修改了很多，比如开始的时候有li标签的小方块，之后我自己去掉了，又比如开始的时候宽度和我的主题不适合，之后我使用审查元素自己找到问题然后修改了，最后就有了下面的CSS代码：

1 2 3 4 5 6 7 8 9 10 11 12

.tag_name{ width:1034px; float:left; line-height:30px; margin:25px 0 0 26px; font-size:14px; color:#000;line-height: 200%;} .tag_name_a{ width:1034px; float:left; border:2px solid #d8d9d9;} .tag_name_b{ width:680px; float:left; line-height:30px; margin:25px 0 0 26px; font-size:14px; color:#000;} .tag_name_c{ width:980px; height:45px; float:left; border-bottom:1px solid #d8d9d9; margin:25px 0 0 26px; font-size:20px; color:#000;} .list-unstyled{ width:1034px !important; float:left; line-height:30px; margin:25px 0 0 26px; font-size:14px; color:#000;line-height: 200%;margin: 2px;} .list-unstyled li{width: 1000px !important;float: left;margin: 0 5px 0 0;padding: 5px;list-style-type:none !important;} .list-unstyled a{color: #333333; padding: 5px 8px;} .list-inline {width:850px;list-style: none;height:100px; text-align:center; overflow:hidden; padding-top:0em;} .list-inline li{float: left;list-style-type:none !important;display: block;text-decoration: none;background: none repeat scroll 0 0 #333333; border: 5px solid #333333; color: #f7f8f8; margin: 1px; padding: 3px 8px;} .list-inline a{color: #f7f8f8;} .list-inline a:hover,.ist-inlin a.current {text-decoration: underline;background: none repeat scroll 0 0 #da5a04; border: 4px solid #da5a04; color: #f7f8f8; font-weight: bolder;}

上面的这些CSS代码可能不适合你的主题，有任何问题请评论留言。我会尽快回复。
6.新建一个页面，名字就写“标签”，内容不写，右边的“模板”选择Tags，然后保存即可，最后可以像我一样在菜单中添加标签页的链接就可以了哦！
参考网址：
1.http://blog.0660hf.com/261.html
2.http://9iphp.com/opensystem/wordpress/895.html