wordpress中添加相关文章的多种方法详解 -wordpress教程

吾爱互联 · 发表于 2015-4-20 15:50:24

[文章目录]
<ul id="index-ul">
<li>一：添加文字列表的相关文章</li>
<li>1，添加如下的代码可以调用相关文章（方法一）</li>
<li>2，添加文字列表相关文章（方法二）</li>
<li>二：添加带有缩略图的相关文章</li>
<li>1，在你的functions.php函数中添加如下代码</li>
<li>.2，在你的single.php这个文章模板的代码里相关文章处添加如下代码</li>
</ul>
</div>
大家好，同学们好，今天吾爱互联与大家分享关于在wordpress中如何添加多
 
种相关文章的功能方法
 
我们先来看一看效果图共有两种
 
一种是文字列表的相关文章
 
一种是带有图片加文字标题的相关文章
 
<img class="aligncenter size-full wp-image-789" src="http://www.wpjiaocheng.com/wp-content/uploads/2014/08/19.png" alt="wordpress中添加相关文章的多种方法详解 " width="629" height="332" />
<img class="aligncenter size-full wp-image-790" src="http://www.wpjiaocheng.com/wp-content/uploads/2014/08/24.png" alt="wordpress中添加相关文章的多种方法详解 " width="421" height="209" />
具体的添加方法如下操作：
<h2 id="title-0">一：添加文字列表的相关文章
 
<h2 id="title-1">1，添加如下的代码可以调用相关文章（方法一）
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-c" start="1">
<li class="alt"><?php</li>
<li>global $post;</li>
<li class="alt">$cats = wp_get_post_categories($post->ID);</li>
<li>if ($cats) {</li>
<li class="alt">$args = array(</li>
<li>'category__in' => array( $cats[0] ),</li>
<li class="alt">'post__not_in' => array( $post->ID ),</li>
<li>'showposts' => 6,</li>
<li class="alt">'caller_get_posts' => 1</li>
<li>);</li>
<li class="alt">query_posts($args);</li>
<li></li>
<li class="alt">if (have_posts()) {</li>
<li>while (have_posts()) {</li>
<li class="alt">the_post(); update_post_caches($posts); ?></li>
<li><li><a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a><?php the_date_xml()?></li></li>
<li class="alt"><?php</li>
<li>}</li>
<li class="alt">}</li>
<li>else {</li>
<li class="alt">echo '<li>暂无相关文章</li>';</li>
<li>}</li>
<li class="alt">wp_reset_query();</li>
<li>}</li>
<li class="alt">else {</li>
<li>echo '<li>暂无相关文章</li>';</li>
<li class="alt">}</li>
<li>?></li>
</ol>
</div>
<h2 id="title-2">2，添加文字列表相关文章（方法二）
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-c" start="1">
<li class="alt"><h3>相关文章</h3></li>
<li><ul class="related_posts"></li>
<li class="alt"><?php</li>
<li>$post_num = 8;</li>
<li class="alt">$exclude_id = $post->ID;</li>
<li>$posttags = get_the_tags(); $i = 0;</li>
<li class="alt">if ( $posttags ) {</li>
<li>$tags = ''; foreach ( $posttags as $tag ) $tags .= $tag->term_id . ',';</li>
<li class="alt">$args = array(</li>
<li>'post_status' => 'publish',</li>
<li class="alt">'tag__in' => explode(',', $tags),</li>
<li>'post__not_in' => explode(',', $exclude_id),</li>
<li class="alt">'caller_get_posts' => 1,</li>
<li>'orderby' => 'comment_date',</li>
<li class="alt">'posts_per_page' => $post_num,</li>
<li>);</li>
<li class="alt">query_posts($args);</li>
<li>while( have_posts() ) { the_post(); ?></li>
<li class="alt"><li><a rel="bookmark" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank"><?php the_title(); ?></a></li></li>
<li><?php</li>
<li class="alt">$exclude_id .= ',' . $post->ID; $i ++;</li>
<li>} wp_reset_query();</li>
<li class="alt">}</li>
<li>if ( $i < $post_num ) {</li>
<li class="alt">$cats = ''; foreach ( get_the_category() as $cat ) $cats .= $cat->cat_ID . ',';</li>
<li>$args = array(</li>
<li class="alt">'category__in' => explode(',', $cats),</li>
<li>'post__not_in' => explode(',', $exclude_id),</li>
<li class="alt">'caller_get_posts' => 1,</li>
<li>'orderby' => 'comment_date',</li>
<li class="alt">'posts_per_page' => $post_num - $i</li>
<li>);</li>
<li class="alt">query_posts($args);</li>
<li>while( have_posts() ) { the_post(); ?></li>
<li class="alt"><li><a rel="bookmark" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank"><?php the_title(); ?></a></li></li>
<li><?php $i++;</li>
<li class="alt">} wp_reset_query();</li>
<li>}</li>
<li class="alt">if ( $i == 0 ) echo '<li>没有相关文章!</li>';</li>
<li>?></li>
<li class="alt"></ul></li>
</ol>
</div>
此种方法的样式代码：
<div class="dp-highlighter">
<ol class="dp-c" start="1">
<li class="alt">.related_posts{margin-top:5px;}</li>
<li>.related_posts li{margin-left:20px;color:#444;list-style:circle;font-size:14px;line-height:26px;padding:0 0 0 5px}</li>
</ol>
</div>
<h2 id="title-3">二：添加带有缩略图的相关文章
 
<h2 id="title-4">1，在你的functions.php函数中添加如下代码
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-c" start="1">
<li class="alt">//添加特色缩略图支持</li>
<li>if ( function_exists('add_theme_support') )add_theme_support('post-thumbnails');</li>
<li class="alt"></li>
<li>//输出缩略图地址 From wpjiaocheng.com</li>
<li class="alt">function post_thumbnail_src(){</li>
<li>global $post;</li>
<li class="alt">if( $values = get_post_custom_values("thumb") ) { //输出自定义域图片地址</li>
<li>$values = get_post_custom_values("thumb");</li>
<li class="alt">$post_thumbnail_src = $values [0];</li>
<li>} elseif( has_post_thumbnail() ){ //如果有特色缩略图，则输出缩略图地址</li>
<li class="alt">$thumbnail_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),'full');</li>
<li>$post_thumbnail_src = $thumbnail_src [0];</li>
<li class="alt">} else {</li>
<li>$post_thumbnail_src = '';</li>
<li class="alt">ob_start();</li>
<li>ob_end_clean();</li>
<li class="alt">$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);</li>
<li>$post_thumbnail_src = $matches [1] [0]; //获取该图片 src</li>
<li class="alt">if(emptyempty($post_thumbnail_src)){ //如果日志中没有图片，则显示随机图片</li>
<li>$random = mt_rand(1, 10);</li>
<li class="alt">echo get_bloginfo('template_url');</li>
<li>echo '/images/pic/'.$random.'.jpg'; //pic这是个存入图片的文件夹自己可以随意命名一般为random</li>
<li class="alt">//如果日志中没有图片，则显示默认图片</li>
<li>//echo '/images/default_thumb.jpg';</li>
<li class="alt">}</li>
<li>};</li>
<li class="alt">echo $post_thumbnail_src;</li>
<li>}</li>
</ol>
</div>
PS：上面的代码主要是获取图片链接，获取的顺序是：
自定义字段为 thumb 的图片>特色缩略图>文章第一张图片>随机图片/默认图片；
随机图片：请制作10张图片，放在现用主题文件夹下的 images/pic/ 目录，图片为jpg格式，并且使用数字 1-10命名，比如 1.jpg；如果你不想用随
机图片，请将倒数第5行前面的“//”去掉，然后给倒数第7、9行前面添加“//”注销，并且在现用主题的 /images/ 目录下添加一张名字为
default_thumb.jpg 的默认图片，这样，就会显示默认图片
<h2 id="title-5">.2，在你的single.php这个文章模板的代码里相关文章处添加如下代码
<div class="dp-highlighter">
<div class="bar"></div>
<ol class="dp-c" start="1">
<li class="alt"><h3>相关文章</h3></li>
<li><ul class="related_img"></li>
<li class="alt"><?php</li>
<li>$post_num = 4;</li>
<li class="alt">$exclude_id = $post->ID;</li>
<li>$posttags = get_the_tags(); $i = 0;</li>
<li class="alt">if ( $posttags ) {</li>
<li>$tags = ''; foreach ( $posttags as $tag ) $tags .= $tag->term_id . ',';</li>
<li class="alt">$args = array(</li>
<li>'post_status' => 'publish',</li>
<li class="alt">'tag__in' => explode(',', $tags),</li>
<li>'post__not_in' => explode(',', $exclude_id),</li>
<li class="alt">'caller_get_posts' => 1,</li>
<li>'orderby' => 'comment_date',</li>
<li class="alt">'posts_per_page' => $post_num</li>
<li>);</li>
<li class="alt">query_posts($args);</li>
<li>while( have_posts() ) { the_post(); ?></li>
<li class="alt"><li class="related_box" ></li>
<li><div class="r_pic"></li>
<li class="alt"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank"></li>
<li><img src="<?php echo post_thumbnail_src(); ?>" alt="<?php the_title(); ?>" class="thumbnail" /></li>
<li class="alt"></a></li>
<li></div></li>
<li class="alt"><div class="r_title"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank" rel="bookmark"><?php the_title(); ?></a></div></li>
<li></li></li>
<li class="alt"><?php</li>
<li>$exclude_id .= ',' . $post->ID; $i ++;</li>
<li class="alt">} wp_reset_query();</li>
<li>}</li>
<li class="alt">if ( $i < $post_num ) {</li>
<li>$cats = ''; foreach ( get_the_category() as $cat ) $cats .= $cat->cat_ID . ',';</li>
<li class="alt">$args = array(</li>
<li>'category__in' => explode(',', $cats),</li>
<li class="alt">'post__not_in' => explode(',', $exclude_id),</li>
<li>'caller_get_posts' => 1,</li>
<li class="alt">'orderby' => 'comment_date',</li>
<li>'posts_per_page' => $post_num - $i</li>
<li class="alt">);</li>
<li>query_posts($args);</li>
<li class="alt">while( have_posts() ) { the_post(); ?></li>
<li><li class="related_box" ></li>
<li class="alt"><div class="r_pic"></li>
<li><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank"></li>
<li class="alt"><img src="<?php echo post_thumbnail_src(); ?>" alt="<?php the_title(); ?>" class="thumbnail" /></li>
<li></a></li>
<li class="alt"></div></li>
<li><div class="r_title"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" target="_blank" rel="bookmark"><?php the_title(); ?></a></div></li>
<li class="alt"></li></li>
<li><?php $i++;</li>
<li class="alt">} wp_reset_query();</li>
<li>}</li>
<li class="alt">if ( $i == 0 ) echo '<div class="r_title">没有相关文章!</div>';</li>
<li>?></li>
<li class="alt"></ul></li>
<li></li>
<li class="alt">下面就是带有图片显示的相关文章样式</li>
<li></li>
<li class="alt">.related_posts{margin-top:5px;}</li>
<li>.related_img{width:600px;height:210px;}</li>
<li class="alt">.related_box{float:left;overflow:hidden;margin-top:5px;width:148px;border-right:1px #eee solid}</li>
<li>.related_box:hover{background:#f9f9f9}</li>
<li class="alt">.related_box .r_title{width:auto;height:72px;font-weight:400;font-size:14px;margin:0 10px;overflow:hidden;}</li>
<li>.related_box .r_pic{margin:6px}</li>
<li class="alt">.related_box .r_pic img{width:130px;height:100px;border:1px solid #e1e1e1;background:#fff;padding:2px}</li>
</ol>
</div>
这样就可以做类似无觅插件带有缩略图的相关文章效果，当然如果不用这种方法也是可以实现的，只要开启特设图像就可以做成，调用缩略图就可以了
当然没有这个方法全面，好了，同学们可以去尝试下吧，希望同学们将这些方法珍藏下来，为以后所用！