WordPressとテーマ”Astra”を使ったサイト構築のメモ。
ヘッダにロゴを設定し、サイトタイトルやキャッチフレーズと組み合わせて表示する。
使用サーバー：ロリポップ
使用テーマ：Astra
ヘッダにサイトロゴを登録する
Astraのヘッダ設定内で、ロゴ画像を登録する。
Astra設定＞Header Builder＞ロゴと進み、Generalタブでロゴを指定。
参考
Header Builderの本体部分の設定が下に表示されているが、ここでは使用しない。
Header Buliderからロゴ画像を指定
［ロゴを選択］をクリックして、ロゴ画像ファイルをアップロード。
［ロゴを選択］をクリック
ライブラリからロゴ用画像を選択。
アップロードしたロゴ画像を選択
画像のプレビューで切り抜きが可能だが、ここでは［切り抜きしない］。
ロゴ画像の切り抜きはしない
指定したロゴがヘッダ内の、サイトタイトルの前（左側）に表示される。
サイトタイトルの前にロゴが表示される
ロゴ画像のサイズを調整
「ロゴ幅」のスライダーを調整することで画像の横幅を調節できる。
横幅の変化に応じて縦幅は自動的に調節される。
ロゴの横幅を調整する。
Retinaディスプレイ用のロゴを登録
Apple製品で使われているRetinaディスプレイは、従来のディスプレイの約2倍の解像度をもっているため、専用のロゴ画像を用意しておけばより高精細な表示ができる。
「レティーナ端末で別のロゴを使用しますか？」にチェックを入れると、Retina用の画像を別に指定できる。
画像は通常のロゴに対して2倍の画素数で作成しておく。
通常のロゴと同じサイズで表示されるため、ロゴ幅の指定は共通。
Retinaディスプレイ向けのロゴ画像
サイトタイトルをロゴの下に移動する
デフォルト設定では、サイトタイトルとロゴ画像は横並びに配置される。
「インラインロゴ＆サイトタイトル」のチェックを外すと、ロゴ画像の下にサイトタイトルが移動する。
サイトタイトルをロゴの下に表示。
サイトタイトルを表示しない
サイトタイトルの文字はチェックボックスをオフにすることで、非表示にできる。
サイトタイトルを非表示にする。
キャッチフレーズを表示する
サイトタイトルのほかに、キャッチフレーズを表示させることもできる。
「サイトキャッチコピーを表示する」のチェックボックスをオン。
キャッチフレーズは、WordPressの一般設定に入力したものが自動的に表示されている。
キャッチフレーズを表示させる
ファビコンの登録
ファビコン（Favicon：ブラウザのタブ上に表示される小さいアイコン）の指定もHeader Builder内で行う。
ファビコンは512×512ピクセル以上で作成しておく（WordPressの推奨値）。
ファビコンを登録する