WordPressのfunctions.phpに書いておくといいかもしれないコードいろいろ

Posted under - WordPress

50

WordPress の便利なオプションファイル functions.php。 これに数行追加するだけで、本当にいろんなことができちゃいます。今回は、functions.php に書いておくといいかもしれないコードをいくつかまとめてみました。

WordPress Functions.php

WordPress のテーマの中で利用する functions.php。このファイルがかなり便利で、私はいろいろと functions.php に書き込んでいます。よくプラグインとかウィジットを使えばいいじゃないかーとも言われたりしますが、プラグインは厳選して重要なものだけを使って functions.php でできるものは、できるだけそうしたいなーと思っています。

プラグインが増えればその分ファイルの読み込みが多くなって、少なからず速度も落ちるかな … とか、プラグインの管理ページがごちゃごちゃするのがイヤだーとか、そんな程度の理由なんですけど …。functions.php 自体が、関数を置いておけるプラグインのようなものなので、これで済むものは済ましちゃおうという感じです。

また、仕事で WordPress を使って Web サイトを作る事が多いので、その度にプラグインをインストールするより、functions.php に書いておけば使い回しがきく … という横着な理由もあります。

1. 続きを読む、<!– more –> のハッシュを消す

「続きを読む」リンク

続きを読むをクリックすると、URL の末尾に #more … がついてしまう …

WordPress の <!-- more -->、「続きを読む」のリンク。これをクリックすると、URL に #more … といった感じで、ハッシュがついて、記事の続き部分に移動します。これが嫌だなーと思ってる人は functions.php に以下を追加してみてください。URL の #more 以下がキレイになくなります。

functions.php

/* more-linkのハッシュ消し */
function remove_more_jump_link($link) {
  $offset = strpos($link, '#more-');
  if ($offset) {
    $end = strpos($link, '"',$offset);
  }
  if ($end) {
    $link = substr_replace($link, '', $offset, $end-$offset);
  }
  return $link;
}
add_filter('the_content_more_link', 'remove_more_jump_link');

2. the_excerpt() の […] を消す

いらない文字列 [...]

抜粋の最後に、[…]って入るのを、消してしまったり他の文字にしたい …

記事の全文ではなくて、記事を抜粋表示してくれるテンプレートタグ、the_excerpt()。私もよく使ってますが、抜粋表示の最後に […] という余計なものが…。これを消したり、文字を変えたい人は、functions.php に以下を追加してみてください。

functions.php

/* the_excerpt() [...]を消す */
function new_excerpt_more($more) {
	return '';
}
add_filter('excerpt_more', 'new_excerpt_more');

return ‘文字列’ とすれば、好きな文字列に変更できます。今回は空にして、[…] を消しています。

3. <head>内のWordPressのバージョンを消す

WordPress で Webサイトを作ると、<head> 内に以下のような meta タグが表示されます。

  • 1. <meta name="generator" content="WordPress 2.8.4" />

WordPress のバージョンによっては、セキュリティー的に脆弱性があり、それを狙った悪い人達がいるみたいです。できるかぎり WordPress のバージョンは隠した方がいいようなので、functions.php に以下を追加して表示しないようにしています。

functions.php

remove_action('wp_head','wp_generator');

4. スクリプトの読み込みを一元管理する

スクリプトの読み込みも、header.php に書かずに、functions.php に書く事ができます。header.php が複数ある場合などにも、functions.php で一元管理できた方が楽ですよね。

functions.php

if(!is_admin()){
  function register_script(){
    wp_register_script('example1', get_bloginfo('template_directory').'/js/example1.js');
    wp_register_script('example2', get_bloginfo('template_directory').'/js/example2.js');
  }
  function add_script(){
    register_script();
    wp_enqueue_script('example1');
    if(is_single()){
      wp_enqueue_script('example2');
    }
  }
  add_action('wp_print_scripts','add_script',10);
}

wp_register_script で、スクリプトを読み込んでおき、wp_enqueue_script で、最終的に head 内に書き出します。上記の例では、 example1.js と example2.js を読み込んでますが、example2.js はシングルページの時だけ … という条件分岐もつけてます。

5. ショートコードを作っておく

WordPress の便利な機能のひとつ、ショートコード。ショートコードを設定しておけば、投稿画面でいちいちコードなどをを書かなくてもよくなるので、とっても効率的。

例えば下のように Google アドセンスをショートコード化しておけば、記事中の好きなところに Google アドセンスを表示できたりします。

functions.php

function showads() {
    return '<script type="text/javascript"><!--
google_ad_client = "pub-5602106076644560";
google_ad_slot = "3698987933";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>';
}

add_shortcode('adsense', 'showads');

アドセンスのコードは差し替えてくださいね。投稿画面で、[ adsense ](半角スペースは削除してください。)と記述すれば、そこに Google アドセンスが表示されます。

自分がよく使うものは、ショートコード化しておくと便利ですね!ショートコードの作り方は、過去記事を参照してください ;D

6. ショートコードをテーマの中で使う

私は上の Google アドセンスのショートコードを、投稿画面ではなくて、テーマファイル内で使っています。ショートコード化しておけば、何か変更があっても functions.php を修正すればいいだけですし、index.php や single.php、その他のテンプレートファイルを修正しなくても済みます。

テーマ内でショートコードを使うには、以下のように記述すればOKです。

<?php echo do_shortcode('[adsense]'); ?>

7. Google Analytics

テーマをいじらずに Google Analytics のコードを WordPress に埋め込みます。以下のコードは wp_footer に入れてますが、wp_head に入れる場合は、add_action('wp_head', 'ga'); と書き換えてくださいね。

functions.php

<?php
add_action('wp_footer', 'ga');

function ga() { ?>
<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-16252020-3']);
  _gaq.push(['_trackPageview']);
  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
<?php } ?>

Google Analytics のコードはあなたのコードに書き換えてくださいね!

8. テーマでアイキャッチ画像を使えるようにする

記事に対して、ひとつだけ好きな画像を設定できるアイキャッチ画像機能 …

記事ごとに画像を設定できる、WordPress のアイキャッチ機能。これを知る前は、カスタムフィールドを使って画像を設定してました…。Webクリエイターボックスの Mana さんに教えてもらったんですけど、以下を functions.php に書き込むと、アイキャッチ画像を使えるようになります!

functions.php

/* アイキャッチ画像 */
add_theme_support( 'post-thumbnails' );

テーマ内でアイキャッチ画像を表示するには、

<?php the_post_thumbnail(); ?>

とたった一行追加するだけです!

9. 追記:アイキャッチ画像のサイズを一定にしたい

コメントで質問をいただいたので、少しアイキャッチ画像について追記してみました。

アイキャッチ画像は the_post_thumbnail(); で簡単にテーマ内で読み込めますが、アップロードしたサイズがそのまま表示されてしまいます。なので、サイズを指定したいなーという時にはパラメータでサイズを指定する事もできます。

9.1. ピクセルで指定する

<?php the_post_thumbnail(array(150,150)); ?>

こうすると長辺(縦か横かどっちか長い方)を、150px にして表示してくれます。なので縦横比は、元画像のものが継承されます。

9.2. 設定→メディアの設定で指定したサイズで表示する

ダッシュボードの 設定→メディアの設定 で、投稿画面で使う画像のサイズを設定できますよね。サムネイルとか、中サイズ、大サイズとかいうアレです。あのサイズをそのまま使いたい場合は、以下のように記述します。

<?php
/* サムネイル */
the_post_thumbnail('thumbnail');
/* 中サイズ */
the_post_thumbnail('medium');
/* 大サイズ */
the_post_thumbnail('large');
?>

9.3. 好きなサイズを追加する

上記では、予め 設定→メディアの設定 で指定したサイズで表示する場合でした。でも画像のサイズは、サムネイル / 中サイズ / 大サイズ の他に、自分で好きなサイズを作成することができるんです!やりかたは簡単。まずは functions.php に以下を追加してください。

functions.php
add_image_size( 'my_thumbnail', 200, 200, true );

パラメータは、$name, $width, $height, $crop_flag の順になってます。$name には、自分の好きな名前をつけます。この名前は、アイキャッチを表示するときに、テーマの中のコードで使います。

$width$height には、画像のサイズをピクセルで指定します。最後の $crop_flag は、指定したサイズに画像を切り抜くかどうかを、true または false で指定します。

上記の例では true を指定しています。この場合は、長方形の画像をアップロードしても、200 x 200 ピクセルの正方形に切り抜いて画像を生成してくれます(縮小して正方形になるように切り抜くので、横長の画像は両端が切り取られます)。

また、false の場合は、元画像の縦横比を維持しながら、長辺を 200 ピクセルにした画像を生成してくれます。

テーマの中で表示するときには、以下のように $name でつけた名前を指定して記述します。

<?php the_post_thumbnail('my_thumbnail'); ?>

10. デフォルトアバターミステリーマンの変更

これはかなり個人的な好みになりますが、WordPress のデフォルトのアバター、ミステリーマンがあんまりかわいくないので、画像を変更するためのコードです。別途、オリジナルのゲストアバターをアップロードしておいてください。

funstions.php

add_filter( 'avatar_defaults', 'newgravatar' );
function newgravatar ($avatar_defaults) {
    $myavatar = get_bloginfo('template_directory') . '/images/guest.jpg';
    $avatar_defaults[$myavatar] = "Guests";
    return $avatar_defaults;
}

詳しい使い方は、過去記事に書いたことがあるので参照してみてください ;D

11. ビジュアルリッチエディターにボタンを追加

自分ではビジュアルリッチエディターは使ってないのですが、クライアントさん向けに、ビジュアルリッチエディターにいくつかボタンを追加します。

funstions.php

function ilc_mce_buttons($buttons){
  array_push($buttons, "backcolor", "copy", "cut", "paste", "fontsizeselect", "cleanup");
  return $buttons;
}
add_filter("mce_buttons", "ilc_mce_buttons");

追加してるボタンは、背景色コピー切り取り貼り付け文字の大きさコード整形です。詳しくは、過去記事を読んでみてくださいね!


他にもこんなの便利だよーというのがあったら、ぜひ教えてくださいね!

Comments

Thank you for the comment.