THE THOR(ザ・トール)のデザイン着せ替え後の初期設定

THE THOR(ザ・トール)」のデザイン着せ替え機能を使って、デモサイト04のデザインに設定しましたが、そのままだとデモサイトのものが表示されているので色々と変更が必要です!

そこで、当サイトでは最初に何を用意して、どこを変更したかを、カスタマイズするページの上から順をおって設定していきます。

用意するもの

  • サイトのタイトル

  • サイトのキャッチフレーズ

  • サイトのアイコン(縦512px×横512px以上の正方形)
  • サイトロゴ画像(横420px×縦80px
  • サイトのテーマカラー
  • AMPロゴ画像(横600px 60px以下)

  • PWAアイコン画像(横72px×縦72px PNG)、(横192px×縦192px PNG)、(横512px×縦512px サイズのPNG)

  • メインビジュアルのロゴ画像(横688px×縦200px)(作らない場合は、テキストでも可)

  • メインビジュアル用静止画像(横1280px×縦612px)

※画像のサイズはデモサイト04を参考、または推奨サイズです。デモサイトでボケている時はそれより大きいサイズの方が良い場合があります。

サイトロゴの変更

設定場所は、基本設定[THE]サイトのロゴ設定にあるので、そちらでサイトのロゴの変更を行います。

高さは3つから選べるようになっていますので、お好みの高さを設定しましょう!

ちなみに当サイトは30pxにしています。

サイトのテーマカラーの変更

設定場所は、基本設定[THE]基本スタイル設定にあります。

デモサイトでは「#5ba5ad」となっている色を、お好みのカラーに変更します。

ここで、テキストリンク色や全体の背景色、全体の背景画像、全体のフォントサイズも登録・選択できるので、設定したい場合はこちらから行いましょう。

当サイトでは、テキストリンク色をテーマカラーに近い、ピンクっぽい色に変更しています。

ヘッダーエリアの設定

設定場所は共通エリア設定[THE]ヘッダーエリア設定にあります。

ボタンがない場合は、赤枠を削除し、ある場合はテキストとリンクを変更します。

フッターエリアの設定

フッターCTAの設定

設定場所は共通エリア設定[THE]フッタートップエリア設定[CTA]にあります。

当サイトでは「非表示(default)」にしておりますが、表示する場合は、アイキャッチ画像などの変更をします。

フッターのコピーライト設定

設定場所は共通エリア設定[THE]フッターエリア設定にあります。

コピーライトを変更する場合は新たに入力し、デモサイトで「by FIT-Web Create. Powered by WordPress.」と表示されているところを非表示にしたいので、右の赤枠部分を「非表示」にして変更します。

スマホ用固定フッター設定

設定場所は共通エリア設定[THE]固定フッターエリア設定[スマホ専用]にあります。

電話番号が、デモサイトの「03-0000-0000」となっているので、変更するか、削除します。

メインビジュアルのロゴ・メインビジュアル用静止画像

TOPページ設定[THE]メインビジュアル設定から、メインビジュアルのロゴと静止画像の設定を行います。

①の「画像の変更」から、「メディアライブラリ」へ行き、用意した画像を登録します。この時、②のロゴの画像の登録も行います。

ロゴの画像は、④のタグの中を変更します。②の画像を登録した際、③のURLが生成されるので、そちらを④のURLのみ変更します。

サブタイトル「結果へ導く次世代WordPressテーマ「ザ・トール」」も任意のものに変更します。

※タイトルとサブタイトルはどちらもテキストや画像にしてもOKです。削除すると静止画像のみになります。

TOPページの<title>変更

設定場所は、SEO設定[THE]>TOPページSEO設定にあります

デモサイトで「My WordPress Blog│THE THOR04」となっている部分を削除または任意のタイトルを入力します。

SNS設定

設定場所はSNS設定[THE]Follow設定にあります。

当サイトではSNSへのリンクを行っていないので、全て削除とチェックを外していますが、リンクさせる場合は変更を加えます。

AMPロゴ画像の設定

設定場所は、AMP設定AMPロゴの設定にあるので、そちらで作ったAMPのロゴ画像を登録します。

PWA機能・アイコンの設定

PWA機能設定

 

設定場所は、PWA設定[THE]PWA機能設定にあります。

PWA機能を有効か化するか選択が「SSL化されていないため有効化できません」と出る場合は、お使いのサーバーでSSL化すると有効が選択できるようになります。

また、デモサイトで「THE THOR04」となっている部分を任意のものに変更します。

PWAアイコンの設定

設定場所は、PWA設定[THE]アイコンの設定にあるので、そちらで用意した3つのアイコン画像を選択し、登録します。

サイトタイトル・キャッチフレーズ・アイコンの変更

WordPressの管理画面の、外観カスタマイズから、サイト基本情報をクリックし、用意したサイトのタイトル・キャッチフレーズ・アイコンを変更します。

インストールしたデモサイト04ではキャッチフレーズが「Just another WordPress site」となっているので、そのままではまずいですね。

まとめ

お疲れ様でした♪

流石初期設定...結構多いですよね。

簡単な初期設定は以上となります。まだまだ設定してくてはならないところはあるかと思いますが、おいおい設定していきます。