クールでかっこいいワードプレステーマ を カスタマイズすべ

クールでかっこいいWPテーマ ds8021系

クールでかっこいいWPテーマ、DS8021系は、最近の時流を先取りした感のあるギャラリータイプが使える。
ギャラリータイプとは、画像中心に記事のサムネイルをトップページにばさ~っと展開するタイプ。
 
SEO的には、サムネイルとタイトルしか表示されないのでちょいと不利。
 
それと、ダミーで2番目と8番目?に、CMバナーが表示されるようになっているのだけど、
デフォルトではA8のバナー。知らずにやってると、なんじゃこれ?になる。
 
そいつをカスタマイズしようってことで・・・ 今後このテーマを使うならば、毎回やらなければいけないので、もうやってしまって、それをバックアップしておいて使いまわすのが正解なのかも。
 

クールでかっこいいWPテーマ8021系CMバナーを外す

クールでかっこいいWPテーマ、8021の「テーマ編集」->「index.php」に問題の個所があります。
<div class="inner"> ←これが目印になる。


<?php  if ( $count==2 ) { ?>
<h3><a fref="http://px.a8.net/svt/ejp?a8mat=1TST05+7H3Y7M+1Y64+1HOFWH" target="_blank" rel="nofollow">[PR] 無限サーバー</a></h3>
<a href="http://px.a8.net/svt/ejp?a8mat=1TST05+7H3Y7M+1Y64+1HOFWH" target="_blank"><img border="0" width="350" height="240" alt="" src="http://www28.a8.net/svt/bgt?aid=110518997452&wid=001&eno=01&mid=s00000009094009016000&mc=1"></a><img border="0" width="1" height="1" src="http://www16.a8.net/0.gif?a8mat=1TST05+7H3Y7M+1Y64+1HOFWH" alt=""><div style="height:30px;"></div>
<?php } ?>


<?php  if ( has_post_thumbnail() ) { the_post_thumbnail(); } ?>
 
$count をカウントアップしながら、そのカウンター($count)が2のとき、8のとき、こちらを出してね? 
みたいな記述が上記。カスタマイズしてしまってるので、入っているのはアフィリリンクなんだけど、色を変えてあるところがそうね? 
 
捨てる場合には、<?php if ~ <?php } ?> までをとっぱらう。
 

トップページのサムネイル+タイトルに加えて、概要を表示

概要を出したいのは、トップでの単語数を稼ぎたいから。当然すべての記事を表示させるのではなくて、一定文字数までを表示させるってカスタマイズ。
 
構造解説
//表示数20個でデータを捕まえてこい
<?php query_posts($query_string . "&showposts=20"); ?> 
//投稿数がゼロでなければ以下を繰り返せ
<?php $count=1; if (have_posts()) : while (have_posts()) : the_post(); ?>

//---表示ブロック---
<div class="item">
<article>
<div class="inner">
//---/表示ブロック---

//もしカウンターが2なら以下を処理しろ
<?php  if ( $count==2 ) { ?>
//---表示ブロック---
<h3><a fref="http://px.a8.net/svt/ejp?a8mat=1TST05+7H3Y7M+1Y64+1HOFWH" target="_blank" rel="nofollow">[PR] 無限サーバー</a></h3>
<a href="http://px.a8.net/svt/ejp?a8mat=1TST05+7H3Y7M+1Y64+1HOFWH" target="_blank"><img border="0" width="350" height="240" alt="" src="http://www28.a8.net/svt/bgt?aid=110518997452&wid=001&eno=01&mid=s00000009094009016000&mc=1"></a><img border="0" width="1" height="1" src="http://www16.a8.net/0.gif?a8mat=1TST05+7H3Y7M+1Y64+1HOFWH" alt=""><div style="height:30px;"></div>
//---//表示ブロック---
<?php } ?>

//もしサムネイルがあるならサムネイルを表示しろ
<?php  if ( has_post_thumbnail() ) { the_post_thumbnail(); } ?>
//---表示ブロック---(タイトル)
<h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>

//キャッチコピーを持っているならキャッチコピーを表示しろ(これはたぶんドロップシッピング用データのため)
<?php $catchcopy = get_post_meta($post->ID, 'catchcopy', true); if ($catchcopy) { ?>
<p><?php echo $catchcopy; ?></p>
<?php } ?>

//金額をもっているなら金額を表示しろ(これはたぶんドロップシッピング用データのため)
<?php $cost = get_post_meta($post->ID, 'cost', true); if ($cost) { ?>
<div style="text-align:right; color: #CC0000;">税込価格:<span class="bld"><?php echo $cost; ?>円</span></div>
<?php } ?>

//続きを読むを表示
<div class="next"><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><span class="icon icon-next"></span></a></div>

</div>	// class=inner の終わり
</article>
</div>	// class=item の終わり

// カウンターアップ
<?php $count++; ?>

//繰り返しの末端
<?php endwhile; endif; ?>


キャッチコピーとか価格を出してる部分をカスタマイズするか、そこに記事の抜粋、もしくは、記事の最初だけを切り取ったものを表示させればいいわけだ。
 

記事の概要 もしくは、記事の抜粋を取り出すパーツ

挿入場所はわかった。次は、記事の概要があったら概要を表示、なければ記事そのものの抜粋(一定文字数を切り出す)を表示する方法だ。
 
function.php を触らないとできないってのがめんどうだけど。
function.php のどこでもいいから(改造するときは一番最後にくっつけると後が楽)
function new_excerpt_mblength($length) {
     return 100;
}	
add_filter('excerpt_mblength', 'new_excerpt_mblength');

function new_excerpt_more($more) {
	return '...';
}	
add_filter('excerpt_more', 'new_excerpt_more');

これは、WPのフックって原理を利用してる。ワードプレスは、プログラムを実行中われ先に突っ走るではなくて、そこはこっちにしてね?ってな感じで処理を変更できる。これがワードプレスの強いところだ。
 
で、new_excerpt_mblength ってのは、概要の長さを指定するコマンド。
new_excerpt_more ってのは、続く・・ みたいな文字を変更するコマンド。
使わなければ消しておけばいい。
 
とりあえず、なにもしないで表示させて、長かったり短かかったりしたら new_excerpt_mblength で変更してあげればいい。
 
※文字数を正確に指定するために 「WP Multibyte Patch」をインストールしておくこと。
 
で、function.php についかしておいて、実際に表示したい場所には以下をいれておく。
<?php the_excerpt(); ?>

入れてみよう。
//もしサムネイルがあるならサムネイルを表示しろ
<?php  if ( has_post_thumbnail() ) { the_post_thumbnail(); } ?>
//---表示ブロック---(タイトル)
<h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>

//---記事概要を表示---
<?php the_excerpt(); ?>
//---/記事概要を表示---

//キャッチコピーを持っているならキャッチコピーを表示しろ(これはたぶんドロップシッピング用データのため)
<?php $catchcopy = get_post_meta($post->ID, 'catchcopy', true); if ($catchcopy) { ?>
<p><?php echo $catchcopy; ?></p>
<?php } ?>

実際には、function.php に以下のように入れた。
    register_widget('WP_Widget_Cart');
    register_widget('WP_Widget_Kessai');
    register_widget('WP_Widget_Haisou');
}    
add_action('widgets_init', 'WP_Widget_CoolWebInit');


//-----------------------------------------------------------------------------
// append yuzumaru
//-----------------------------------------------------------------------------
// 概要表示文字数指定
function new_excerpt_mblength($length) {
     return 55;
}	
add_filter('excerpt_mblength', 'new_excerpt_mblength');

// 概要継続文字指定
function new_excerpt_more($more) {
	return '...';
}	
add_filter('excerpt_more', 'new_excerpt_more');

?>

最初100とかにしてみたんだけど、ちょっと文字数が多かったので55まで落とした。
継続文字をデフォルトにすると 8021 の場合、継続用のアイコンが表示されてるのでみっともない。
なので継続文字を「…」に変えた。
 
とりあえず、満足(笑)