好きな場所に、好きなカテゴリー内容や好きなタグ内容の記事が簡単に貼れるソースです。
以下のソースをコピーし、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 |
<div id=”related-posts”> <div class=”caption”>こちらの記事も読まれてます:</div> <div class=”related” class=”clearfix”> <ul> <?php $post_num = 5; // 表示したい記事数 $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), // ここでは 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 href=”<?php echo the_permalink(); ?>” title=”<?php the_title(); ?>” ><img src=”<?php if ( get_post_meta($post->ID, ‘thumbnail1’, true) ) { echo get_post_meta($post->ID, ‘thumbnail1’, true);} elseif ( has_post_thumbnail() ){$thumbnail1_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), ‘thumbnail1’);echo $thumbnail1_url[0];}else{echo catch_first_image();} ?>” alt=”<?php the_title(); ?>” width=”120″ height=”120″ ></a> <a href=”<?php echo the_permalink(); ?>” ><?php the_title(); ?></a></li> <?php $exclude_id .= ‘,’ . $post->ID; $i ++; } wp_reset_query(); } if ( $i < $post_num ) { // tags 記事不足時はcategoryで補給 $cats = ”; foreach ( get_the_category() as $cat ) $cats .= $cat->cat_ID . ‘,’; $args = array( ‘category__in’ => explode(‘,’, $cats), // category内の記事指定 ‘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 href=”<?php echo the_permalink(); ?>” title=”<?php the_title(); ?>” ><img src=”<?php if ( get_post_meta($post->ID, ‘thumbnail1’, true) ) { echo get_post_meta($post->ID, ‘thumbnail1’, true);} elseif ( has_post_thumbnail() ){$thumbnail1_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), ‘thumbnail1’);echo $thumbnail1_url[0];}else{echo catch_first_image();} ?>” alt=”<?php the_title(); ?>” width=”120″ height=”120″ ></a> <a href=”<?php echo the_permalink(); ?>” ><?php the_title(); ?></a></li> <?php $i++; } wp_reset_query(); } if ( $i == 0 ) echo ‘<li>関連する記事は見つかりませんでした。</li>’; ?> </ul> </div> </div> <!– release post end –> |
下記のCSSコードをテーマ内の style.css 貼ります。一番下で問題ないです。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
/** related post thumbnail **/ #related-posts{border-radius:5px;border-top:3px #dfdfdf solid;background:#fff;clear:both;} .caption{color:#0C0C0B;font-size: 14px;font-weight:bold;padding-top: 10px;margin-bottom: 10px;margin-left:10px;} .related {white-space:normal;margin:0 auto;overflow: hidden;border-left: 1px solid #DFDFDF;margin-left:20px;} .related li{float: left;width: 120px;height:180px;list-style:none;border-right:1px solid #dfdfdf;padding:4px;_padding:2px;text-align: left;} .related a{float: left;width: 126px;text-overflow: ellipsis;-o-text-overflow: ellipsis;} .related a:hover{white-space: normal;} .related li:hover{background:#F6F6F6;} .related img{height:120px;width:120px;border:0;padding:0;} |
ブログのデザインにあうよう色など修正しても問題ありません。
一番上の single.php にソースを貼るのを嫌うなら、テーマ内に新規フォルダ作成し、その中に新PHPファイルを入れても構わない。
1、テーマ内に新規フォルダ作成 例:abcde
2、likeposts.phpを作り、先ほど作成した「abcdeフォルダ」に入れる。
3、下記のコードで呼び出すことも出来る。
1 |
<?php include(‘includes/likeposts.php’);?> |
注:includea/ 部分は自分が作成したフォルダ名に変更するか、新規フォルダ名はincludea使っても問題ありません。