THE THOR(トール):着せ替え機能のデモサイトおすすめと注意点

画像:着せ替え機能のデモサイトおすすめと注意点

THE THOR(ザ・トール)には「着せ替え機能」があり、ブログ全体のデザインを一気に変更できます。

デモサイトには9種類のテンプレートがあり、エレガントなものや可愛いもの、企業サイトで使えそうな物などが揃っています。

この記事ではデザインの変更方法や、おすすめテンプレートの特徴を紹介しています。デザインはプロに任せて、記事作成に集中しましょう。

THE THORデモサイトのデザインをダウンロードする

画像:THE THORのスタイル変更とデモサイト
THE THORの着せ替えサンプル
THE THORの公式のデモサイト一覧に気に入ったものがあれば「スタイルダウンロード」をクリック。

ダウンロードしたファイルはデスクトップなど、分かり易い場所に保存すれば大丈夫です。

zipフォルダ(the-thor-child-export-demo0X)を解凍する

先ほどダウンロードしたファイルは圧縮フォルダ(ZIP形式)になっています。
圧縮フォルダをそのままインポートするとエラーになるので、右クリックなどで必ず解凍(展開)します。

解凍すると「the-thor-child-export-demo 0x.dat」というファイルが出来ている筈です。
※demo 0xのxの数値はデモサイトの番号(01~09)が入ります。

ダウンロードしたスタイルを適用させる手順

プラグイン「Customizer Export/Import」をインストール

画像:THE THORのカスタマイザーでファイルを設定をアップするプラグイン

ダウンロードしたファイルをアップするには「Customizer Export/Import」というプラグインを使います。

【プラグイン】→【新規追加】で検索窓に「Customizer Export/Import」と入力すればすぐに見つかりますので、【今すぐインストール】をクリックし【有効化】しておきます。

ダウンロードしたファイルをインポートする

画像:THORのスタイル変更方法 ここからスタイルをインポートする

プラグインを有効化する事で【エクスポート / インポート】の項目が追加されます。

WordPressの管理画面【外観】→【カスタマイズ】ページの、画面下の方にある【エクスポート / インポート】内から【ファイルを選択】をクリックしてください。

ファイルを選択】をクリックしたら、先ほどダウンロードした「the-thor-child-export-demo0x.dat」を選択します。
※demo 0xのxの数値はデモサイトの番号が入ります。

次に、「画像ファイルをダウンロードしてインポートしますか ?」にチェックを入れ、最後に【インポート】ボタンをクリックしてください。

「画像ファイルをダウンロードしてインポートしますか ?」にチェックを入れずに進めてしまうと、画像が表示されないなどの不具合が起こる可能性があります。

初期スタイルや違うスタイルにしたい時は?

画像:THE THORのデザインを初期スタイルに戻す
初期スタイルもダウンロード出来る

「色々なスタイルを試したい」「デフォルトスタイルに戻したい」となった時の方法がありますので解説します。

会員のマニュアルページから初期スタイルをダウンロード出来ます。

スタイル変更や戻すなど、着せ替えの注意点

初期スタイルへ戻す時だけでなく、あるスタイルから別のスタイルへ変更する時も一旦初期スタイルへ戻す必要があります。

また、カスタマイザーの設定がデフォルトに戻ってしまいます。サイトタイトルやサイトディスクリプション、ユーザーIDなども未入力の状態にもどってしまいますので、必ず再入力してください。

デモサイトを選ぶおすすめポイントはコレ

デモサイトを選ぶポイントは「ブログ全体的な色味」と、「記事一覧やカテゴリーなどレイアウトの配置」です。

サイトのメインカラーはブログ全体の印象に関わってきます。一方、レイアウトは記事の読み易さなどに関わります。

レイアウトは後から簡単に変更出来るので、カラーの方を気にした方が良いです。

理由は、カラー変更は変更項目が多く面倒で、配色のバランスも難しいから。なので配色に自信のない人はデモサイトの色味をそのまま使うのも有りです。

次から、全部で9種類あるデモサイトの中で、使いやすいおすすめ4種類を解説していきます。

THE THORのデモサイト「スタイル02」

画像:THE THORのデモサイト「スタイル02」
THE THORのデモサイト「スタイル02」

見た目の特徴

薄緑色をメインカラーとした配色で、全体的に落ち着いた印象のデモサイト。トップページは記事一覧などが整然と並び、シンプルな構成です。

トップページや記事ページはワンカラムで、新着記事やカテゴリーはページ下部にまとめられています。

こんな人におすすめ

情報系の記事や論評など、読み物として文章をしっかり読んで貰いたい人におすすめです。

THE THORのデモサイト「スタイル04」

画像:THE THORのデモサイト「スタイル04」
THE THORのデモサイト「スタイル04」

見た目の特徴

02のデモサイトよりも濃い目の、灰みがかった青緑色をメインカラーとした配色。派手過ぎず、使いやすい印象です。サイドバーありの2カラム構成です。

記事内のアイキャッチは好き嫌いが分かれると思います。ここは変更出来ますし、それ以外はとてもバランスが良いと思います。

こんな人におすすめ

読み物は勿論、商品紹介など様々なタイプのブログにバランスよく合います。

THE THORのデモサイト「スタイル06」

画像:THE THORのデモサイト「スタイル06」
THE THORのデモサイト「スタイル06」

見た目の特徴

えんじ色(濃い紅色)をメインカラーとした配色。デモサイトの写真のインパクトが強いですが、同じ様な感じの写真を使うのはハードルが高いです。

派手な色使いと大きめなアイキャッチが多いのでインパクトがあります。

こんな人におすすめ

その見た目から、やはり美容系のブログがおすすめ。綺麗な画像を上手く使用するとより効果的です。

THE THORのデモサイト「スタイル07」

画像:THE THORのデモサイト「スタイル07」
THE THORのデモサイト「スタイル07」

見た目の特徴

明るめのベージュを基調とし、嫌みのない上品さや清潔感がある配色。サンプル画像からも雰囲気が伝わってきます。

トップページや各記事にはアイキャッチが付いておらず、記事タイトルや記事概要だけ。もちろん後から変更は出来ます。

あえて写真を多用せず、綺麗なスタイルを活かすのも素敵かもしれません。

こんな人におすすめ

大人っぽい上品で女性的な印象が強いので、無機質なガジェット系よりは、同じ女性向けの情報が良く合います。

まとめ

THORのデザイン着せ替え機能は簡単に見た目を変更出来るので、好みのスタイルがあれば使って見てくださいね。

注意点は、スタイルを変更すると細かい設定が戻ってしまうので本格的に運用する前に試すのがおすすめです。

画像:THE THORで標準機能の目次設定方法 うまく表示されない時も見てね

THE THOR(トール):目次設定を解説 表示されない時は見てね

THE THOR:目次のデザインをカスタマイズ - CSSサンプル有り

THE THOR:目次のデザインをカスタマイズ – CSSサンプル有り

画像:THE THORでワードプレスのプロフィール写真・画像設定

THE THOR(ザ・トール)のプロフィール写真・画像設定方法