元サラリーマンブロガーなつのプロフィール

THE THOR(ザ・トール)のスタイルの設定と便利な使い方!

こんにちは!ブログ運営半年で月20万超の元サラリーマンブロガーなつです。

記事を書くとき、蛍光ラインやボタンやボックスなどの編集をする際に必要なパーツを簡単に呼び出せるのが「スタイル」部分です。

THE THOR(ザ・トール)のスタイルの簡単な使い方や設定方法などお伝えしていきます。

THE THOR(ザ・トール)のスタイルってどこにある?

THE THOR(ザ・トール)に限らず、他のテーマでもスタイルで文章装飾のパーツを管理しているものも多いです。

ブログ記事を書く際に、パーツをいちいちコピーして貼りつけるのはかなり面倒で時間がかかります。(実際私も同じようにしていました・・・)

「スタイル」のある場所は「投稿ページ」の真ん中、文章装飾の並んでいるビジュアルエディタの部分にあります。

スタイルの右にある▼印をクリックすると、内容が展開しますので、そこから装飾パーツを選びます。

スタイルでできること
  • マーカー
  • ラベル
  • ボタン
  • ボックス
  • ボックス内ボックス
  • スタイルセット
  • カラーセット
  • デフォルトパーツ

スタイルで設置できるもので大きくわけると上のボックスのようになりますが、かなり詳細に分かれていますので、この記事の一番最後に一覧表にしていますので確認してみてください。

THE THORなつ特製オリジナルデザインマニュアルプレゼント中!

THE THORのオリジナルテンプレート6種類ができました!このブログからTHE THOR(ザ・トール)をご購入くださった方に特典としてマニュアルをプレゼントしています。マネするだけでデザイン変更が簡単にできます。

 

ガーリー

シンプル
オーガニック


※残りの3種類とブログの全体像は以下の記事で見れますのでよかったらご覧ください。

⇒ 【簡単な使い方】THE THORデザインの事例集6選!初心者でも作れるアレンジを紹介!

//今なら、なつ特製オリジナルデザインマニュアル付き!\\

【初心者必見!】THE THOR(ザ・トール)の購入特典!割引についても調査!【WordPressテーマ】

 

THE THOR(ザ・トール)のスタイルが見つからない時の確認方法

いざ、投稿ページで記事を作成しようと思ってもビジュアルエディタに「スタイル」のボタンがない場合には、ある操作で簡単に出すことができます。

ビジュアルエディタの上の部分をクリックすると「スタイル」のボタンが出てきます。

この「スタイル」ボタンをクリックするとできることが展開しますので、自分でやりたいことを選んでください。

THE THOR(ザ・トール)のスタイルの使い方!

スタイルの使い方をここから説明をしていきます。スタイルセットは自分でボタンやボックスを作るものなので、まずはそれ以外の使い方です。

 

マーカーの使い方

文章を強調したいときに使うマーカー。THE THOR(ザ・トール)では太さや色が選べます。

手順

  1. マーカーを引きたい文章を反転させる
  2. マーカーの太さ色を選ぶ

 

 

出来上がり

 

ラベルの使い方

ラベルは、ラインよりももう少し強めに文章を装飾したいときに使います。

手順

  1. 装飾をしたい文章を反転させる
  2. ラベルを選ぶ

出来上がり

 

オリジナルのパーツも作れるワードプレステーマ「THE・THOR」

※今なら、8大購入特典をお付けしています!

ボタン

ボタンは、リンクで誘導したい部分などを目立たせる役割をします。最近では、影があり本物のボタンみたいなものもあります。

手順

  1. ボタンにしたい文章を反転させる
  2. ボタンの種類を選ぶ

出来上がり

 

ボックス

文章が長くなった時の区切りや、分けてわかりやすくする場合にはボックスが有効です。

手順

  1. ボックスに入れたい文章を反転させる
  2. ボックスを選ぶ

出来上がり

 

ボックス内ボックス

ボックスの中にボックスを入れたい時に使います。あまり使わないかもしれませんが、ボックスの中の文章を選んでボックスを入れます。

手順

  1. ボックスに入れたい文章を反転させる
  2. ボックスを選ぶ

 

出来上がり

 

デザインがカッコイイワードプレステーマ「THE・THOR」

※今なら、8大購入特典をお付けしています!

THE THOR(ザ・トール)のスタイル設定の方法

ここからは、スタイルセットでのパーツの作り方を説明していきます。実は私も最初は悩んだのですが、コツがわかるとすぐに作れますのでチャレンジしてみてください。

 

スタイルセットで作れるパーツ

  • ラベル
  • ボタン
  • ボックス
  • ボックス内ボックス

作りだすと簡単なのですが、作業をする順番は一番下からクリックし、デフォルトパーツで「なにを作りたいのか」を最初にクリックしないと色や形の設定ができません。

当たり前のことなんですが、THE THORのスタイルの並びがなぜか逆になっていますので混乱しないようにしてください。

ボックスを作ってみましょう

スタイルセットでボックスを作ってみましょう。ボックスは文字の色や、背景、周りの線など設定する部分が多いので、これができるようになればボタンなどは比較的簡単にできるようになると思います。

「テスト」などなんでもいいので文章を投稿ページに作っておきます。

手順

  1. 文章を反転させる
  2. スタイルのデフォルトパーツでボックスを選ぶ
  3. スタイルのカラーセットで文字色を選ぶ
  4. スタイルのカラーセットで背景色を選ぶ
  5. スタイルのスタイルセットで線を選ぶ
  6. スタイルのカラーセットでボーダー色を選ぶ

 

ボックスの中の背景の色の選び方

 

ボーダー(線)の選び方

 

ボーダー(線)の色の選び方

 

出来上がり

THE THOR(ザ・トール)ではパーツを作ろうと思えばかなり多くの選択肢があり、最初は迷ってしまうかもしれません。

基本に忠実に作っていけば自分の好みのパーツができあがりますので、デフォルト以外にオリジナリティを出したい場合にはこのスタイルを使ってみてください。

パーツを作るときのポイントは、文字を反転させておくこと。

これをしないと、次に進めません。

 

↓ このブログからTHE THORを購入くださった方に特典をプレゼントしています。

【初心者必見!】THE THOR(ザ・トール)の購入特典!割引についても調査!【WordPressテーマ】

スタイルセットでできること一覧表が以下のボックスの下にありますので、よかったら参考にしてみてください。

初心者だからこそWordpress有料テーマ を使うべき理由

無料テーマを使うことで時間の無駄遣いをしていませんか?

  • 思い通りのデザインにできない
  • なかなか稼げない
  • アクセス数が増えない

こんな悩みを抱えていませんか?

 

稼ぐブログにしろ趣味ブログにしろ検索の上位にこなければなかなか読んでもらえません。もしあなたが稼ぐブログを作りたいなら、初心者の時に初期投資することはとても大事なことです。

 

Wordpressの有料テーマができる5つのこと

  1. 検索上位を目指せる
  2. 見た目が綺麗でおしゃれになる
  3. 機能が豊富で出来ることが多い
  4. 会員フォームなどのサポート
  5. 有名ブロガーも有料テーマを使っている

これまでにあげた5つの有料テーマの特徴を説明していきます。

1. 検索上位を目指せる

ブログを運営していく上で対策をしていかなければいけないのがSEO対策です。検索エンジンのことを考えてブログを最適に合わせていくということがSEO(SearchEngine Optimizationの略)です。

 

  • 情報の信頼性
  • ユーザーへの役立つ情報であるか?
  • スマホ・PCなどでストレスなく使える

 

などたくさんの要因がありますが、ブログを訪問した人があなたのブログの多くの記事を読んでくれるようなテンプレートの仕組みも有料テーマでは細やかに考えられています。

 

2. 見た目が無料テーマ以上に綺麗になる

シンプルが良いか、綺麗なテーマが良いのかそれぞれの好みによります。無料テーマは必要最低限のものを備えていますがやはりシンプルすぎていずれつまらなくなってしまいます。

有料テーマはデザイン性が高く自分の好きなデザインにもカスタマイズしやすいです。

出典:THE THOR 着せ替え「01」

↓ クリックで拡大します
出典:特製THE THORオリジナルアレンジ

 

3. 機能が豊富でできることが多い

今現在新しい機能として出てきたのが「着せ替え機能」です。過去にも賢威などにはベース色とパターンがありましたが最近ではアフィリなどはっきりと違った用途で使えるように作りこんでいます。

4. 会員フォーラムなどのサポート

なにかわからないことがあった場合、相談できる場所があるだけで安心できます。ここが無料テーマと一番違う部分、有料テーマでは売りっぱなしにしない工夫がされています。

5. 有名ブロガーも多数使用

稼いている有名ブロガーと言われる人のほとんどは有料テーマを使っています。ブログ造りでは内容も非常に大事ですが、文章や扱っている分野が同じ程度ならやはり最後の勝負はテーマの構造などになります。

もしあなたが稼ぐブログを作りたいと考えているならば「有料」テーマも検討してみてください。

カスタマイズで悩んでいる時間、ブログの完成度、上位に表示するメリットなど考えると有料テーマはあなたのお役にたちます。


当ブログおすすめのWordPressテーマ!

 

WordPressテーマ「THE・THOR」

  • 高機能の最新テーマで有名ブロガーも使用
  • 着せ替え機能でいろんな用途に使える
  • 複数のブログに使える(本人のブログ)
  • 会員フォーラムやマニュアル完備

 

 

THE THOR(ザ・トール)のスタイルでできること詳細一覧

THE THOR(ザ・トール)のできること詳細を一覧表にしておきます。一気にたくさんでてきますので見づらい場合にこの内容でご確認ください。

(尚、バージョンアップなどで変更になる場合もありますので、ご了承ください)

マーカー マーカー(太)(中)(細)
  • レッド
  • ブルー
  • イエロー
  • ピンク
  • グリーン
  • グレー
ラベル
  • 角丸レッドラベル
  • シンプルボーダーラベル
  • ライム左ラウンドラベル
  • ブルーボーダーラウンドラベル
  • アイコンオレンジラベル
  • ピンクアイコンラベル
  • 四角アイコンラベル
  • 破線ボーダーアイコンラベル
  • ビッグ右ラウンドブルーラベル
  • ターコイズグラデ右寄せラベル
ボタン
  • オレンジ100%ボタン
  • グリーンシャドウ100%ボタン
  • ブルーボーダーボタン
  • ブルーグラデボタン
  • ピンクアイコンボタン
  • ピンクグラデアイコンボタン
  • グリーン立体アイコンボタン
  • グレーラウンドアイコンボタン
  • サークルアイコンボタン
  • ボックスアイコンボタン
ボックス
  • サブタイトルボーダーボックス
  • BIG括弧ボックス
  • 方眼ペーパーボックス
  • はてなボックス
  • ビックリボックス
  • Qボックス
  • Aボックス
  • シンプルアイコンボックス
  • 背景アイコンボックス
  • 帯アイコンボックス
ボックス内ボックス
  • ターコイズグラデタイトル
  • アイコンボーダータイトル
  • ブルーシャドウタイトル
  • サブタイトルボーダーボックス
  • BIG括弧ボックス
  • 方眼ペーパーボックス
  • はてなボックス
  • ビックリボックス
  • Qボックス
  • Aボックス

スタイルセットでボタン等を作るときには以下のことができます。

■スタイルセット サイズ系
  • サイズ(10%)
  • サイズ(25%)
  • サイズ(40%)
  • サイズ(50%)
  • サイズ(60%)
  • サイズ(75%)
  • サイズ(90%)
  • サイズ(100%)
内側余白系
  • 余白0
  • トップ(極小)(小)(中)(大)
  • ライト(極小)(小)(中)(大)
  • ボトム(極小)(小)(中)(大)
  • レフト(極小)(小)(中)(大)
外側余白系
  • 余白0
  • トップ(極小)(小)(中)(大)
  • ライト(極小)(小)(中)(大)
  • ボトム(極小)(小)(中)(大)
  • レフト(極小)(小)(中)(大)
ボーダー系
  • オール実践(細)(中)
  • オール破線(細)(中)
  • オール点線(細)(中)
  • ボトム実線(細)(中)
  • ボトム破線(細)(中)
  • ボトム点線(細)(中)
  • レフト実践(細)(中)
  • レフト破線(細)(中)
  • レフト点線(細)(中)
文字系
  • 位置(左)(中央)(右)
  • サイズ(小)(大)(極大)
  • 太字
  • 斜体
  • 打消し
  • アンダーライン
シャドウ系
  • ボックス外(ライト)(ノーマル)(ダーク)
  • ボックス内(ライト)(ノーマル)(ダーク)
  • テキストシャドウ(ライト)(ノーマル)(ダーク)
角丸系
  • 角丸(5PX)
  • 角丸(10PX)
  • ラウンド
背景系
  • グラデーション1.2
  • 方眼紙
ラベルパーツ専用
  • コーナータイトル(ボックス内)
  • ラウンド(左)(右)
  • アイコン(余白)(ボーダー)(ボックス)(サークル)
ボタンパーツ専用
  • 立体
  • 薄影
  • 薄影+光
  • 右矢印
  • アイコン(余白、ボーダー、ボックス、サークル)
ボックスパーツ専用
  • 全域タイトル(ボックス内
  • カギ括弧
  • めくり(左、右)
  • はてなマーク
  • ビックリマーク
  • Qマーク
  • Aマーク
  • サブタイトル(シンプル、角丸、ラウンド)
  • アイコン(シンプル、背景、帯、コーナー、サークル)
■カラーセット
  • 文字色
  • 背景色
  • ボーダー色
■デフォルトパーツ
  • ラベル
  • ボタン
  • ボックス
  • ボックス内ボックス

シェアしてね!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です