WordPressの無料テーマのLightningでホームページを作ってます。
ヘッダーロゴ（サイトタイトル）を作ったのですが、縮小されて表示が小さすぎます。
もう少し大きく表示させたいのですが、大きくできるのでしょうか？
- 大きくする（横幅を大きく）限界はあるようですが、ある程度でしたら可能です。
目次
サイトタイトル（ロゴ）を初期設定の表示サイズより大きく表示する方法
例として、横幅360px、縦60pxの画像を作成した場合で説明していきます。
※画像を大きくしても初期設定の表示サイズは小さいままです。
STEP
横幅360px、縦60pxの画像を作成
STEP
外観⇒カスタマイズ⇒Lightningデザイン設定⇒ヘッダーロゴ画像で、作成した画像をアップロード
STEP
カスタマイズ内の「追加CSS」をクリック
STEP
下のコードをコピーペーストして「公開」ボタンをクリック
/ヘッダーロゴ表示/
.siteHeader_logo img{
width: 360px;
height: 60px;
max-height: 60px;
}
@media (min-width: 401px) {
.siteHeader_logo img{
width: 360px;
height: 60px;
max-height: 60px;
}
}
@media (max-width: 400px) {
.siteHeader_logo img{
width: 100%;
height: auto;
max-height: 40px;
}
}
STEP
各デバイスで表示サイズを確認して見てください。
上のCSSは、2025年2月の段階でテーマのアップデート後に設定してOKだったCSSですが、Lightningのバージョン違い等で出来ない場合もあります。
ひとまず、試してみてください。
※大きく表示が成功したサイトはこちらです。
ご質問などありましたら気軽にお問い合わせください。
Facebookでご縁をいただいている方は、メッセンジャーでもOKです。
