Facebook
RSS Feed
Dec 28, 2015

WordPressヘッダー最上部にキャッチフレーズ(サイトの説明)を挿入するカスタマイズ

2015-12-28-9.34

企業サイトとかアフィリエイト用のサイトだと、
サイトのロゴ上のヘッダー最上部にキャッチコピーとか入れたくなる場合ありますよね。
これたまにどうやったら良いの?って聞かれるので、
本日はWordPressにキャッチフレーズを挿入するカスタマイズ方法を。

ワードプレスの基本機能の『キャッチフレーズ』(このサイトの簡単な説明。ってやつ)を、
サイトのヘッダーに表示させてみようと思います。

1)キャッチフレーズを書く

スクリーンショット 2015-12-28 9.22.17

ダッシュボード>設定>一般>キャッチフレーズ

まずは、上記の順でたどって、キャッチフレーズをちゃんと書いておきます。

2)ヘッダーにWordPress標準のタグを挿入する

WordPressのキャッチフレーズを表示させる専用のタグは、こんなやつです。
これはもうワードプレスが用意してくれてる世界共通のやつなので、そのまま使います。

貼る場所はheader.php(ダッシュボード>外観>テーマ編集>テーマヘッダー)です。
header-xxx.phpというのが用意されてるテーマもあるので、あればそちらも同様に。
<body <?php body_class(); ?>>タグの「直後」に貼付けます。
 

そのまま貼ればとりあえず表示されるんですけど、
CSSで見た目をちょっといい感じにするために、ざっくりこ上記のコードで貼ってみます。

3)CSSで見た目をいい感じに調整する

この辺はデザインなのでお好みですけど、
背景色を付けて小さめの文字でさりげなくしてみました。

4)完成!表示されました!

2015-12-28-9.34

するとこんな感じで、ヘッダー上部に表示されます。簡単ですね。
上のコードだと、Minimal WPのレスポンシブテーマならだいたいそのまま使えると思いますが、
あとは自分のサイトのデザインに合わせてCSSで色とかサイズとか微調整すればOK。

ちなみに上のやつは今作ってる企業サイト用のテンプレートです。
2016年早々にリリースします。

HTML/CSSの記述方法・カスタマイズ方法は無料サポートを行ってませんので、さらに詳しい事はWordPress公式ドキュメントとGoogleを活用してくださいね!あと必ずバックアップを取って作業することをオススメします!
Posted in WordPress初心者講座Comments Closed 

関連記事

今月の人気のワードプレステンプレートBEST 3

WordPressテーマ(スマホ対応レスポンシブデザイン)「Slauson」
公式サイト/マガジン/ビジネス・企業
WordPressテーマ(スマホ対応レスポンシブデザイン)White Studio
ビジネス・企業/コーポレートサイト/公式サイト
WordPressテーマ(スマホ対応レスポンシブデザイン)「Pantomime」
ギャラリー・ポートフォリオ / 公式サイト