WordPressテンプレートのカスタマイズ(1)

WordPressをサーバにインストールし、アドレスに最初にアクセスした時に見るのは、白のバックグラウンドに青のヘッダーというデフォルトのテンプレートです。(* ちなみに、ワードプレスの本サイトではテンプレートという呼び方ではなく、テーマ[Theme]と表記されます。) このデフォルトのデザインをそのまま使いたい人はあまりいないと思いますが、一方で、自分だけのデザインにカスタマイズするのは「難しくて手間もかかりそう」と思われる方もおられるかもしれません。(左イメージは当サイトをデフォルトデザインで表示したものです。)

実際には、ワードプレスをカスタマイズするのは、コツを知ってしまえば難しいものではありません。特に、このエントリーでご紹介するページトップのイメージの入れ替えは、HTMLやCSSの知識がなくても簡単にできるため、どなたにもお薦めできます。

ここでは、テンプレートを1から作成してWordPressのサイトに投稿するというような上級者向けではなく、初・中級者がテンプレートに少し手を加えてオリジナルなサイトを作るという点をメインにしています。「WordPressのテンプレートのダウンロード」という記事では、無料テンプレートがダウンロードできるお薦めのサイトを紹介しています。また、テンプレートの選び方についても触れていますのでご覧ください。

ページトップのイメージの取替え

1) お気に入りのテンプレートを探します。(イメージはどうせ置き換えてしまうので) ページトップのイメージ・デザインにとらわれることなく、全体の構成、サイドバーの位置・数などに注目すると比較的簡単に候補を絞れると思います。なお、WordPressではテンプレートの交換が簡単にできるので、1つに絞る必要はありません。

2) テンプレート (たいていはZIPファイル) をダウンロードしたら、サーバのWordPressの所定の位置にファイルをアップ・解凍(展開) します。たとえば、「/public_html/wp-content/themes」というような場所です。アップが完了したら、ワードプレスの管理画面からテンプレート(Theme)を新しいものに変更しておきます。同時に、自分のコンピュータにテンプレートのZIPファイルを解凍*することをお薦めします。(*解凍ソフトにはLhasaのようなものがあり、他にも無料のものが多数あります。)

3) 自分のコンピューターに解凍したファイルを覗いてみて、ページトップのイメージを探しましょう。多くのテンプレートは「img」「images」というようなフォルダにイメージを収納しているので簡単に見つかるでしょう。イメージが見つかったら、「950×150ピクセル」のようなサイズを確認します。また、このイメージの名前も確認しておきましょう。

4) オリジナルのイメージを用意します。イメージのサイズを変更するのは、テンプレートのつくりによっては若干手間がかかることがあるので、ここでは同サイズのイメージに置き換えるという方法をとります。PhotoshopやFireworksといったグラフィックソフトがあればベストですが、他にも画像の編集ができる無料のソフトもありますのでこうしたものを使うのも手です。やり方が全くわからない場合は、デジカメの写真などを「950×150ピクセルのサイズに切り取って」というように誰かに頼めば簡単にやってくれるでしょう。

5) 作成したイメージをサーバのFTPアップローダでアップします。例えば、「/public_html/wp-content/themes/[テンプレートの名前]/[画像フォルダの名前]」というような位置にアップします。既存のトップイメージに上書きをするので、作成したオリジナルのものの名前が、2)で確認したイメージの名前と同じである必要があります。「バイナリ」モードでアップし、「ファイルを上書きしますか」と聞かれるので「はい」と答えると完了です。(左イメージはBluehostのFTPアップローダー。)

6) サイトのアドレスにアクセスしてみましょう。トップのイメージが古いままの場合、ブラウザのリロードを押せば新しいイメージが現れるはずです。

イメージのサイズを変えずにそれをオリジナルのものに置き換えてしまうという方法は、簡単で失敗の可能性もありません。しかも、ページ全体の印象もがらっと変えることができるのでお薦めです。これを応用すれば、ページトップのイメージだけではなく、バックグラウンド全体の画像も置き換えられます。要は、お使いのテンプレートが使用しているイメージはすべて置き換えが可能です。HTMLやCSSの知識なしでOKなので、気軽にイメージ入れ替えによるカスタマイズをしてみましょう。