Key#1: アイキャッチ画像を設置する

メインテーマは、アイキャッチ画像(サムネイル、サムネ)の設置です。アイキャッチ画像とは、それぞれの記事を代表する画像で、サイト読者の目を引きつける画像のことです。私が愛用している癒しサイト「東京R不動産」にも、トップページや検索結果一覧表示にアイキャッチ画像が使われています。

 

Key#2: 変数のスコープを理解する

今回はさらに、WordPressテーマ開発で必要なPHPの基礎知識の1つである変数のスコープについて紹介します。この概念を理解した上で、アイキャッチ画像のカスタマイズをしています。

 

 

テーマファイルのダウンロードリンク

編集前後のテーマは下記リンクからダウンロードできます。必要に応じて参照してください。

  • 編集前のテーマ:ここ
  • 編集後のテーマ:ここ

 

本編:ゼロからつくるWordPressテーマ第8回


 

 

あとがき

アイキャッチ画像が無いときに表示する代替画像の画像サイズを指定するために、今回はPHP変数を使って、アイキャッチ画像とのサイズ統一を図りました。本来、画像サイズが不変であれば、PHP変数を使わずにcontent-excerpt.phpにベタ書きしても動作には問題ないです。しかしながら、自分で一生懸命作ったサイトも長い期間経つと忘れてしまうものです。なるべくクリティカルな数字はコードの中に書き込まずに、決めた場所にまとめて書いた方が可読性Upにつながって良いと思います。

一方で逆の意見ですが、ローカルスコープからグローバル変数にアクセスするglobalは便利ですが、多用は良くないです。なぜなら、変数のスコープ、つまりある変数にアクセス出来る範囲は、できるだけ狭い方がいいと言われています。スコープが広いと、変数が予期せぬところで変更されたりするなどのバグを生む可能性が高くなるからです。globalを使う場合は、その変数へのアクセスのルールを明確にして、守るほうが大切だと思います。

Advancedな関連トピックスとして、「名前空間」があります。いつかこの連載でも取り上げたいと思いますが、興味がある方は調べてみてください。

「WordPressテーマ講座:旧版」の記事