WordPressのテーマ選びってめちゃくちゃ悩みますよね?
しかも、「無料テーマでいくか、有料テーマか?」でもかなりの時間、迷いがちになりますよね?
なぜならわたし・・・6ヶ月間ほど悩み続けた結果ようやく有料テーマ【THE THOR(ザ・トール)】 にすることに決めました。(遅い・・・判断が遅すぎる・・・)
いざ有料テーマ『ザ・トール』にしたのですが、テーマに依存した設定があることを頭に入れてなかったので、「有料テーマに変更しただけでバッチリ!」とはいかず、ザ・トールを入れた1日目からつまづきました。
テーマ選びで時間をかなり使ったのに、テーマの設定にも時間がかかる・・・「これではせっかく有料テーマにしたのに、投資した意味がない・・・!」と気持ちだけが焦ってしまいます。
なので、この記事ではザ・トールの設定で、これだけは初めに設定しとけばカッコイイ感じになる方法を解説していきます。
サクッと設定して、ストレスなくいい感じのサイト運営をしましょう。
- 1 【THE THORの初期設定】始めにこれだけは設定したい!
- 2 有料テーマTHE THORにテーマ変更
- 3 有料テーマTHE THORの子テーマに変更
- 4 プラグインの導入
- 5 ザ・トールのスタイル変更
- 6 ザトールのID入力
- 7 お問い合わせフォームの設置
- 8 プライバシーポリシーの設置
- 9 サイトマップの設定
- 10 グローバルナビゲーションの設定
- 11 グローバルナビゲーションのヘッダーエリア表示方法
- 12 Googleアドセンス広告の自動設定
- 13 CTA広告の非表示設定
- 14 プロフィール設定
- 15 固定ページのアイキャッチ画像を非表示にする
- 16 アクセス解析設定
- 17 スマホ用メニューバーの電話アイコンを消す
- 18 ファビコンの設定
- 19 投稿画面設定
- 20 文字色の変更
- 21 見出しのスタイル設定
- 22 【補足】アフィリエイト広告のHTMLのampエラー対策
- 23 スタイリッシュなサイト運営
【THE THORの初期設定】始めにこれだけは設定したい!
・プラグインの導入
・ザ・トールのスタイル変更
・ザ・トールのID入力
・お問い合わせフォームの設置
・プライバシーポリシーの設置
・サイトマップの設定
・グローバルナビゲーションの設定
・グローバルナビゲーションのヘッダーエリア設定
・Googleアドセンス広告の自動設定
・CTA広告の非表示設定
・プロフィール設定
・固定ページのアイキャッチ画像の非表示設定
・アクセス解析設定
・スマホ用メニューバーの電話アイコン非表示設定
・ファビコン設定
・投稿画面設定
・文字色の変更
・見出しのスタイル設定
・(補足)アフェリエイト広告のHTMLのampエラー対策
上記を順に解説していきます。
パっと見ると多く感じますが、1日もかからない作業なので1つずつ設定して変化を楽しみましょう。
有料テーマTHE THORにテーマ変更
今回はXサーバーで解説していきます。
まず初めに親テーマ・子テーマを有効化する前にバージョンの確認をします。
XサーバーのパネルにログインしてPHPバージョン切り替え画面でPHPのバージョンを確認できます。
確認をする理由は、古いバージョンだと誤作動を起こす可能性があるためです。
ザ・トールは随時バージョンアップがされているので、事前に公式ホームページ確認してみましょう。
(言ってもほぼ問題なく更新されていますがね)
その次に、バックアップを取っておきましょう。
(わからなければそのまま進めても、最終的にザ・トールの設定にするので特に問題なしです)
次に、現在使用中のプラグインを停止させる。
※ザトールとの相性もあるため、プラグインの相性が悪いとデザインが崩れた状態に。
・外観→テーマ→新規追加→ファイル選択



そんな時は、エクスプローラーの検索窓でtheまで入れれば発見できるよ。

有料テーマTHE THORの子テーマに変更
ここで初めて有料テーマの子テーマTHE THORにテーマ変更する。

必ず子テーマで設定してください。
気持ちだけでも、ワードプレスの容量が軽くなるよ。
なので、必ずどのテーマでも(無料でも有料でも)設定は子テーマで行いましょう!
プラグインの導入
・EWWWImagOptimizer
・AKismetAantispam
・BrokenLinkChecker
・WPMultibytepatch
・Customizer Export/Import
・UpdraftPlus – バックアップ/復元
上記のプラグインがあれば後はザ・トールの方で全て設定ができるので、重複してサイトスピードが遅くなるだけなので入れなくて大丈夫です。
表示速度を少しでも早くしたい方は、WP Fastest Cacheというプラグインを導入すれば気持ち早くなります。
ザ・トールのスタイル変更

ザ・トールの公式ホームページに入ります。

9個のデザインからからお気に入りのスタイルをダウンロードします。
ZIPファイルをダブルクリックで開くとdatファイルが開けます。
外観
↓
カスタマイズ
↓
エクスポートインポート
↓
ファイルを選択で先ほどのdatファイルを選択
↓
画像もインポートにチェックを入れてインポート


好みのスタイルにガラっと変わります。
ザトールのID入力
外観
↓
カスタマイズ
↓
基本設定
↓
ユーザー設定
ザトールの更新がきた際に、設定完了しておかないと更新されないみたいなのでユーザー設定は済ましておきましょう。
お問い合わせフォームの設置
固定ページ新規追加
↓
タイトルは「お問い合わせ」にする
↓
画面右側のパーマリンクをcontact-formに変更
↓
タイトルとメタディスクリプションを入力
↓
ノーインデックスにチェックをいれる
↓
画面右側テンプレートでお問い合わせTPLを選択
↓
公開



さらに、このままだと読者が問い合わせの際、任意ですがわざわざURLを入れないといけない場所があるため変更した方がいいでしょう。
外観
↓
カスタマイズ
↓
基本設定
↓
お問い合わせページ設定でURLの部分を題名にでも変更しておきましょう。
↓
公開

後で、メニューバーに入れるのでここで追加しておきましょう。
WordPressのダッシュボードの画面で、
外観
↓
メニュー
↓
お問い合わせ
↓
メニューに追加で保存する。
設定
↓
管理者メールアドレスに追記
↓
グローバルメニューに追加
プライバシーポリシーの設置
固定ページ新規追加
↓
タイトルは「プライバシーポリシー」にする
↓
画面右側のパーマリンクをprivacy-policyに変更
↓
タイトルとメタディスクリプションを入力
↓
ノーインデックスにチェックをいれる
↓
画面右側テンプレートでデフォルトテンプレートを選択
↓
公開
設定
↓
管理者メールアドレスに追記
↓
グローバルメニューに追加
サイトマップの設定
固定ページ新規追加
↓
タイトルは「サイトマップ」にする
↓
画面右側のパーマリンクをsite mapに変更
↓
タイトルとメタディスクリプションを入力
↓
ノーインデックスにチェックをいれる
↓
画面右側テンプレートでサイトマップTPLを選択
↓
公開
↓
カスタマイズ
↓
基本設定
↓
自動生成サイトマップ
↓
表示にチェックを入れる
↓
公開
グローバルナビゲーションの設定

外観
↓
メニュー
↓
新規メニューを作成
(メニュー名をグローバルナビゲーションといれておきましょう。)
↓
メニュー名が変わってることを確認
↓
グローバルナビゲーションにいれたいメニューをメニューに追加
↓
ヘッダーエリアにチェック
↓
メニュー保存



グローバルナビゲーションのヘッダーエリア表示方法


Googleアドセンス広告の自動設定
外観
↓
カスタマイズ
↓
基本設定
↓
高度な設定
↓
HAED値上の自由入力エリアにアドセンスコードを貼る
↓
公開
CTA広告の非表示設定
外観
↓
カスタマイズ
↓
共通エリア
↓
フッタートップエリア設定(CTA)を非表示
↓
公開
フッターエリア設定
↓
1番下のコピーライト設定を非表示
↓
公開
トップページ設定
↓
メインビジュアル設定
↓
メインビジュアルを表示するか選択を非表示
↓
公開
プロフィール設定
ユーザー
↓
あなたのプロフィール(ここでプロフィール情報を入れると画像の下に表示できる)
↓
画像の選択
↓
プロフィール更新
↓
外観
↓
ウィジェットTHE著作者情報
↓
サイドバーエリアにドラッグする
↓
タイトルに「運営者情報」などと入れて保存。



固定ページのアイキャッチ画像を非表示にする

お問い合わせの画像とか正直なんでもいいし、めんどくさいって方は非表示にしましょう。
外観
↓
カスタマイズ
↓
固定ページ
↓
スタイル設定
↓
ページタイトルデザイン
↓
ノーマルアイキャッチなしにする※固定ページだけにする
↓
公開
アクセス解析設定
GoogleアナリティクスIDとサーチコンソールIDのの設定。
外観
↓
カスタマイズ
↓
基本設定
↓
アクセス解析設定でそれぞれのIDを貼り付ける
↓
公開
スマホ用メニューバーの電話アイコンを消す
外観
↓
カスタマイズ
↓
共通エリア
↓
固定フッターエリア「スマホ専用」電話の場所で表示する項目の電話ボタンから自由設定ボタンに変更する
↓
公開

ファビコンの設定

外観
↓
カスタマイズ
↓
サイト基本情報
↓
サイトタイトルを入れる
↓
サイトのキャッチフレーズを入れる
↓
サイトアイコン
↓
画像選択(が欧の大きさは512*512ピクセルで)
↓
公開
投稿画面設定
外観
↓
カスタマイズ
↓
基本設定
↓
記事分析設定にチェック入れる
※内部リンクと発リンクはシステムの処理に負荷がかかるため通常はやめた方がいい。
↓
公開
文字色の変更
外観
↓
カスタマイズ
↓
追加CSS
↓
p {
color: #404050;
}
をコピー&ペーストで貼るとグレーで目に優しい文字色になる
↓
公開

カラーパッドが最初に出てくるので、自分好みの色を探してその数字を#404050の場所に貼り付ければ文字色を変更できますよ。
見出しのスタイル設定
外観
↓
カスタマイズ
↓
パーツスタイル
↓
見出し設定
※右画面で自分の記事を選んで表示させておくと色や形を変更した都度確認できるます。
↓
公開
【補足】アフィリエイト広告のHTMLのampエラー対策
amazonやA8.netなどのアフィリエイト広告のHTMLでampエラー『許可されていない属性または属性値が HMTL タグにあります。』になる場合、border=”0″ を消すと解消される。
『ctrl+F』を使って記事本文内を『border=”0″』と検索すると便利です。
1つのスペースが残るだけで表示されなくなります。
あくまで上記は自己責任でお願いします。
基本的にアフィリエイト広告のHTMLをいじる行為は禁止されています。
スタイリッシュなサイト運営
おつかれさまでした。
これであなたのサイトもかなりカッコイイ感じでスタイリッシュになったのではないでしょうか?
せっかく有料のテーマに投資したのですから、設定に時間を割くよりサイト設計や記事の更新に時間を使った方が得策ですよね!
では、これからもブログを更新しつつ、もっとインターネットの世界に足を踏み入れていきましょう。