生きやすい人を増やすための働き方のブログ

【THE THOR】ヘッダー下にお知らせ用のバーを表示させる方法

  • 2021年1月31日
  • 2021年6月9日
  • THE THOR

こんにちは、ミスターパインです。

今回からWordPressテーマ「THE THOR」のカスタマイズ方法についても紹介していこうと思います。このブログは引き続きJINを使っていきますが、運営している別サイトを例に紹介していきますので、そちらのブログもぜひよろしくお願いします。



この記事では

  1. WordPressテーマTHE THORを使って
  2. ヘッダー下にお知らせ用のバーを入れる方法

について解説します

[chat face=”mr-pine-maru.png” name=”ミスターパイン” align=”left” border=”yellow” bg=”yellow”]お知らせ用のバーとは以下の画像の黄色いラインのこと[/chat]

THE THORのヘッダー下のお知らせバー

これを設定すると

  • 好きな背景色に
  • 好きな文字を表示させて
  • 読者を誘導したいリンク先を設定

することができます。

簡単ですのでサクッと終わらせてしまいましょう。

THE THORのヘッダー下のお知らせバー設定方法

共通エリアの設定

まずは「ダッシュボード」→「外観」→「カスタマイズ」と進んで「共通エリア設定[THE]」をという項目を選択します。

ヘッダーボトムエリア設定の画面

続いて「ヘッダーボトムエリア設定[検索窓・お知らせ]」という項目を選択。

ヘッダーボトムのお知らせ内容変更

一番下までスクロールすると「ヘッダーお知らせの表示設定」という項目があるので

  • ヘッダーお知らせを表示するか選択:表示
  • お知らせとして表示させる文章を入力:お好きな文字を入力
  • リンク先URLを入力:読者を誘導したいページのリンク
  • 背景色を設定:好みの色を設定

してみてください。

ヘッダー下お知らせのサンプル

ヘッダーお知らせを「表示する」と設定した時点でバーが表示されます。

内容やリンク先に間違いがなければ左上の「公開」を押して内容を保存して完了です。

[chat face=”mr-pine-maru.png” name=”ミスターパイン” align=”left” border=”yellow” bg=”yellow”]サイトの配色に迷う時はColor Huntというサイトを活用すると便利ですよ[/chat]

<div class=”concept-box5″><p>Color Hunt</p></div>

まとめ

ということで今回は以上となります。

引き続きWordPressの人気テーマTHE THORのカスタマイズ情報もまとめていきますのでお楽しみに!


THE THORを使っているサイト

  1. BASECAMP SIEMREAP
  2. JUNKO in REP