WordPress小技集

じじい

カテゴリーページ(カテゴリーアーカイブ)などで、現在のカテゴリー以下に所属する記事を一覧表示する方法じゃ。

記事一覧表示

記事を一覧表示するだけなら簡単なのじゃが、下位カテゴリー(子カテゴリー)を階層表示する場合は一工夫が必要じゃった。

使用方法

まず、functions.phpに下記コードを記述する。

 
/***** カテゴリ一覧表示 *****/
function get_child_category_all($id,$odrby,$odr) { 
	if     ( $odrby == 'title' ) $odrby = 'name';
	elseif ( $odrby == 'date'  ) $odrby = 'name';
	elseif ( $odrby == 'menu_order') $odrby = 'order';
	// 全カテゴリ取得 オブジェクトキャッシュを利用
	if ( ! $terms = wp_cache_get( 'all_category_lists', 'category' ) ) {
		$terms = get_terms( 'category', 'fields=all&get=all&orderby=' . $odrby . '&order=' . $odr );
		// オブジェクトキャッシュに追加
		wp_cache_add( 'all_category_lists', $cat_all, 'category' );
	}
	$cat_all = array();
	if(!$id){
		$cat_all = $terms;
	}else{
		foreach ($terms as $term) {
			// 引数1が引数2の親である場合にtrueを返す。('1','4')ではなく(1,4)で指定。
			if( cat_is_ancestor_of($id, $term->term_id) ) array_push($cat_all, $term);
		}
	}
	return $cat_all; 
}

function get_cat_archive_list($list,$showpost,$odrby,$odr) {
	// $list 出力対象カテゴリID(複数「,」区切り) : 指定なし or 0=すべて
	// $showpost 指定カテゴリ内の投稿記事タイトルを表示しない : true / false(デフォルト)
	// $odrby ソート項目 : date/name/id/order
	// $odr ソート順 : DESC/ASC
	
	$ary = explode(",",$list); // 第一階層
	foreach($ary as $id){
		$url = get_category_link($id);
		$nam = get_cat_name($id);
		?>
		<div class="post_list">
		<ul>
			<!--<li class="catname"><a href="<?php echo get_category_link($id) ?>"><?php echo get_cat_name($id) ?></a></li>-->
		<?php
		if (!$showpost) get_child_category_post($id,false,$odrby,$odr,'','');
		$terms = get_child_category_all($id,$odrby,$odr); // 第二階層
		foreach ($terms as $term) {
			$counter = new WP_Query("posts_per_page=-1&cat=$term->term_id");// 記事がない場合はカテゴリ名も表示しない
			if ($term->parent == $id && $counter->have_posts()) { ?>
					<li class="catname"><a href="<?php echo get_category_link($term->term_id) ?>"><?php echo get_cat_name($term->term_id) ?></a></li>
				<?php if (!$showpost) get_child_category_post($term->term_id,false,$odrby,$odr,'<ul>','</ul>');
				$chi = get_child_category_all($term->term_id,$odrby,$odr); // 第三階層
				foreach ($chi as $chi_id) {
					$counter = new WP_Query("posts_per_page=-1&cat=$chi_id->term_id");
					if ($chi_id->parent == $term->term_id && $counter->have_posts()) { ?>
					<ul>
						<li class="catname"><a href="<?php echo get_category_link($chi_id->term_id) ?>"><?php echo get_cat_name($chi_id->term_id) ?></a></li>
						<?php if (!$showpost) get_child_category_post($chi_id->term_id,false,$odrby,$odr,'<ul>','</ul>');
						$chi2 = get_child_category_all($chi_id->term_id,$odrby,$odr); // 第四階層
						foreach ($chi2 as $chi_id2) {
							$counter = new WP_Query("posts_per_page=-1&cat=$chi_id2->term_id");
							if ($chi_id2->parent == $term->term_id && $counter->have_posts()) { ?>
							<ul>
								<li class="catname"><a href="<?php echo get_category_link($chi_id2->term_id) ?>"><?php echo get_cat_name($chi_id2->term_id) ?></a></li>
								<?php if (!$showpost) get_child_category_post($chi_id2->term_id,true,$odrby,$odr,'<ul>','</ul>'); // カテゴリ以下全て
							?>
							</ul>
							<?php } ?>
						<?php } ?>
					</ul>
					<?php }
				}
			}
		} ?>
		</ul>
		</div>
	<?php }
}

function get_child_category_post($cat_id,$recflg,$odrby,$odr,$before,$after) {
	// $recflg:指定カテゴリ以下すべての記事を出力する false/true
	// $before:最初に出力する文字 デフォルト空白
	// $after:最後に出力する文字 デフォルト空白
	global $post;
	$flg = false;
	$posts_data = get_posts("numberposts=-1&category=$cat_id&orderby=$odrby&order=$odr");
	if($posts_data){ ?>
		<?php foreach ($posts_data as $post){
			setup_postdata($post);
			if($recflg || in_category($cat_id)) {
				if(!$flg) {echo $before;$flg=true;}
				$str=mb_strimwidth(the_title('','',false), 0, 80, '...',utf8);//半角80文字以上は...と略す ?>
				<li class="postname"><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php echo $str; ?></a>
					<span class="cat_list_archive">
						<?php the_tags(' - <span class="tags">', ', ', '</span>'); ?>
						<?php if ( comments_open() ) : ?>
						- <span class="bubble"><?php comments_popup_link('コメント','コメント (1)', 'コメント (%)', '',''); ?></span>
						<?php endif; ?>
						<?php edit_post_link(' &raquo 編集 &laquo',' | ',''); ?>
						- <span class="date_list"><?php the_time('Y/m/d  G:i'); ?></span>
					</span>
				</li>
			<?php }
		}
		if($flg) echo $after;
	}
}

記事タイトルが長いと改行されてしまうので、半角80文字以上の場合は「 ... 」に略すようにしておる。
また、4階層以上の記事は、4階層目に集約して出力しておる。必要があれば適時修正して欲しい。

次に、記事一覧を表示させたい場所で関数を呼び出す。
index.php、archive.php、category.phpなど。

<?php 
	$cat_id = get_query_var('cat'); // 現在のカテゴリIDを取得
	get_cat_archive_list($cat_id);
?>

カテゴリ: WordPress小技集  | コメント 2010/05/06 9:15
じじい

レイアウトによっては、タイトルや抜粋などの文字数をデフォルトよりも短くしたい場合があるじゃろう。そこで、文字数を制限して出力する方法を紹介しよう。

使用方法

テンプレートファイルの任意の場所で、下記コードを記述する。
下記例では抜粋を先頭から50文字だけ出力している。

// mb_substr(元の文字列, 開始位置, 文字数)
<?php echo mb_substr(get_the_excerpt(), 0, 50); ?>

カテゴリ: WordPress小技集  | コメント 2010/04/29 21:43
じじい

記事にJavaScriptやPHP等のソースを貼り付けると、「”」(ダブルクォーテーション)や「’」(シングルクォーテーション)が全角に変換されてしまう。見た目にはそれほど違和感が無いかもしれないのじゃが、当然ながらそのソースをコピーして使用すればエラーになってしまうじゃろう。そこで、これらの自動置換を無効にする方法を紹介しよう。

使用方法

functions.phpに、以下のコードを記述する。

<?php
remove_filter('the_excerpt',  'wptexturize'); // 抜粋の自動置換を無効
remove_filter('the_title',    'wptexturize'); // 記事タイトルの自動置換を無効
remove_filter('the_content',  'wptexturize'); // 本文の自動置換を無効
?>

カテゴリ: WordPress小技集  | コメント 2010/04/29 21:21
じじい

記事の投稿やページ作成をすると、自動で<p>タグが挿入されたり、改行が<br>に変換されたりと、自動で整形してくれるんじゃが、これらのおかげで思ったようなレイアウトにならない場合があるじゃろう。
ここでは、<p>タグや<br>タグへの自動整形を無効にする方法を紹介する。

使用方法

 functions.phpに、以下のコードを記述する。

<?php
remove_filter('comment_text', 'wpautop');// コメントの&lt;p&gt;タグ
remove_filter('the_content', 'wpautop'); // ビジュアルエディタの&lt;p&gt;タグ
remove_filter('the_excerpt', 'wpautop'); // 抜粋の&lt;p&gt;タグ
?>

カテゴリ: WordPress小技集  | コメント 2010/04/29 20:59
じじい

投稿記事内容によっては、特殊なCSSやJavaScriptを追加したい場合が発生するじゃろう。タグ内に直接書いても動作するのじゃが、 設定が多い場合や、複数記事に適用する場合などは、別ファイルにしてヘッダ内に記述した方が管理が簡単になる。
そこで、記事のカスタムフィールドを利用し、ヘッダ内に記述を追加する方法を紹介しよう。

使用方法

 1.記事のカスタムフィールドに、以下のデータを設定
  キー:AddHeader
  値 :記述例 <link rel="stylesheet" href="css fileなど" type="text/css" />
 2.functions.phpに、下記コードを記述

<?php
// 記事のカスタムフィールド「AddHeader」に値があれば、HEAD内に挿入する
add_action('wp_head', 'st_wp_head');
function st_wp_head() { 
   $AddHeader = '';
   if (have_posts()) : while (have_posts()) : the_post();
      if ($tmp = get_post_meta(get_the_ID(), 'AddHeader', true)) $AddHeader .= $tmp;
   endwhile; endif;
   if ($AddHeader) {
      echo $AddHeader;
   }
}
?> 
カテゴリ: WordPress小技集  | コメント 2010/04/19 7:10
じじい

記事の抜粋を表示した際、本文が長い場合は省略され、[...]という文字列に置き換えられる。 慣れれば平気かもしれんが、どうも見栄えが良くないので、この文字列を変更しよう。 WordPress 2.9 以降では、excerpt_more フィルターを使うことで変更することが可能じゃ。

使用方法
 functions.phpに、以下のコードを記述する。
[...] を 続きを読む>> に変更し、記事へのリンクを表示している。

<?php
   add_filter('excerpt_more', 'new_excerpt_more');
   function new_excerpt_more($post) {
      return ' ... <a href="'. get_permalink($post->ID) .'">'.'続きを読む>>'.'</a>';
   }
?> 
カテゴリ: WordPress小技集  | コメント 2010/04/19 6:50
じじい

カテゴリーアーカイブのページで、投稿記事から画像ファイルを取得し、サムネイル一覧を表示する。

プラグインやカスタムフィールドを使ってサムネイル表示する方法もあるんじゃが、過去記事の編集をせずに実現する方法を模索した結果、 投稿記事内の img タグから画像URLを取得し、サムネイル表示する方法を紹介しよう。過去記事に手を加えたり、データベースに値を書き込む必要がなく、 とてもシンプルな方法じゃ。

使用方法
 index.phpのカテゴリーアーカイブ出力箇所に、以下のコードを記述する。
テーマによっては、category.phpやarchive.phpかもしれん。

<?php if (have_posts()) :
   $post = $posts[0];
   $cat_id = get_cat_ID(single_cat_title('',false)); ?>
   <?php if (is_category(10)) { /* カテゴリIDで条件分岐 指定なしで全て:例)ID:10だった場合 /* ?>
      <h2><?php single_cat_title(); ?></h2>
      <?php /* posts_per_pageで表示件数を30件にしている /*
      query_posts($query_string . '&posts_per_page=30');
      while (have_posts()) : the_post(); ?>
         <div style="float:left;width=200px;padding:10px;text-align:center;">
         <?php preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"]/i', $post->post_content, $imgurl) ?>
         <?php if ($imgurl[1][0]): /* 画像が存在した場合 /* ?>
            <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
            <img src="<?php echo $imgurl[1][0] ?>" alt="<?php the_title_attribute(); ?>" width="180" /></a>
         <?php else: /* 画像が存在しない場合 /* ?>
            <br />
         <?php endif ?>
         <a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>">
         <?php the_title(); ?></a>
         </div>
      <?php endwhile; ?>
   <?php }else{ /* それ以外のカテゴリIDの場合 /* ?>
   
      <?php /* 通常出力の記述 /* ?>
   
   <?php } ?>
<?php endif; ?>
カテゴリ: WordPress小技集  | コメント 2010/04/19 5:31
じじい

カテゴリーアーカイブのページに、トップカテゴリからのブレッドクラム【パンくずリスト】を表示する。

例: Home > AAA > BBB

使用方法
 index.phpのカテゴリーアーカイブ出力箇所に、以下のコードを記述する。
テーマによっては、category.phpやarchive.phpかもしれん。

<a href="<?php echo get_option('home'); ?>">Home</a> » 
<?php 
   $str = get_category_parents(get_cat_ID(single_cat_title('',false)), true, ' » ',false);
   $len = strlen($str);
?>
<?php echo substr($str,0,$len-3); ?>
カテゴリ: WordPress小技集  | コメント 2010/04/14 10:16
じじい

ブレッドクラム【パンくずリスト】とは、現在表示されているページの、上位ページからのリンク(階層構造)を表示する機能のことじゃ。サイトの訪問者が現在位置を直感的に理解するのに役立つじゃろう。

例: Home > AAA > BBB

投稿記事の個別ページに、トップカテゴリからのブレッドクラム【パンくずリスト】を表示する。

使用方法

single.phpのブレッドクラムを表示させたい場所に、以下のコードを記述する。

<?php $cat = get_the_category();$cat = $cat[0]; ?>
<div id="breadcrumb">
<a href="<?php echo get_option('home'); ?>">Home</a> » 
<?php echo get_category_parents($cat->cat_ID, true, ' » ',false); ?> <?php the_title(); ?>
カテゴリ: WordPress小技集  | コメント 2010/04/14 9:42
じじい

ブレッドクラム【パンくずリスト】とは、現在表示されているページの、上位ページからのリンク(階層構造)を表示する機能のことじゃ。サイトの訪問者が現在位置を直感的に理解するのに役立つじゃろう。

例: Home > AAA > BBB

固定ページに、親ページからのブレッドクラム【パンくずリスト】を表示する。

使用方法

page.phpのブレッドクラムを表示させたい場所に、以下のコードを記述する。

<a href="<?php echo get_option('home'); ?>">Home</a> » 
<?php foreach ( get_post_ancestors($post->ID) as $parid ) { ?>
<a href="<?php echo get_page_link( $parid );?>" title="<?php echo get_page($parid)->post_title; ?>">
<?php echo get_page($parid)->post_title; ?></a> » 
<?php } ?>
<?php the_title(); ?>
カテゴリ: WordPress小技集  | コメント 2010/04/14 9:12