【THE THORの初期設定】始めにこれだけは設定したい!

【THE THORの初期設定】始めにこれだけは設定したい!

WordPressのテーマ選びってめちゃくちゃ悩みますよね?

しかも、「無料テーマでいくか、有料テーマか?」でもかなりの時間、迷いがちになりますよね?


なぜならわたし・・・6ヶ月間ほど悩み続けた結果ようやく有料テーマ『ザ・トール』にすることに決めました。(遅い・・・判断が遅すぎる・・・)

いざ有料テーマ『ザ・トール』にしたのですが、テーマに依存した設定があることを頭に入れてなかったので、「有料テーマに変更しただけでバッチリ!」とはいかず、ザ・トールを入れた1日目からつまづきました。


テーマ選びで時間をかなり使ったのに、テーマの設定にも時間がかかる・・・「これではせっかく有料テーマにしたのに、投資した意味がない・・・!」と気持ちだけが焦ってしまいます。

なので、この記事ではザ・トールの設定で、これだけは初めに設定しとけばカッコイイ感じになる方法を解説していきます。

サクッと設定して、ストレスなくいい感じのサイト運営をしましょう。

【THE THORの初期設定】始めにこれだけは設定したい!

・ザ・トールにテーマ変更
・プラグインの導入
・ザ・トールのスタイル変更
・ザ・トールのID入力
・お問い合わせフォームの設置
・プライバシーポリシーの設置
・サイトマップの設定
・グローバルナビゲーションの設定
・グローバルナビゲーションのヘッダーエリア設定
・Googleアドセンス広告の自動設定
・CTA広告の非表示設定
・プロフィール設定
・固定ページのアイキャッチ画像の非表示設定
・アクセス解析設定
・スマホ用メニューバーの電話アイコン非表示設定
・ファビコン設定
・投稿画面設定
・文字色の変更
・見出しのスタイル設定
・(補足)アフェリエイト広告のHTMLのampエラー対策

上記を順に解説していきます。

パっと見ると多く感じますが、1日もかからない作業なので1つずつ設定して変化を楽しみましょう。

有料テーマTHE THORにテーマ変更

今回はXサーバーで解説していきます。

まず初めに親テーマ・子テーマを有効化する前にバージョンの確認をします。


XサーバーのパネルにログインしてPHPバージョン切り替え画面でPHPのバージョンを確認できます。

確認をする理由は、古いバージョンだと誤作動を起こす可能性があるためです。


ザ・トールは随時バージョンアップがされているので、事前に公式ホームページ確認してみましょう。

その次に、バックアップを取っておきましょう。
(わからなければそのまま進めても、最終的にザ・トールの設定にするので特に問題なしです)


次に、現在使用中のプラグインを停止させる。

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

有料テーマTHE THORにテーマ変更

必ず子テーマ設定してください。

親テーマは更新するたびに、内容が変更してしまうのでせっかくいい感じで設定できたのに更新があるたびにまた設定しなおすのは面倒ですよね?

なので、必ずどのテーマでも(無料でも有料でも)設定は子テーマで行いましょう!

プラグインの導入

・GoogleXMLSitemaps
・EWWWImagOptimizer
・AKismetAantispam
・BrokenLinkChecker
・WPMultibytepatch
Customizer Export/Import
UpdraftPlus – バックアップ/復元
WP User Avatar

上記のプラグインがあれば後はザ・トールの方で全て設定ができるので、重複してサイトスピードが遅くなるだけなので入れなくて大丈夫です。

表示速度を少しでも早くしたい方は、WP Fastest Cacheというプラグインを導入すれば気持ち早くなります。

WP Fastest Cacheは、キャッシュの削除ができるプラグインです。

ザ・トールのスタイル変更

ザ・トールのスタイル変更

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

ザ・トールのスタイル変更

9個のデザインからからお気に入りのスタイルをダウンロードします。

ZIPファイルをダブルクリックで開くとdatファイルが開けます。

WordPressのダッシュボード画面で
外観

カスタマイズ

エクスポートインポート

ファイルを選択で先ほどのdatファイルを選択

画像もインポートにチェックを入れてインポート
ザ・トールのスタイル変更
ザ・トールのスタイル変更

好みのスタイルにガラっと変わります。

 
ろんろん
ちなみに、ろんろんブログは4番のスタイルです。

ザトールのID入力

WordPressのダッシュボードの画面で、
外観

カスタマイズ

基本設定

ユーザー設定

ザトールの更新がきた際に、設定完了しておかないと更新されないみたいなのでユーザー設定は済ましておきましょう。

お問い合わせフォームの設置

WordPressのダッシュボードの画面で、
固定ページ新規追加

タイトルは「お問い合わせ」にする

画面右側のパーマリンクをcontact-formに変更

タイトルとメタディスクリプションを入力

ノーインデックスにチェックをいれる

画面右側テンプレートでお問い合わせTPLを選択

公開
お問い合わせフォームの設置
お問い合わせフォームの設置
お問い合わせフォームの設置

さらに、このままだと読者が問い合わせの際、任意ですがわざわざURLを入れないといけない場所があるため変更した方がいいでしょう。

WordPressのダッシュボードの画面で、
外観

カスタマイズ

基本設定

お問い合わせページ設定でURLの部分を題名にでも変更しておきましょう。

公開
お問い合わせフォームの設置

後で、メニューバーに入れるのでここで追加しておきましょう。

WordPressのダッシュボードの画面で、
外観

メニュー

お問い合わせ

メニューに追加で保存する。

WordPressのダッシュボードの画面で、
設定

管理者メールアドレスに追記

グローバルメニューに追加

プライバシーポリシーの設置

 
ろんろん
お問い合わせフォームの設置とやり方がほぼお同じなので、画像省きます!
WordPressのダッシュボードの画面で、
固定ページ新規追加

タイトルは「プライバシーポリシー」にする

画面右側のパーマリンクをprivacy-policyに変更

タイトルとメタディスクリプションを入力

ノーインデックスにチェックをいれる

画面右側テンプレートでデフォルトテンプレートを選択

公開
WordPressのダッシュボードの画面で、
設定

管理者メールアドレスに追記

グローバルメニューに追加

サイトマップの設定

WordPressのダッシュボードの画面で、
固定ページ新規追加

タイトルは「サイトマップ」にする

画面右側のパーマリンクをsite mapに変更

タイトルとメタディスクリプションを入力

ノーインデックスにチェックをいれる

画面右側テンプレートでサイトマップTPLを選択

公開
外観

カスタマイズ

基本設定

自動生成サイトマップ

表示にチェックを入れる

公開

グローバルナビゲーションの設定

 
ろんろん
ヘッダーエリアのグローバルナビゲーションの設定をしていきましょう。
グローバルナビゲーションの設定
WordPressのダッシュボードの画面で、
外観

メニュー

新規メニューを作成
(メニュー名をグローバルナビゲーションといれておきましょう。)

メニュー名が変わってることを確認

グローバルナビゲーションにいれたいメニューをメニューに追加

ヘッダーエリアにチェック

メニュー保存
グローバルナビゲーションの設定
 
ろんろん
次は同じ要領で、フッターエリアの設定をしましょう。番号順に設定して保存するだけで完了!
グローバルナビゲーションの設定
グローバルナビゲーションの設定

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

 
ろんろん
少し細かいですが、せっかくなので好みの方を設定しましょう。
グローバルナビゲーションのヘッダーエリア表示方法
グローバルナビゲーションのヘッダーエリア表示方法

Googleアドセンス広告の自動設定

WordPressのダッシュボードの画面で、
外観

カスタマイズ

基本設定

高度な設定

HAED値上の自由入力エリアにアドセンスコードを貼る

公開

CTA広告の非表示設定

 
ろんろん
スタイル変更時はやたらとでかいザ・トールの広告が表示されていてザ・トールの回し者みたいになります(笑)
WordPressのダッシュボードの画面で、
外観

カスタマイズ

共通エリア

フッタートップエリア設定(CTA)を非表示

公開
フッターエリア設定

1番下のコピーライト設定を非表示

公開
トップページ設定

メインビジュアル設定

メインビジュアルを表示するか選択を非表示

公開

プロフィール設定

WordPressのダッシュボードの画面で、
ユーザー

あなたのプロフィール(ここでプロフィール情報を入れると画像の下に表示できる)

画像の選択

プロフィール更新

外観

ウィジェットTHE著作者情報

サイドバーエリアにドラッグする

タイトルに「運営者情報」などと入れて保存。
プロフィール設定
プロフィール設定
プロフィール設定

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

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

お問い合わせの画像とか正直なんでもいいし、めんどくさいって方は非表示にしましょう。

WordPressのダッシュボードの画面で、
外観

カスタマイズ

固定ページ

スタイル設定

ページタイトルデザイン

ノーマルアイキャッチなしにする※固定ページだけにする

公開

アクセス解析設定

GoogleアナリティクスIDとサーチコンソールIDのの設定。

WordPressのダッシュボードの画面で、
外観

カスタマイズ

基本設定

アクセス解析設定でそれぞれのIDを貼り付ける

公開

スマホ用メニューバーの電話アイコンを消す

 
ろんろん
企業のホームページならいいですが、個人ブログをスマホで見る際、電話アイコンは基本使わないかと。
WordPressのダッシュボードの画面で、
外観

カスタマイズ

共通エリア

固定フッターエリア「スマホ専用」電話の場所で表示する項目の電話ボタンから自由設定ボタンに変更する

公開
スマホ用メニューバーの電話アイコンを消す

ファビコンの設定

ファビコンの設定
WordPressのダッシュボードの画面で、
外観

カスタマイズ

サイト基本情報

サイトタイトルを入れる

サイトのキャッチフレーズを入れる

サイトアイコン

画像選択(が欧の大きさは512*512ピクセルで)

公開

投稿画面設定

WordPressのダッシュボードの画面で、
外観

カスタマイズ

基本設定

記事分析設定にチェック入れる
※内部リンクと発リンクはシステムの処理に負荷がかかるため通常はやめた方がいい。

公開

文字色の変更

WordPressのダッシュボードの画面で、
外観

カスタマイズ

追加CSS


p {
color: #404050;
}

をコピー&ペーストで貼るとグレーで目に優しい文字色になる

公開

文字色の変更
 
ろんろん
余談ですが、Googleの検索窓に#404050をコピーして貼り付けたら色味が出ます。

カラーパッドが最初に出てくるので、自分好みの色を探してその数字を#404050の場所に貼り付ければ文字色を変更できますよ。

見出しのスタイル設定

WordPressのダッシュボードの画面で、
外観

カスタマイズ

パーツスタイル

見出し設定
※右画面で自分の記事を選んで表示させておくと色や形を変更した都度確認できるます。

公開

【補足】アフィリエイト広告のHTMLのampエラー対策

amazonやA8.netなどのアフィリエイト広告のHTMLでampエラー『許可されていない属性または属性値が HMTL タグにあります。』になる場合、border=”0″ を消すと解消される。

『F8キー』を使って記事本文内を『border=”0″』と検索すると便利です。

border=”0″を消した後、スペースが2つ入らないように気を付ける。
1つのスペースが残るだけで表示されなくなります。


あくまで上記は自己責任でお願いします。

基本的にアフィリエイト広告のHTMLをいじる行為は禁止されています。

スタイリッシュなサイト運営

おつかれさまでした。

これであなたのサイトもかなりカッコイイ感じでスタイリッシュになったのではないでしょうか?


せっかく有料のテーマに投資したのですから、設定に時間を割くよりサイト設計や記事の更新に時間を使った方が得策ですよね!

では、これからもブログを更新しつつ、もっとインターネットの世界に足を踏み入れていきましょう。

【THE THORの初期設定】始めにこれだけは設定したい!
最新情報をチェックしよう!