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

FOXWP

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

  • HOME
  • WordPressブログの始め方
  • お問い合わせ
FOXWP / WordPress / Stork(ストーク)ヘッダーカスタマイズ|サイトディスクリプション

Stork(ストーク)ヘッダーカスタマイズ|サイトディスクリプション

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

WordPressテーマのStrok(ストーク)でヘッダーにあるサイトディスクリプションをカスタマイズする方法を紹介します。

サイトディスクリプション

※サイトディスクリプション = 「キャッチフレーズ」 または 「サイトの簡単な説明」

目次 非表示
1 サイトディスクリプションって何?
2 ヘッダーのサイトディスクリプションの表示・非表示を切り替える
3 ヘッダーのサイトディスクリプションのCSSカスタマイズ
3.1 背景色を変更する
3.2 文字色を変更する
3.3 文字サイズ(フォントサイズ)を変更する
3.4 文字の太さを変更する
3.5 下線を入れる
3.6 下線(点線)を入れる
4 カスタマイズまとめ

サイトディスクリプションって何?

サイトディスクリプションとは、あなたのサイトの簡単な説明を表すキャッチフレーズのことです。

このキャッチフレーズは、WordPress管理画面より設定できます。メニューより、設定 ≫ 一般をクリックします。

一般設定を開く

一般設定画面の上の方に、キャッチフレーズという項目が見つかります。表示したい文言はここで変更ができます。

サイトディスクリプション(キャッチフレーズ)を設定する

注意
キャッチフレーズは設定しない方がよいと言われることがありますが、Storkではキャッチフレーズを設定してSEOに不利になるような構成はしていません。サイトを訪れる方の目に入りやすい位置にあるので、適切なキャッチフレーズを設定することでサイト内をいろいろ見てくれることが期待できます。

ヘッダーのサイトディスクリプションの表示・非表示を切り替える

Stork(ストーク)でヘッダーのサイトディスクリプションの表示・非表示はテーマカスタマイザーを使って切り替えることができます。

WordPress管理画面のメニューより、外観 ≫ カスタマイズをクリックします。

テーマカスタマイザーを開く

テーマカスタマイザーが表示されますので、グローバル設定をクリックします。

グローバル設定を開く

グローバル設定の項目に、[ヘッダー]サイトディスクリプションを表示するが見つかります。表示したい場合はチェックを入れて、公開ボタンをクリックします。

サイトディスクリプションの設定を変更する

サイトディスクリプションを表示すると、ヘッダーは次のような表示になります。

サイトディスクリプションを表示する

ヘッダーのサイトディスクリプションのCSSカスタマイズ

ヘッダーのサイトディスクリプションのカスタマイズを紹介します。紹介するのはCSSでのカスタマイズです。

カスタマイズは、必ず子テーマのCSSを変更しましょう。子テーマの導入方法は次の記事で詳しく解説しています。

Stork(ストーク)の子テーマを導入する方法

背景色を変更する

背景色のカスタマイズ

p.site_description {
	background: #1bb4d3;
}

このままだと見た目が不恰好ですよね。きれいに整えたい方は、テーマカスタマイザーのグローバル設定より変更可能です。

「ヘッダー」背景設定でフルサイズ(横幅いっぱい)を選択します。

横幅いっぱいにする

そうするとロゴ部分のヘッダー背景色が広がり、整った見た目になります。

ヘッダーの背景色が広がる

文字色を変更する

文字色のカスタマイズ

p.site_description {
	color: #fff;
}

文字サイズ(フォントサイズ)を変更する

文字サイズのカスタマイズ

p.site_description {
	font-size: 15px;
}

文字の太さを変更する

文字の太さをカスタマイズ

p.site_description {
	font-weight: bold;
}

下線を入れる

下線を入れるカスタマイズ

p.site_description {
	border-bottom: solid 1px #eee;
}

下線(点線)を入れる

下線(点線)を入れるカスタマイズ

p.site_description {
	border-bottom: dashed 1px #eee;
}

カスタマイズまとめ

ヘッダーのサイトディスクリプションは、次のCSSでまとめて設定できます。

p.site_description {
	background: #1bb4d3; /* 背景色 */
	color: #fff; /* 文字色 */
	font-size: 15px; /* 文字サイズ */
	font-weight: bold; /* 文字の太さ */
	border-bottom: solid 1px #eee; /* 下線 */
}

ヘッダーのロゴ画像のカスタマイズを行いたい方は、次の記事を参考にしてください。

Stork(ストーク)でロゴ画像を設定する方法

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

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

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

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

  • あとで後悔しない!WordPress初期設定の基本事項
  • 安全にサイトを運営しよう!WordPressセキュリティ対策の基本マニュアル
Previous Post: « WordPressにデフォルトで入っている初期プラグインは必要?不要?
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.