码迷,mamicode.com
首页 > 编程语言 > 详细

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

时间:2015-12-21 14:09:10      阅读:209      评论:0      收藏:0      [点我收藏+]

标签:

很早就想制作这样一个页面了,废话不多说, 技术分享 先看看效果:传送门
技术分享
在网上找了很多的代码,试了很久,修改了一些代码,最终就达到了现在的效果。
实现方法:(里面增加了缓存功能,打开页面更快,对数据进行了缓存,不用每次打开页面都查询所有标签然后按首字母分类。)
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

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

标签:

原文地址:http://www.cnblogs.com/shenjieblog/p/5063076.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!