THE THOR(ザトール)着せ替えの特徴と設定♪着せ替え前と後

THE THOR(ザ・トール)の9個ある着せ替えスタイルを詳しく紹介しています。
  • THE THOR(ザ・トール)の着せ替えパターンそれぞれの特徴が知りたい
  • wordpressの知識ゼロでも着せ替えは簡単にできるの?

こういった疑問にブログ初心者がTHE THOR(ザ・トール)を1年半使った体験談(笑)を交えながら答えたいと思います

 本記事の内容

  1. THE THOR着せ替えパターンそれぞれの特徴
  2. THE THOR着せ替えのやり方まとめ
  3.  THE THOR着せ替えをする時の注意点

私の体験談の前にTHE THOR(ザ・トール)のテーマの構成の紹介と、着せ替えの手順と特徴を簡単に紹介します♪
THE THOR(ザ・トール)を親テーマ、子テーマとインストールした後、スタイルを選んで着せ替えします!
このインストールの方法などの詳しい手順は↓の記事で紹介していますので、興味がある方は参考にしてみてください。

>>>wordpress有料テーマ【ザ・トール】でブログ♪購入からインストール手順の説明

簡単な記事を作成してデモサイトの9パターンで着せ替えすると、どう変わるかをスクショしてあります。
それぞれのスタイルの特徴と共に比べてみてみてください(^^♪

THE THOR(ザトール)子テーマ「01」が着せ替えられる

THE THORデモサイトの着せ替えは9個あります

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

【THE THOR】を購入して「親テーマ」と「子テーマ」をインストールすると、設定されているデザインは「01」になります。

【THE THOR】の着せ替えで変わっていくのは「子テーマ」の設定です。

選択すれば着せ替えのスタイルに使っている画像もインストールできます

THE THOR(ザトール)着せ替えの心得♪

着せ替え後に「外観」→「テーマ」で一覧を表示させたときに、子テーマが「01」と表示されていても気にしないでください。

そこは着せ替えても「01」表示のままです( ̄▽ ̄;)

何しろパーツの表示/非表示の設定が変わるだけなので(笑)

>>>THE THOR(ザ・トール)公式ページははこちら

THE THOR(ザトール)デモサイト着せ替え♪スタイル設定

THE THOR(ザ・トール)の着せ替えというのは、パーツの表示/非表示を選択し変更して作られています。

デモサイトからデザインを選んで着せ替えすれば、ブログのデザインが簡単にガラッと変わります(^^♪

着せ替えた後に、設定をいじっていけばデモサイトとは違う感じになっていきます(笑)

私のサイトは「09」の着せ変えをした後に、設定を変えたり、CSS追加したり、親テーマいじったりしたので原型をとどめていません(;^ω^)

THE THOR(ザトール)の構成を紹介

THE THORのエリア構成は10個あります。

着せ替え後に設定を変更する時の為に、THE THOR(ザ・トール)の構成を紹介します。

  • ヘッダーエリア(固定を選択できる)
  • ヘッダーボトムエリア(表示/非表示を選択できる)
  • メインビジュアルエリア(表示/非表示を選択できる)
  • メインビジュアル下(表示/非表示を選択できる)
  • カルーセルスライダー(表示/非表示を選択できる)
  • サイドカラムエリア(表示/非表示を選択できる)
  • メインカラムエリア
  • フッタートップエリア(表示/非表示を選択できる)
  • フッターエリア

この構成を、表示させたり非表示にしたりしながら着せ替えが構成されています。

THE THOR(ザトール)ヘッダーボトムエリア

  • ヘッダー検索窓の表示設定
  • ヘッダーお知らせの表示設定

この2つを表示させるか選択できます。

THE THOR(ザトール)ブログのカラムの話

カラムのはサイトの骨格になります。

3カラムのレイアウト

Yahooのトップページが3カラムです。

3カラムのレイアウトだとメインエリアが狭くなります。

2カラムのレイアウト

記事ページで私が使用しているカラムになります。

2カラムのレイアウトはメインエリアとサイドエリアがあるタイプです。

このカラムをどう選択しているかで着せ替えのデザインが変わってきます。

1カラムのレイアウト

ここは画像を省きました(;^_^A
私のトップページが1カラムになります。

サイドに何もない状態のページです。

THE THOR(ザトール)着せ替えパターンおすすめ♪

着せ替えは、使用されている画像、そして設定の違いで見た目を変えています。
この細かな設定を簡単に一括でしてしまおうというのが、着せ替え機能です。

これからスタイルでどう変わるのかを紹介していくのですが、自分のブログで使いたい設定が多いなと感じる着せ替えのスタイルを選ぶことをオススメします(^^)/

着せ替えをした後に、自分の好みに設定を変えていく時間が短縮されます♪

THETHOR(ザトール)着せ替えスタイル01の紹介

THE THOR(ザトール)着せ替えスタイル01のTOPページ

THE THOR(ザ・トール)デモサイトのスタイル【01】の着せ替え

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

THE THOR(ザトール)着せ替えスタイル01に着せ替え後

THE THOR(ザ・トール)デモサイトのスタイル【01】の着せ替え後

THE THOR(ザトール)着せ替えスタイル01のおすすめな特徴

ヘッダーエリア固定しない
ヘッダーボトムエリア
「お知らせ」
表示
メインビジュアル下
注目エリア設定
表示
カルーセルスライダー表示
TOPページの記事レイアウトカードレイアウト
ピックアップ3記事表示
カラム2
記事ランキング表示
カテゴリ最新記事表示
フッタートップエリア表示

ビジュアルアリアの画像にマスクがかかっています。

>>>THE THOR(ザ・トール)公式ページははこちら

THETHOR(ザトール)着せ替えスタイル02の紹介

この着せ替えスタイルは、ヘッダーのメニューバーが非表示設定になっています。

メニューを表示させたい場合は、設定を変更しましょう(^^♪

THE THOR(ザトール)着せ替えスタイル02のTOPページ

THE THOR(ザ・トール)デモサイトのスタイル【02】の着せ替え

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

THE THOR(ザトール)着せ替えスタイル02に着せ替え後

THE THOR(ザ・トール)デモサイトのスタイル【02】の着せ替え後

THE THOR(ザトール)着せ替えスタイル2のおすすめな特徴

ヘッダーエリア固定しない
ヘッダーボトムエリア
「キーワード検索」
表示
メインビジュアル下
注目エリア設定
カルーセルスライダー
TOPページの記事レイアウトカードレイアウト
ピックアップ3記事
カラム1(TOPページのみ)
記事ランキング無
カテゴリ最新記事
フッタートップエリア

TOPページのカラムが1カラムで、サイドエリアが非表示なっています。

>>>THE THOR(ザ・トール)公式ページははこちら

THETHOR(ザトール)着せ替えスタイル03の紹介

THE THOR(ザトール)着せ替えスタイル03のTOPページ

THE THOR(ザ・トール)デモサイトのスタイル【03】の着せ替え

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

THE THOR(ザトール)着せ替えスタイル03に着せ替え後

THE THOR(ザ・トール)デモサイトのスタイル【03】の着せ替え後

THE THOR(ザトール)着せ替えスタイル03のおすすめな特徴

ヘッダーエリア固定しない
ヘッダーボトムエリア
「お知らせ」
メインビジュアル下
注目エリア設定
カルーセルスライダー
TOPページの記事レイアウトアイキャッチ画像の横に紹介文
ピックアップ3記事
カラム2
記事ランキング
カテゴリ最新記事
フッタートップエリア
>>>THE THOR(ザ・トール)公式ページははこちら

THETHOR(ザトール)着せ替えスタイル04の紹介

この着せ替えスタイルは、ヘッダーのメニューバーが非表示設定になっています。

メニューを表示させたい場合は、設定を変更しましょう(^^♪

THE THOR(ザトール)着せ替えスタイル04のTOPページ

THE THOR(ザ・トール)デモサイトのスタイル【04】の着せ替え

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

THE THOR(ザトール)着せ替えスタイル04に着せ替え後

THE THOR(ザ・トール)デモサイトのスタイル【04】の着せ替え後

THE THOR(ザトール)着せ替えスタイル04のおすすめな特徴

ヘッダーエリア固定
ヘッダーボトムエリア
「お知らせ」
メインビジュアル下
注目エリア設定
カルーセルスライダー表示
TOPページの記事レイアウトアイキャッチ画像の横に紹介文
ピックアップ3記事
カラム2
記事ランキング
カテゴリ最新記事表示
フッタートップエリア表示

このデモサイトの着せ替えの画像がすごい・・・。

TOPページの全部の画像にマスクがかかってる。

>>>THE THOR(ザ・トール)公式ページははこちら

THETHOR(ザトール)着せ替えスタイル05の紹介

THE THOR(ザトール)着せ替えスタイル05のTOPページ

THE THOR(ザ・トール)デモサイトのスタイル【05】の着せ替え

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

THE THOR(ザトール)着せ替えスタイル05に着せ替え後

THE THOR(ザ・トール)デモサイトのスタイル【05】の着せ替え後

THE THOR(ザトール)着せ替えスタイル05のおすすめな特徴

ヘッダーエリア固定しない
ヘッダーボトムエリア
「検索キーワード」
表示
メインビジュアル下
注目エリア設定
表示
カルーセルスライダー
TOPページの記事レイアウトカードレイアウト
ピックアップ3記事
カラム1(TOPページのみ)
記事ランキング
カテゴリ最新記事
フッタートップエリア

TOPページのカラムが1カラムで、サイドエリアが非表示なっています。

>>>THE THOR(ザ・トール)公式ページははこちら

THETHOR(ザトール)着せ替えスタイル06の紹介

この着せ替えスタイルは、ヘッダーのメニューバーが非表示設定になっています。

メニューを表示させたい場合は、設定を変更しましょう(^^♪

THE THOR(ザトール)着せ替えスタイル06のTOPページ

THE THOR(ザ・トール)デモサイトのスタイル【06】の着せ替え

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

THE THOR(ザトール)着せ替えスタイル06に着せ替え後

THE THOR(ザ・トール)デモサイトのスタイル【06】の着せ替え後

THE THOR(ザトール)着せ替えスタイル06のおすすめな特徴

ヘッダーエリア固定しない
ヘッダーボトムエリア
「お知らせ」
表示
メインビジュアル下
注目エリア設定
カルーセルスライダー表示
TOPページの記事レイアウトアイキャッチ画像の下に紹介文
ピックアップ3記事
カラム2
記事ランキング
カテゴリ最新記事
フッタートップエリア表示

画像にマスクがかかっています。

>>>THE THOR(ザ・トール)公式ページははこちら

THETHOR(ザトール)着せ替えスタイル07の紹介

この着せ替えスタイルは、ヘッダーのメニューバーが非表示設定になっています。

メニューを表示させたい場合は、設定を変更しましょう(^^♪

THE THOR(ザトール)着せ替えスタイル07のTOPページ

THE THOR(ザ・トール)デモサイトのスタイル【07】の着せ替え

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

THE THOR(ザトール)着せ替えスタイル07に着せ替え後

THE THOR(ザ・トール)デモサイトのスタイル【07】の着せ替え後

THE THOR(ザトール)着せ替えスタイル07のおすすめな特徴

ヘッダーエリア固定しない
ヘッダーボトムエリア
「お知らせ」
メインビジュアル下
注目エリア設定
カルーセルスライダー
TOPページの記事レイアウト紹介文のみ(アイキャッチ画像非表示)
ピックアップ3記事
カラム2
記事ランキング表示(アイキャッチ画像非表示)
カテゴリ最新記事
フッタートップエリア

着せ替えでテーマを上書きしているはずなのに、前の設定が残っているのか、ヘッダーエリアの背景が黒に・・・

>>>THE THOR(ザ・トール)公式ページははこちら

THETHOR(ザトール)着せ替えスタイル08の紹介

この着せ替えスタイルは、ヘッダーのメニューバーが非表示設定になっています。

メニューを表示させたい場合は、設定を変更しましょう(^^♪

THE THOR(ザトール)着せ替えスタイル08のTOPページ

THE THOR(ザ・トール)デモサイトのスタイル【08】の着せ替え

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

THE THOR(ザトール)着せ替えスタイル08に着せ替え後

THE THOR(ザ・トール)デモサイトのスタイル【08】の着せ替え後

デモサイトの見本と全然違う見た目になったので驚きました( ̄▽ ̄;)

THE THOR(ザトール)着せ替えスタイル08のおすすめな特徴

ヘッダーエリア固定
ヘッダーボトムエリア
「お知らせ」
メインビジュアル下
注目エリア設定
カルーセルスライダー
TOPページの記事レイアウト紹介文のみ(アイキャッチ画像非表示)
ピックアップ3記事
カラム2
記事ランキング
カテゴリ最新記事
フッタートップエリア

メインビジュアルが非表示設定になっていたので、大きな画像はないです。

デモにあった便利そうな検索はどこへいったのでしょうか・・・消えています。

自分で設定して表示させるしかないですね(;^_^A

>>>THE THOR(ザ・トール)公式ページははこちら

THETHOR(ザトール)着せ替えスタイル09の紹介

私のサイトで使用した着せ替えになります。
面影が残っていないなぁ・・

THE THOR(ザトール)着せ替えスタイル9のTOPページ

THE THOR(ザ・トール)デモサイトのスタイル【09】の着せ替え

引用元:他を圧倒する「ザ・トール」のデモサイト一覧

THE THOR(ザトール)着せ替えスタイル09に着せ替え後

THE THOR(ザ・トール)デモサイトのスタイル【09】の着せ替え後

THETHOR(ザトール)着せ替えスタイル09のおすすめな特徴

ヘッダーエリア固定しない
ヘッダーボトムエリア
「お知らせ」
メインビジュアル下
注目エリア設定
カルーセルスライダー
TOPページの記事レイアウト 紹介文のみ(アイキャッチ画像非表示)
ピックアップ3記事
カラム2
記事ランキング
カテゴリ最新記事
フッタートップエリア

ヘッダーエリアの背景色が水色になっているのが不思議??

選択していないのだけれど・・・

上書きの弊害でしょうか??

>>>THE THOR(ザ・トール)公式ページははこちら

THE THOR(ザトール)デモサイトからのスタイル着せ替えの手順紹介

プラグイン「Customizer Export/Import」をインストールして有効化してください。

その後、選んだデモサイトの「スタイルダウンロード」をクリックすると、圧縮ファイルがダウンロードされます。

任意のフォルダーに解凍して使用します。

着せ替えの詳しい手順は下の記事で紹介してます♪

>プラグイン【ザ・トール】デザインの着せ替え&バックアップの説明♪

THE THOR(ザトール)デモサイトからのスタイル着せ替えの注意点

THE THOR(ザ・トール)のデータが上書きされるので、バックアップデータが必要になるかもしれません。
バックアップは自分でしなくても、契約しているレンタルサーバーにあるので確認してみてください。

レンタルサーバーのバックアップについて知りたい方は下の記事を参考にしてみてください。

>>>THE THOR♪簡単wordpressブログのバックアップ方法

もしバックアップから復旧までをしたことがなければ、1度バックアップから復旧までのテストをしてみることをオススメします。

そして、バックアップと共に、THE THOR(ザ・トール)の会員IDや、Googleアナリティクスのトラッキングコード等をメモを取ることを忘れないでください。

wordpressの知識ゼロでもTHE THOR(ザトール)着せ替えが簡単にできる理由

「着せ替え難しそう」と思うかもしれませんが、とっても簡単なんです。

着せ替えにかかる時間は・・・5分もかかりません。

デモサイトから「スタイルシート」を自分のPCダウンロードしてきて、「外観」→「カスタマイズ」でインポートすれば出来ちゃいます。

そして、着せ替えの事についてもそうなのですが、自分がわからない事があれば、会員フォーラムで調べることが出来ます。

しかも今では検索サイトで検索すれば、色々なサイトが説明をしてくれています。
それでもわからないことがあれば、会員フォーラムに投稿して聞くこともできます。

THE THOR(ザトール)着せ替えの特徴と設定♪着せ替え前と後 まとめ

デモサイトのスタイル。

どれに着せ替えにしようか迷いまいますよね。

そらはCSSもPHPもいじりたくなるのです。

この記事を書くにあたって、デモサイトの着せ替えを改めた見てみたら、やっぱりWEBデザイナーさんが作っただけあって本格的だなぁと思いました。

設定をいじりすぎると、カッコよさが消えていく。

自分のサイトを改めて見て思いました(笑)

ランキングに参加しているのでバナーをクリックしていただけると嬉しいです♪
 ランキングサイトに参加しているのでクリックしていただけると嬉しいです(^^♪ 人気ブログランキング

私が個人でAmazonアソシエイトに応募して落ちましたが、「もしもアフェリエイト」を通して申請したら合格しました。

もしもからの申請も保険と思ってしておきましょう♪

物販ならアソシエイトに応募と同時に(保険として)もしもからも申請することをお勧めします♪

A8.netは広告主数・登録サイト数共に日本最大級のアフィリエイトサービスプロバイダーです。

ここもおすすめ♪アフェリエイトの会社によって、扱っている商品は違ったり、又、同じ商品でも成約金額が違う場合があるので複数の登録をお勧めします(^^)/

A8.netにとうろくして、無料の初心者用のアフィリエイトブログ作成の無料セミナーの参加をオススメします!

/ブログを装飾/初心者向けTHE THOR初期設定/便利なサイト&ツール/

THE THOR(ザ・トール)の9個ある着せ替えスタイルを詳しく紹介しています。
最新情報をチェックしよう!
>

そら

プログラマーとして働いていたが結婚後を機に田舎に戻り、独学でHTML・Perlを勉強し自宅でWEBの仕事をはじめるも、アレルギー児の子育てで断念。 子供の手が離れたのを機にWorldpressの勉強をしながらブログをはじめました。

 そらのまなびぶろぐ について 


そらのまなびぶろぐでは、wordpressの有料テーマ【THE THOR(ザ・トール)】を使用して収益化ブログの作り方を初心者向けに紹介しています。 エディタの使い方、アドセンス申請に必要なページの書き方&作り方、ブログの装飾の方法までを紹介しています。

サイトに広告を掲載してお小遣いが稼げる!【A8.net】
無料登録はこちら
サイトに広告を掲載してお小遣いが稼げる!【A8.net】
無料登録はこちら