WordPressはものすごい数のテンプレート（テーマ）が無料で利用できます。SEO対策が施された有料のものまで含めると、その選択肢は相当なものです。しかし、どのテーマを選んでも、自分色にアレンジしたいところが出てきます。ここでは、自分が今までカスタマイズしてきたときに得た知識をまとめています。
基本を知っていれば技術的なトラブルが発生した時に原因を見つける手掛かりになりますので参考にしてみてください。
子テーマって何？
アレンジした部分のみのテーマファイル
さて、子テーマについてですが、知らない人にとっては「なんじゃそれ？」という話ですよね。WordPressはテーマを選べばそれでデザインが決まるのに、何が起きるのかと思いますね。結論からいうと、子テーマはアレンジしたファイルのみを保存したテーマという感じのものです。親テーマを読み込んだ後に子テーマで上書きや追加をするという流れです。だから、親テーマをバージョンアップしても、子テーマは残っていますので、ほとんどの場合何もしなくても大丈夫です。
「ほとんど」って何さ？
ここでまた微妙な言い回しをしてしまいました。「ほとんど」ということは、「全部」ではないということですよね。そうなんです、カスタマイズの内容によっては、部分的に親テーマを直接いじっておいたほうが楽な部分があるのです。私の場合、見出しタグのCSSは、オリジナルのデザインを使いたいので親テーマの方を削除しています。残しておくと、背景に色がついてしまったり、余白サイズが変わったりとちょっとだけイメージと違う感じになってしまいます。そこまでたくさんカスタマイズしなくても大丈夫なので、親テーマをバージョンアップした時にはそこを忘れないようにすると問題なく移行できます。
▶ スポンサードリンク
カスタマイズをする前に
必ずバックアップをとる
いろいろカスタマイズを楽しむ前に、大切なことを２つ書きます。ひとつは、バックアップを取ることです。編集したいファイルをダウンロードして、別名で保存しておきましょう。いつでも戻せば元通りにできます。これをやらないと本当に困った事態になった時にどうすることもできなくなります。
ソースの編集に「メモ帳」は使わない
WordPressのphpをメモ帳で書き換えるとサイト上部に１行分くらいの空白ができたりサイトが左に寄ったりする。
WordPress初心者の頃、phpファイルを管理画面のテーマの編集で行うと何も問題はおこらないのですが、メモ帳で編集してFTPでアップロードすると不具合が発生するという現象に遭遇しました。主な症状としては、サイトの上部に空白ができたり、Interne Explorerで見るとサイト全体が左に寄ったりするというものです。それが、たった１文字編集しただけでも発生する現象で、その１文字戻してももとに戻らないのです。header.phpを直接貼り付けて元に戻ったこともありましたが、最終的にはどうにもならなくなりました。その原因はなんと編集ソフトにメモ帳を使っていたことにありました。
原因：見えないBOM情報が付加される
wordpressで編集してOKで、メモ帳だとだめ・・・
これで検索してたどり着いた答えは…なんとメモ帳のダメ出し
windowsメモ帳で処理をしていると
ファイル保存時にutf-8のBOM(ByteOrderMark)有で保存している為自動で目に見えない情報が付加されてしまう。
こんなこと知りませんでした。だから対応策はメモ帳を使わなければよい。
では、何を使うのか。私はこれ以降はTeraPadを使っています。一時さくらエディタを使ったこともありますがどちらでもいいと思います。実際にインストールして試してみたらうまくいきました。phpファイルを書き換えてもレイアウト崩れや余計なスペースの発生は見られません。さらに、行番号がついていたり構文が色分けされていたりして見やすいのです。これでもうメモ帳はさようなら。
何を？どう？カスタマイズ
さて、何をどうカスタマイズすればよいかという話ですが、表記や色、機能などやりたいことに合わせて何でもカスタマイズできます。
機能面でカスタマイズするファイルは、トップページはindex.php、記事のページはshingle.php、過去記事一覧はarchive.phpなどです。デザインに関するものはCSSを調整します。最近のものは機能が充実した分少しわかりにくくなってしまい、探さなければいけませんが、基本的な考え方は同じです。
なお、SEOテンプレート【賢威】 
を使えば充実したサポートフォーラムがあるので、やりたいことは大体できると思います。こんなことまで質問するのかというくらい、いろいろな質問がされていて、さらにそれに対して技術者の皆さんが丁寧にお答えしてくれています。
投稿ページのphpファイルの場合
例：descriptionをサイト内に表示させる
- <div>
- <h2><a href=”<?php the_permalink() ?>←投稿のアドレス” rel=”bookmark” title=”<?php the_title(); ?>”><?php the_title(); ?>←投稿のタイトル</a></h2>←<h2>はタイトルの部分です
- <div><?php the_excerpt(); ?></div>
- <div>
- <?php the_content(‘Read more »’); ?>←よくわかりませんが、消すとエラー
- </div>
- <p><strong>Posted:</strong> <?php the_time(‘F jS, Y’) ?>←投稿日時under <?php the_category(‘, ‘) ?>←投稿カテゴリ.<br />
- <a href=”<?php comments_link(); ?>←コメントのＵＲＬ“><strong>Comments:</strong> <?php comments_number(‘none‘,’1‘,’%’); ?>←コメントの数</a>
- <?php edit_post_link(‘Edit this post‘,’ | ‘,”); ?>←コメントを編集するか Edit this postは「編集」などわかる言葉に書き換えてもいい</p>
- </div>
- <?php endwhile; ?>←消すとエラー
- <div>
- <p><span><?php next_posts_link(‘« Previous entries‘) ?>←前の記事</span>
- <span><?php previous_posts_link(‘Next entries »’) ?>←次の記事</span></p>
- </div>
- <?php else : ?>←消すとエラー
有料のテンプレート「賢威」のソースを出すわけにはいかないので、過去に使っていたものを例に記事を書いています。あの、赤字の部分が追加された部分でこのページのタイトル下のように、抜粋を表示する命令です。post-disは枠や文字サイズなどを指定するCSSを呼び出す命令です。
▶ スポンサードリンク
cssファイルの場合
各テンプレートの機能面が充実してきたので、PHPファイルを自分でカスタマイズすることは減りました。でも、CSS（スタイルシート）は自分好みに加除修正したいところです。サイトの幅、字の大きさ、色、背景、リンクの効果などデザインに関する部分を変えたいときはcssファイルを編集します。style.cssやbase.cssに保存されています。
ブラウザがchromeの場合、右クリックで「検証」とするとソースやスタイルシートがまる分かりになります。しかも、ページ上で数値等を変えて試すこともできます。記述の際には順番が大事だったりするので、この辺りの機能については、別のページで詳しく紹介します。