Simplicity201401002から、サイトロゴを画像に変更する機能をつけました。
従来までは、以下のような方法でファイルをカスタマイズする必要がありましたが、これからはWordpress管理画面から行えるようになりました。
photo by nosha
サイトロゴを画像に変更する方法
サイトロゴを画像に変更するには、まずWordpress管理画面から「外観→カスタマイズ→ヘッダー画像」に移動してください。
以下が、サイトロゴを画像に変更する設定項目となります。
- ロゴを画像にする
- ロゴ画像URLで指定
サイトロゴを画像に変更するには、以下の2つの方法があります。
- テーマ内の画像を差し替える方法
- 画像のURLを指定する方法
それぞれについて詳しく説明します。
テーマ内の画像を差し替える方法
テーマ内の画像差し替えて、ロゴ変更するにはまず、「外観→カスタマイズ→ヘッダー画像」に移動してください。
そして、「ロゴを画像にする」にチェックを入れてください。
このようにして「保存して公開」ボタンを押すと、サイトロゴ画像が以下のようになります。
デザインセンスのかけらもないロゴですが、あくまで差し替え画像用のロゴなのでご了承ください。
これを変更します。画像の場所は、テーマフォルダ内の「images/logo.png」です。
子テーマを使用している場合は、子テーマフォルダ内に「images/logo.png」を追加するか差し替えるかしてください。
画像を、透過PNGなどにすると以下のように表示されます。
画像のURLを指定する方法
JPEGを使用したい場合など、好きな画像使用するには以下の方法です。
テーマ内の画像差し替えて、ロゴ変更するにはまず、「外観→カスタマイズ→ヘッダー画像」に移動してください。
そして、「ロゴを画像にする」にチェックを入れてください。
ここまでは一緒です。
あとは、Wordpress管理画面から「メディア→新規追加」からロゴファイルをアップロードしてください。
アップロードが完了したら、「編集」リンクをクリックしてください。
すると以下のような画面が表示されるので、「ファイルのURL」のテキストを選択してコピーしてください。
ここでまた「外観→カスタマイズ→ヘッダー画像」に移動してください。
先程コピーしたURLテキストを「ロゴ画像をURLで指定」にペーストしてください。
入力したら、「保存して公開」ボタンを押せば設定完了です。
URLを指定すれば、自由にロゴを変更できます。
注意点
以上のようなヘッダー画像の機能追加により、テーマファイルを変更せずとも、サイトロゴを画像に変更できるようになりました。
ただ、1点注意点があります。
カスタマイザーからのサイトロゴ画像変更は、画像の大きさまでは指定できません。
ロゴを設定する前に、画像の大きさを最適化するか、もしくはCSSで画像の幅と高さを指定してください。CSSなら、パソコン表示と、モバイル表示の画像の大きさを変更することもできます。
あと、位置が気に入らない場合もCSSで自前で調節する必要があります。
まとめ
今回の機能追加でサイトロゴ画像が変更できるようになりましたが、従来通り、ヘッダーの背景画像も変更することもできます。
今回の機能追加で、工夫次第で、より手の込んだヘッダーを、以前よりは簡単に作成できるようになりました。
ヘッダーは、サイトの顔となる部分です。ヘッダーのデザインが変わるだけで、訪問者の印象も大きく変わります。
「従来のヘッダーが何だか寂しい」と感じる場合は、是非ヘッダーカスタマイズに挑戦してみてください。
