本文将教会你如何为WordPress添加相关文章功能，并提供了标题列表样式和缩略图样式。相关文章的获取思路是：Tags标签相关>同分类下文章，也就是说，先获取标签相同的文章，如果还达不到数量，就调用该分类下的文章补足。获取方法貌似最初来自Willin Kan 大师，倡萌再次修改。
1.添加标题列表样式的相关文章
将下面的代码添加到 single.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
<h3>相关文章</h3> <ul class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"related_posts\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"> <?php $post_num = 8; $exclude_id = $post->ID; $posttags = get_the_tags(); $i = 0; if ( $posttags ) { $tags = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; foreach ( $posttags as $tag ) $tags .= $tag->term_id . \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; $args = array( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'post_status\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'publish\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'tag__in\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', $tags), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'post__not_in\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', $exclude_id), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'caller_get_posts\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => 1, \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'orderby\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'comment_date\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'posts_per_page\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => $post_num, ); query_posts($args); while( have_posts() ) { the_post(); ?> <li><a rel=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"bookmark\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" href=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"https://www.wpzt.net/<?php the_permalink(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" title=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"<?php the_title(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" target=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"_blank\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"><?php the_title(); ?></a></li> <?php $exclude_id .= \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' . $post->ID; $i ++; } wp_reset_query(); } if ( $i < $post_num ) { $cats = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; foreach ( get_the_category() as $cat ) $cats .= $cat->cat_ID . \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; $args = array( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'category__in\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', $cats), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'post__not_in\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', $exclude_id), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'caller_get_posts\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => 1, \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'orderby\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'comment_date\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'posts_per_page\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => $post_num - $i ); query_posts($args); while( have_posts() ) { the_post(); ?> <li><a rel=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"bookmark\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" href=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"https://www.wpzt.net/<?php the_permalink(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" title=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"<?php the_title(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" target=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"_blank\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"><?php the_title(); ?></a></li> <?php $i++; } wp_reset_query(); } if ( $i == 0 ) echo \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'<li>没有相关文章!</li>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; ?> </ul>
PS：第四行$post_num = 8;表示显示8篇文章，请根据自己的需要修改。
显示样式需要自己写css，可以参考一下下面的：
1 2
.related_posts{margin-top:5px;} .related_posts li{margin-left:20px;color:#444;list-style:circle;font-size:14px;line-height:26px;padding:0 0 0 5px}
2.添加含缩略图的相关文章
倡萌只是根据上面的代码改了一下，添加了缩略图。
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
//添加特色缩略图支持 if ( function_exists(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'add_theme_support\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\') )add_theme_support(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'post-thumbnails\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'); //输出缩略图地址 From wpdaxue.com function post_thumbnail_src(){global $post; if( $values = get_post_custom_values(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"thumb\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\") ) { //输出自定义域图片地址 $values = get_post_custom_values(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"thumb\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"); $post_thumbnail_src = $values [0]; } elseif( has_post_thumbnail() ){ //如果有特色缩略图，则输出缩略图地址 $thumbnail_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'full\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'); $post_thumbnail_src = $thumbnail_src [0];} else { $post_thumbnail_src = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; ob_start(); ob_end_clean(); $output = preg_match_all(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'/<img.+src=[\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"]([^\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"]+)[\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"].*>/i\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', $post->post_content, $matches); $post_thumbnail_src = $matches [1] [0];//获取该图片 src if(empty($post_thumbnail_src)){ //如果日志中没有图片，则显示随机图片 $random = mt_rand(1, 10); echo get_bloginfo(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'template_url\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'); echo \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'/images/pic/\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'.$random.\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'.jpg\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; //如果日志中没有图片，则显示默认图片 //echo \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'/images/default_thumb.jpg\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; } }; echo $post_thumbnail_src; }
PS：上面的代码主要是获取图片链接，获取的顺序是：
自定义字段为 thumb 的图片>特色缩略图>文章第一张图片>随机图片/默认图片；
随机图片：请制作10张图片，放在现用主题文件夹下的 images/pic/ 目录，图片为jpg格式，并且使用数字 1-10命名，比如 1.jpg；如果你不想用随机图片，请将 倒数第5行 前面的“//”去掉，然后给 倒数第7、9行 前面添加“//”注销，并且在现用主题的 /images/ 目录下添加一张名字为 default_thumb.jpg 的默认图片，这样，就会显示默认图片。
2)将下面的代码添加到 single.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
<h3>相关文章</h3> <ul class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"related_img\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"> <?php $post_num = 4; $exclude_id = $post->ID; $posttags = get_the_tags(); $i = 0; if ( $posttags ) { $tags = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; foreach ( $posttags as $tag ) $tags .= $tag->term_id . \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; $args = array( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'post_status\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'publish\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'tag__in\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', $tags), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'post__not_in\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', $exclude_id), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'caller_get_posts\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => 1, \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'orderby\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'comment_date\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'posts_per_page\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => $post_num ); query_posts($args); while( have_posts() ) { the_post(); ?> <li class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"related_box\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" > <div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"r_pic\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"> <a href=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"https://www.wpzt.net/<?php the_permalink(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" title=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"<?php the_title(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" target=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"_blank\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"> <img src=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"https://www.wpzt.net/<?php echo post_thumbnail_src(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" alt=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"<?php the_title(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"thumbnail\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" /> </a> </div> <div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"r_title\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"><a href=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"https://www.wpzt.net/<?php the_permalink(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" title=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"<?php the_title(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" target=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"_blank\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" rel=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"bookmark\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"><?php the_title(); ?></a></div> </li> <?php $exclude_id .= \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' . $post->ID; $i ++; } wp_reset_query(); } if ( $i < $post_num ) { $cats = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; foreach ( get_the_category() as $cat ) $cats .= $cat->cat_ID . \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; $args = array( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'category__in\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', $cats), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'post__not_in\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => explode(\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', $exclude_id), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'caller_get_posts\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => 1, \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'orderby\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'comment_date\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'posts_per_page\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => $post_num - $i ); query_posts($args); while( have_posts() ) { the_post(); ?> <li class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"related_box\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" > <div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"r_pic\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"> <a href=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"https://www.wpzt.net/<?php the_permalink(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" title=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"<?php the_title(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" target=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"_blank\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"> <img src=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"https://www.wpzt.net/<?php echo post_thumbnail_src(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" alt=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"<?php the_title(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"thumbnail\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" /> </a> </div> <div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"r_title\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"><a href=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"https://www.wpzt.net/<?php the_permalink(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" title=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"<?php the_title(); ?>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" target=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"_blank\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\" rel=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"bookmark\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"><?php the_title(); ?></a></div> </li> <?php $i++; } wp_reset_query(); } if ( $i == 0 ) echo \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'<div class=\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"r_title\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\">没有相关文章!</div>\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'; ?> </ul>
PS：第四行$post_num = 4; 表示调用4篇文章，请根据自己需要修改。
css样式自己写，也可参考一下：
1 2 3 4 5 6 7
.related_posts{margin-top:5px;} .related_img{width:600px;height:210px;} .related_box{float:left;overflow:hidden;margin-top:5px;width:148px;border-right:1px #eee solid} .related_box:hover{background:#f9f9f9} .related_box .r_title{width:auto;height:72px;font-weight:400;font-size:14px;margin:0 10px;overflow:hidden;} .related_box .r_pic{margin:6px} .related_box .r_pic img{width:130px;height:100px;border:1px solid #e1e1e1;background:#fff;padding:2px}
