ザ・トールの「デモサイト03」　着せ替えたら、とりあえずココを設定しよう！

『THE THOR（ザ・トール）』にはデザイン着せ替え機能という素晴らしいサービスがあります。この機能を使えば、デモサイトのようなカッコイイデザインを、一瞬で自分のサイトに設定することができるのです。

しかし！

着せ替え機能を使って設定しただけでは、ただのデモサイトのままです。デザイン以外の項目を設定することで、自分のサイトとして公開することができます。

そこで、そこはちょっと放置したままじゃまずいよーっていう設定項目を抜き出しましたので、参考にしてみてください。着せ替えても、実はやることが多いんです。

今回は、デモサイト03についてお伝えします。（https://thor-demo03.fit-theme.com/）

デモサイト03では、メインビジュアルにスライドショーが使われています。シンプルなサイト設計なので、ブログなどにも向いてそうですね。

このデザインを設定するうえで、用意すべき画像は以下のとおりです。（W×H）内はデモサイト03で使用されている画像サイズです。（とりあえず用意の画像です。各機能を利用する予定がなければ不要です。）

TOPページ（タイトル）

ここは重要！ですよね。自分のサイトタイトルですもん。放置できません！

デモサイト03では、トップページタイトルが「My WordPress Blog│THE THOR」と設定されています。放置するとこのまま表示されます。まずい、まずい・・・。

変更は、SEO設定 ＞ TOPページ設定 ＞ TOPページの＜title＞から行うことができます。

TOPページ（ヘッダー・メインビジュアル）

1.サイトロゴ

画像も一緒にインポートしている場合は、「THE THOR DEMO03」という画像が設定されています。

ロゴの変更は、基本設定 ＞サイトロゴの設定 ＞ロゴ画像の設定から行うことができます。

画像が用意できていない場合は、設定されている画像を削除すれば、テキストでサイト名が表示されます。

3.注目ボタン（メニューパネルの右側）

デモサイト03では、メニューパネル右側の表示されているのが注目ボタンです。（スマホではメニューパネル内で表示されます。）

この変更は、共通エリア設定 ＞ ヘッダーエリア設定 ＞ サブメニュー設定から行うことができます。

設定すべき項目は・・・

 注目ボタンのテキストを入力

「THEME DOWNLOAD」と設定されています。

 ボタンのリンク先URLを入力

ザ・トール公式サイトのURLが設定されています。

※注目ボタンを表示したくない場合は、文字とURLを消すと表示されません。

3.メインビジュアル

デモサイト03では、スライドショーが設定され、3つの画像が使われています。最大で5つまで設定可能。変更は、TOPページ設定 ＞ メインビジュアル設定 ＞ スライドショー時の設定から行うことができます。

設定すべき項目は・・・

スライドショー1～3の画像を登録

画像も一緒にインポートした場合は、スライドショー1～3まで設定されています。

タイトルを入力

「THE THOR」と設定されています。（スライドショー1～3の設定）

サブタイトルを入力

「結果へ導く次世代WordPressテーマ「ザ・トール」」と設定されています。（スライドショー1～3の設定）

※タイトルとサブタイトルを入力している場合、画像の上に表示されます。

TOPページ背景画像

デモサイト03では、背景画像が設定されています。

変更は、基本設定 ＞ 基本スタイル設定 ＞ 全体の背景画像を登録から行います。

そのまま使ってもいいですし、不要なら削除しておきましょう。

注目キーワード

注目キーワードは、検索する際に使用するキーワード入力欄の下に表示されたり、検索パネル内やヘッダボトムエリア（設定した場合）に表示されます。

デモサイト03では「WEB」「デザイン」「SEO」というキーワードが設定されています。変更する場合は、基本設定 ＞ 検索機能設定 ＞注目キーワードを設定から行うことができます。

※非表示にしたい場合は、注目キーワード設定の入力欄を空欄にすると表示されません。

TOPページ（フッターエリア）

コピーライト設定

『LION MEDIA』や『LION BLOG』でも、テーマの制作会社名やWordPressという表示を消すことができました。ザ・トールにも同じ機能が備わっています。（急ぐ必要ではないので、後回しでもOKです。）

設定は、共通エリア設定 ＞ フッターエリア設定 ＞ コピーライトの設定から行うことができます。

「非表示」にすれば消すことができます。

スマホ用固定フッター

スマホでサイトが表示されたときに、固定フッターが表示されるように設定されています。設定の変更は、共通エリア設定 ＞ 固定フッターエリア設定［スマホ用］から行うことができます。

設定すべき項目・・・

項目２の設定

デモサイト03ではシェアボタンを表示するに設定されていますが、表示する項目（Facebook、Twitter、Google+、はてぶ、Pocket、LINE、Linkedln、Pinterest）にチェックが入っていません。表示したい場合は、必要なものにチェックを入れます。

項目4の設定

電話番号が表示されるように設定されています。「電話番号を入力」欄には番号が登録されていませんので、表示する場合は登録しましょう。

投稿ページ

シェアボタンの設定、フォローボタンの設定が必要です。

シェアボタンの表示設定

設定の変更は、投稿ページ設定 ＞ シェアボタン設定 ＞　シェアボタンの表示／非表示から行います。

Facebook、Twitter、Google+、はてぶにチェックが入っています。必要なものを設定しましょう。

フォローボタン設定

設定の変更は、投稿ページ設定 ＞ フォローボタン設定 ＞ フォローボタンの表示／非表示から行います。

不要な場合は「表示しない」に設定しましょう。

SNS設定

SNSフォローアイコンの表示設定をしていても、きちんと自分のURLを設定しておかないと意味がありませんよね。

Follow設定

URLの設定は、SNS設定 ＞ Follow設定から行います。

設定できるSNSは、Facebook、Instagram、Twitter、Google+、YouTubeチャンネル、Linkedln、Pinterest、RSSです。項目ごとに、URLの入力欄とHeader・Footerの表示設定があります。

デモサイト03では、FaceBook、Twitter、Google+においてURL欄にDemo-URLが設定されていますので、変更をしておきましょう。また同じように、上記３つとRSSの「Header、Footerでフォローアイコンを表示する」にチェックが入っていますので、不要なものはチェックを外しましょう。（ここでいうHeader、Footerは、TOPページの表示を指しています。）

その他

機能自体は有効になっていないのでページ上には表示されていませんが、カスタマイザー上では設定されているが、自サイトには関係ないもの（不要なもの）をピックアップしました。

PWA機能設定

デモサイト03では機能は無効になっていますが、アイコン下テキストが設定されています。

変更は、PWA設定 ＞ PWA機能設定から行います。

上の画像はデモサイト01のものですが、デモサイト03でも同じようにホーム画面のアイコン下テキストを入力に「THE THOR」と設定されています。

以上で、デモサイト03「とりあえずココだけ設定！」は終わりです。デモサイト01に比べると「とりあえずココだけ設定」は少なめでした。

着せ替えた後も、いろいろとやることはあります。使い方もわからない状態でカスタマイザー内を探すのって、本当に大変だったので、記事にしてみました。

とりあえず、これさえ読めばサイトの公開まで持っていくことができます。公開さえできれば、サイトのテーマカラーや、各パーツのカラー設定、デザインの細かな設定などは、じっくりと考えながら行うことができるかと思います。

最後までお付き合いありがとうございました。お疲れさまでした。