• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

FOXWP

WordPressの始め方と使い方をわかりやすく解説!

  • HOME
  • WordPressブログの始め方
  • お問い合わせ
FOXWP / WordPress / Stork(ストーク)でロゴ画像のサイズを大きくする方法

Stork(ストーク)でロゴ画像のサイズを大きくする方法

最終更新日:2021年10月5日

この記事では、Stork(ストーク)でロゴ画像のサイズを大きくする方法を紹介します。

ストークはデフォルトのままだと、ロゴ画像のサイズを大きくしても一定の高さで表示されるようになっています。紹介する方法では、このロゴ画像を表示する高さを変更し、ロゴ画像を大きく表示します。

デフォルトのロゴ画像サイズ

デフォルトのロゴ画像サイズ

ロゴ画像サイズを大きくした場合

ロゴ画像サイズを大きくした場合

注意
この記事で対象としているのは、ロゴ画像を中央寄せしている時のサイズになります。事前に、ロゴ画像を中央寄せにしておいてください。

Stork(ストーク)でロゴ画像を中央寄せにする方法

目次 非表示
1 ロゴ画像のサイズを決めているCSSを確認する
2 ロゴ画像のサイズを大きくする

ロゴ画像のサイズを決めているCSSを確認する

まずロゴ画像の高さを決めているCSSを確認しておこう

/* パソコン用 2055行目 */
.header.headercenter #logo img {
  max-height: 90px;
}

/* タブレット・スマホ用 2610行目 */
#logo a img {
  <span class="silver">width: auto;</span>
  <span class="silver">margin-top: 1px;</span>
  <span class="silver">max-width: 100%;</span>
  max-height: 45px;
}

Stork(ストーク)のロゴ画像の高さを決めているのは、style.cssに記載されている上の2つのmax-heightです。

これより優先するCSSを記載しましょう。

ロゴ画像のサイズを大きくする

ロゴ画像のサイズを大きくするには、CSSの編集を行う必要があるよ。詳しいCSSの編集方法は、WordPressでCSSを編集する方法の記事を参考にしてね

次のCSSがロゴ画像のサイズを大きくするものです。

.header.headercenter #logo a img {
  max-height: 200px;
  width: auto;
}

max-heightに指定する値は任意です。値が大きければ大きいほどロゴ画像は大きく表示されます。使用するロゴ画像にあった値を指定してください。

次の画像はmax-heightに200pxを指定した場合です。ロゴ画像の高さを決める際の参考にしてください。

ロゴ画像サイズを大きくした場合

カテゴリー:WordPress タグ:Stork(ストーク)

WordPress初心者の方に読んで欲しい記事

  • あとで後悔しない!WordPress初期設定の基本事項
  • 安全にサイトを運営しよう!WordPressセキュリティ対策の基本マニュアル
Previous Post: « Stork(ストーク)でロゴ画像を中央寄せにする方法
Next Post: Stork(ストーク)の子テーマを導入する方法 »

Primary Sidebar

世界で一番利用されているWordPressテーマ

Divi WordPress Theme
レビューを見る

あなたの悩みは?

WordPress
セキュリティ
WordPress
トラブル
アクセスアップアフィリエイト
おすすめASP

最新ニュース

  • 【カラフルボックス】夏のキャンペーン実施中【2021年8月31日まで】

最近の投稿

  • WordPressでおすすめのバックアッププラグイン5選
  • WordPressのPHP設定を変更する方法(php.ini)
  • WordPressでおすすめの画像圧縮プラグイン5選
  • WordPressの投稿編集画面でその投稿を表示する方法
  • WordPressの管理画面に再利用ブロックの管理を追加する方法

カテゴリー

  • WordPress
  • お役立ち情報
  • アフィリエイト
  • ドメインレジストラ
  • レンタルサーバー
    • ColorfulBox
    • Conoha WING
    • mixhost
    • さくらのレンタルサーバー
    • エックスサーバー
    • エックスフリー
    • ロリポップ!
  • 便利ツール
WordPress学習方法
トップページへ

プライバシーポリシー|お問い合わせ
Copyright © 2023 FOXWP All rights reserved.