比較表のブロックを追加しました!

JIN:Rでの「デザイン見出し」の作り方!文字サイズ変更などの方法も合わせて解説

ひつじ
<景品表示法に基づく表記> 当サイトの記事内に商品プロモーションを含む場合があります。

このページでは、 WordPressテーマ「JIN:R」でのデザイン見出しの使い方を解説していきます。

左寄せのデザイン

Design Title
デザイン見出しのサンプル

中央寄せのデザイン

Design Title
デザイン見出しのサンプル

こんな風に、デザイン性の高い見出しを作成することができます!

ひつじくん
ひつじくん

トップページだけじゃなくて、ブログ記事でも使いやすそうだな。

おおかみくん
おおかみくん

「デザイン見出し」の作り方を解説!

デザイン見出しを作成する

作り方:/デザイン見出し と入力

半角のスラッシュ(/)を押してから、「デザイン見出し」と入力すると、JIN:Rのデザイン見出しをすぐ呼び出せます。

少しお時間をいただきますが、↑の動画をじっくり見てもらうのがわかりやすいと思います

Q
最も初心者向けの方法(/を使わない)はこちら

画面右上の「+」ボタンを押して、「デザイン見出し」をクリックしてください!

デザイン変更へ(右サイドバー)

デザイン見出しのデザイン変更は、右サイドバーでできるようになっています!

デザイン見出しの右サイドバーにあるパラメーターを切り替えることで、色々なデザインに変更可能です。

  • レイアウト
    • 左寄せ
    • 中央寄せ
  • 装飾
    • 番号
    • アイコン
    • 画像
  • デザイン
    • 文字のみ
    • 下線
    • 上下線

を切り替えられます。

特に「アイコン」「画像」をうまく使いこなすと、かなりデザイン性の高い見出しに仕上がるよ!

たとえば、画像にキャラクターを載せたりすると、オリジナリティの高いサイトなっていくね。

ひつじくん
ひつじくん

なるほど、そうやって使っていけばいいのか(メモメモ)

おおかみくん
おおかみくん

詳しくは先ほどの動画をみてもらえると、わかりやすいと思います!

タイトルタグ(H2/H3/div)を選ぶ

デフォルトはH2になるようになっています。必要に応じて、タイトルタグの切り替えを行ってください。

もしデザイン見出しを「目次」に表示したくない場合は、divを選択しておくのが無難です!

ひつじくん
ひつじくん

色変更はお好みで

色の変更はお好みで行なってください。

デフォルトではテーマカラーが当たるようになっているので、基本的には変更する必要がないようにテーマ側で設計されています。

文字サイズ調整もお好みで

デザイン見出しの文字サイズを変更することも可能だよ!

Aa のアイコンをクリックすると、文字サイズ変更ができるから、これを活用してみてね!

ひつじくん
ひつじくん

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

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

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

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

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

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

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

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