WordPressテーマ「THE THOR(ザ・トール)」ラベル一覧とデザインの変更方法

当サイトでも使用しているWordPressテーマ「THE THOR(ザ・トール)」。

デフォルトの見た目の紹介と、ラベルデザインの変更方法を紹介します。

 

THE THOR(ザ・トール)ラベル一覧

角丸レッドラベル

シンプルボーダーラベル

ライム左ラウンドラベル

ブルーボーダーラウンドラベル

丸アイコンオレンジラベル

ピンクアイコンラベル

四角アイコンラベル

破線ボーダーアイコンラベル

ビッグ右ラウンドブルーラベル

ターコイズグラデ右寄せラベル

 

THE THOR(ザ・トール)ラベルアイコンの変更方法

アイコンオプション ⇨ アイコン一覧 で使いたいアイコンの名前をコピーします。

WordPressテーマ「THE THOR(ザ・トール)」ラベル一覧とデザインの変更方法

 

使いたいラベルを選択 ⇨ アイコン挿入

ダイアルログが表示されるので先ほどのアイコン名を張り付けて「OK」

 

WordPressテーマ「THE THOR(ザ・トール)」ラベル一覧とデザインの変更方法

 

すると…。

もともとの丸アイコンのラベルを…

Youtubeのアイコンに変えることができました!

 

 また、テキストエリアに直接アイコンを挿入することもできます。

 アイコンは文章の先頭に表示されます。

 文章と文章の間や文末には設定できませんでした。

 

ちなみに、アイコンがもともとないラベルにも同じ方法でアイコンを追加することができます。

デフォルトでアイコンがないラベルに

 アイコンを付けてみました

 

 

THE THOR(ザ・トール)ラベルのデザイン変更

編集エリアの上にあるタブ「テキスト」を選択して「HTML」を触れるようにしましょう。

WordPressテーマ「THE THOR(ザ・トール)」ラベル一覧とデザインの変更方法

 

例として下記のラベルの色を変えてみましょう。

アイコンのデザインを変えたい

 

まずはコードをみてみましょう。

 

  • bgc-:背景色
  • brc-:枠線色
  • ftc-:文字色

 

背景色・枠線色・文字色を変えてみました。

こんなかんじ

 

コードは上記のようになっています。

初歩的なデザインの変更方法はここまでです。

▽このブログのWPテーマ▽