WordPressのカスタマイズの時に便利なプログラムサンプルをまとめたいと思います。
今回はfunctions.php内にコピペするだけでできるコードに絞って紹介します。
パンくずナビを実装する
function breadcrumb($divOption = array("id" => "breadcrumb", "class" => "breadcrumb inner")){
global $post;
$str ='';
if(!is_home()&&!is_admin()){
$tagAttribute = '';
foreach($divOption as $attrName => $attrValue){
$tagAttribute .= sprintf(' %s="%s"', $attrName, $attrValue);
}
$str.= '<div'. $tagAttribute .'>';
$str.= '<ul>';
$str.= '<li><a href="'. home_url() .'/">ホーム</a></li>';
if(is_category()) {
$cat = get_queried_object();
if($cat -> parent != 0){
$ancestors = array_reverse(get_ancestors( $cat -> cat_ID, 'category' ));
foreach($ancestors as $ancestor){
$str.='<li><a href="'. get_category_link($ancestor) .'">'. get_cat_name($ancestor) .'</a></li>';
}
}
$str.='<li>'. $cat -> name . '</li>';
} elseif(is_single()){
$categories = get_the_category($post->ID);
$cat = $categories[0];
if($cat -> parent != 0){
$ancestors = array_reverse(get_ancestors( $cat -> cat_ID, 'category' ));
foreach($ancestors as $ancestor){
$str.='<li><a href="'. get_category_link($ancestor).'">'. get_cat_name($ancestor). '</a></li>';
}
}
$str.='<li><a href="'. get_category_link($cat -> term_id). '">'. $cat-> cat_name . '</a></li>';
$str.= '<li>'. $post -> post_title .'</li>';
} elseif(is_page()){
if($post -> post_parent != 0 ){
$ancestors = array_reverse(get_post_ancestors( $post->ID ));
foreach($ancestors as $ancestor){
$str.='<li><a href="'. get_permalink($ancestor).'">'. get_the_title($ancestor) .'</a></li>';
}
}
$str.= '<li>'. $post -> post_title .'</li>';
} elseif(is_date()){
if(get_query_var('day') != 0){
$str.='<li><a href="'. get_year_link(get_query_var('year')). '">' . get_query_var('year'). '年</a></li>';
$str.='<li><a href="'. get_month_link(get_query_var('year'), get_query_var('monthnum')). '">'. get_query_var('monthnum') .'月</a></li>';
$str.='<li>'. get_query_var('day'). '日</li>';
} elseif(get_query_var('monthnum') != 0){
$str.='<li><a href="'. get_year_link(get_query_var('year')) .'">'. get_query_var('year') .'年</a></li>';
$str.='<li>'. get_query_var('monthnum'). '月</li>';
} else {
$str.='<li>'. get_query_var('year') .'年</li>';
}
} elseif(is_search()) {
$str.='<li>「'. get_search_query() .'」で検索した結果</li>';
} elseif(is_author()){
$str .='<li>投稿者 : '. get_the_author_meta('display_name', get_query_var('author')).'</li>';
} elseif(is_tag()){
$str.='<li>タグ : '. single_tag_title( '' , false ). '</li>';
} elseif(is_attachment()){
$str.= '<li>'. $post -> post_title .'</li>';
} elseif(is_404()){
$str.='<li>ページがみつかりません。</li>';
} else{
$str.='<li>'. wp_title('', true) .'</li>';
}
$str.='</ul>';
$str.='</div>';
}
echo $str;
}
プラグインを使わずにパンくずナビを設置する方法です。上記コードをfunctions.phpに記述した後にパンくずを表示したい場所に書きコードを記述するだけです。
<?php breadcrumb(); ?>
元ネタ「プラグイン不要！ WordPressでfunctions.phpにコードを追加するだけで使えるパンくずリスト | 9ineBB」
9ineBBさんの記事を参考にしました。ただ > がテキストとして表示されるようになっていたので、CSSを使って矢印を表示させるようにした方がいいかと思い、> 部分のコードは削除させて頂きました。
ちなみに、CSSのサンプルものせるとしたら下記がシンプルな状態だと思います。あとは自分好みにカスタマイズしてください。
/* パンくず
------------------------------------------------------------*/
.breadcrumb{
font-size: 10px;
margin: 15px auto 0;
}
.breadcrumb li{
float: left;
margin-right: 7px;
}
.breadcrumb li:after{
content: '>';
margin-left: 7px;
}
.breadcrumb li:last-child:after{
content: none;
}
管理者以外にWordPressのアップデート通知を非表示にする
if (!current_user_can('edit_users')) {
function wphidenag() {
remove_action( 'admin_notices', 'update_nag');
}
add_action('admin_menu','wphidenag');
}
クライアント様のサイトの場合、アップデート通知がでるとサイトに不具合が起きたのかとクライアント様を不安にさせてしまう場合もあるかと思います。
上記コードをfunctions.phpに記述しておけばWordPressのアップデート通知を非表示にすることができます。
ただし、WordPressはなるべく最新版に保ったほうがいいと言われているので、通知がこないにしても定期的にアップデートしてあげたほうがいいかと思います。
固定ページでビジュアルエディタを使えないようにする
//固定ページではビジュアルエディタを利用できないようにする
function disable_visual_editor_in_page(){
global $typenow;
if( $typenow == 'page' ){
add_filter('user_can_richedit', 'disable_visual_editor_filter');
}
}
function disable_visual_editor_filter(){
return false;
}
add_action( 'load-post.php', 'disable_visual_editor_in_page' );
add_action( 'load-post-new.php', 'disable_visual_editor_in_page' );
ビジュアルエディタとテキストを切り替えると、せっかく書いたソースコードが崩れてしまうことがあります。特に複数人でサイトを管理している場合などにあまり詳しくない人がビジュアルエディタで編集しようとして崩してしまった…というリスクを回避できます。
元ネタ「WordPressの固定ページのみビジュアルエディタを使用できないようにする方法！」
ユーザー情報を消したり増やしたりする
消す。
function hide_profile_fields( $contactmethods ) {
unset($contactmethods['aim']);
unset($contactmethods['jabber']);
unset($contactmethods['yim']);
return $contactmethods;
}
add_filter('user_contactmethods','hide_profile_fields');
AIM、Yahoo IM、Jabber / Google Talなんかは管理画面のユーザープロフィールにデフォルトで入っているのですが、日本人で使っている人なんてほとんどいませんよね。不要な項目は上記コードで消すことができます。
増やす。
function my_new_contactmethods( $contactmethods ) {
//Twitter
$contactmethods['twitter'] = 'Twitter';
//Facebook
$contactmethods['facebook'] = 'Facebook';
//Google+
$contactmethods['googleplus'] = 'Google+';
return $contactmethods;
}
add_filter('user_contactmethods','my_new_contactmethods',10,1);
今度は逆によく使いそうなものを追加します。TwitterとFacebookとGoogle+を追加してみました。複数人でサイトを管理していて、記事下にプロフィール欄を表示させる時なんかにSNSへのリンクを表示させたりすることができます。
またこれらをテーマ側で呼び出すには下記コードを使います。
<?php the_author_meta( 'twitter' ); ?> <?php the_author_meta( 'facebook' ); ?> <?php the_author_meta( 'googleplus' ); ?>
元ネタ「WordPress のよくあるカスタマイズコード functions.php 多め」
moreタグの位置に広告など任意のコードを配置する
// MOREタグの下に広告を表示
add_filter('the_content', 'adMoreReplace');
function adMoreReplace($contentData) {
$adTags = <<< EOF
<!--▼ここから▼-->
<!--ここに表示したいコードを書く-->
<!--Adsense広告なんかを貼るのが主流みたいです。-->
<!--▲ここまで▲-->
EOF;
$contentData = preg_replace('/<span id="more-[0-9]+"><\/span>/', $adTags, $contentData);
$contentData = str_replace('<p></p>', '', $contentData);
$contentData = str_replace('<p><br />', '<p>', $contentData);
return $contentData;
}
moreタグの下に広告などの任意のコードを貼り付ける方法です。
上記コードのコメントアウト欄にHTMLコードを書いてあげれば表示されるようになります。
※2015/04/19追記
AdsenseコードをスマホとPCで出し分ける方法も書いています。
is_mobileを操作する（タブレットをモバイルとして扱わないようにするなど）
function is_mobile(){
$useragents = array(
'iPhone', // iPhone
'iPod', // iPod touch
'Android.*Mobile', // 1.5+ Android *** Only mobile
'Windows.*Phone', // *** Windows Phone
'dream', // Pre 1.5 Android
'CUPCAKE', // 1.5+ Android
'blackberry9500', // Storm
'blackberry9530', // Storm
'blackberry9520', // Storm v2
'blackberry9550', // Storm v2
'blackberry9800', // Torch
'webOS', // Palm Pre Experimental
'incognito', // Other iPhone browser
'webmate' // Other iPhone browser
);
$pattern = '/'.implode('|', $useragents).'/i';
return preg_match($pattern, $_SERVER['HTTP_USER_AGENT']);
}
WordPressにはデフォルトでモバイル（タブレット含む）かどうかを判別するタグのwp_is_mobileがありますが、スマホだけでいい。というケースがほとんどです。そんな時は上記のコードをfunctions.phpに書き加えることで、スマホのみの条件分岐を作成することが可能です。その場合はデフォルトのwp_is_mobileではなく、今回独自に作ったis_mobileという関数を使用します。
使用例
<?php if(is_mobile()) { ?>
//スマートフォンで表示したいもの
<?php } else { ?>
//PC・タブレットで表示したいもの
<?php } ?>
元ネタ「WordPress: 実用度高し。is_mobileでスマートフォンだけ条件分岐する方法 | Web Design Workbook」
YouTube動画埋め込みの際にデフォルトサイズを指定する
function custom_embed_size() {
return array( 'width' => 630, 'height' => 354 );
}
add_filter( 'embed_defaults', 'custom_embed_size' );
630（横幅）354（縦幅）を変更してあげればサイトの幅ピッタリにすることができます。
functions.phpに別のプログラムファイルをインクルードする（読み込む）
functions.php内に別のphpファイルを読み込む（インクルード）方法です。
これまでにfunctions.php内にコードを書きすぎて乱雑になってしまい管理しきれなくなった場合に使えます。
テーマ内に「functions_custom.php」をつくったとした場合、下記コードをfunctions.php内に書き込めば別ファイルとして読み込むことができます。
include( get_template_directory().'/functions_custom.php' );
ジャンルごとに別ファイルにして管理すれば、ファイル内もスッキリしていいかもしれません。また、テーマのアップデートがあった時なんかもファイルを別で管理できるので、カスタマイズコードがどれかわかりやすくていいです。
まとめ
今回は自分がよく使っているfunctions.php内に追加してできるカスタマイズコードをご紹介しました。どれもサイトカスタマイズではよく使う内容なのでメモしておきたいですね。
ではこの辺で。
