比較表のブロックを追加しました!
カスタマイズ

JIN:Rでの「インフォメーションバー」の作り方!サイトのお知らせを表示しよう

ひつじ

このページでは、 WordPressテーマ「JIN:R」でのインフォメーションバーの作り方について解説します。

インフォメーションバーの作り方【テキスト型】

テキスト型のイメージ↓

インフォメーション設定を開く

タイプを選ぶ(テキスト型 or ボタン型)

すると、こんな感じのインフォバーを作成できます

テキストとボタンを入力する

テキスト1が左に、テキスト2が右に入力されます!

※ サブコピーは要らない人は、テキスト1だけ入力してもらえればOK

リンク先を設定する

httpsを含んで、ジャンプさせる先を入力しておきます。

色を調整する

インフォメーションバーの色を設定します。

グラデーションを使う場合は「カラー設定」にある「グラデショーション登録」でカラー調整してもらえるといいでしょう。

表示位置を調整する

インフォメーションをどこに表示するか調整できます。

ヒント:ページIDの取得方法

ページIDはWordPress管理画面の「投稿一覧」の右側に載っています。

インフォメーションバーの作り方【ボタン型】

タイプを選ぶ(ボタン型)

すると、ボタン付きのインフォバーを作成できます

ボタンサイズは小さく調整してセットしてもらう必要があります

テキストとボタンを入力

テキスト1が左に、テキスト2が右に入力されます!

参考:ボタンデザインについて

インフォメーションバーに合わせて、かなり小さめのボタンを作成することをおすすめします。(例↓)

リンク先を設定する

httpsを含んで、ジャンプさせる先を入力しておきます。

色を調整する

インフォメーションバーの色を設定します。

グラデーションを使う場合は「カラー設定」にある「グラデショーション登録」でカラー調整してもらえるといいでしょう。

表示位置を調整する

インフォメーションをどこに表示するか調整できます。

ヒント:ページIDの取得方法

ページIDはWordPress管理画面の「投稿一覧」の右側に載っています。

他の記事も読んでみましょう
ABOUT ME
ひつじ
ひつじ
ブロガー / デザイナー
WordPressテーマ「JIN」の制作者として、設計とデザインを担当している。

会社員として働くのが嫌すぎて、2016年に収入0円でブログ起業。SEOとアフィリエイトを組み合わせて開始1年で月100万円超の利益を達成する。

しかしその反動でアフィリエイトには飽きてしまい、もともと好きだったデザインを武器に、チームでWordPressの開発をおこなっている。
BLOGCAMP

限定コミュニティへのご案内

  • 参加費は永年無料
  • ブログ仲間が作れる
  • 困ったら相談OK
  • ブログ診断のイベントあり
参加者は3,000人超え!

すでに参加してくれている方は、「BlogCamp wiki」でブログ診断(アーカイブ)の限定動画を閲覧可能です。

wiki内にブログ勉強用の動画がたくさんあります!ぜひ役立ててくださいね。

ひつじくん
ひつじくん
記事URLをコピーしました