FP資格・資産形成・ヘルスケアなど 生活の質を高める情報をお届け

サイトを一新! 新テーマ「Thor」を導入

広告

「トール」のインストール

ここからダウンロードファイルを使った「トール」のインストールとなります。
Word Pressのテーマの基本的インストールは理解していただいている前提でご紹介します。

Zipファイルはそのまま使えない!

「トール」をダウンロードすると、”TheThor.zip”というファイルが入手できます。

WordPressテーマを導入したことがある人にはわかるかと思いますが、テーマの導入にはzipファイルをそのままインストールして使います。
今回も早速インストールしていきます。

↑クリックで拡大↑

なんと「インストールできませんでした」とのエラーメッセージが!

↑クリックで拡大↑

「うわ、有料テーマ買ったのにインストールできない」と焦ります。
焦る気持ちを抑えながら、落ち着いてzipファイルを改めて確認。

するとzipファイルの中に親テーマと子テーマのzipファイルが格納されているではありませんか!

↑クリックで拡大↑

ちゃんと確認しないまま、てっきり「ダウンロードしたzipファイルがテーマ本体」と思い込んでしまってました。
何事も確認が必要ですね。反省。

さて、ダウンロードしたファイルを解凍して、【必読・重要】のテキストファイルに目を通します。

これでテーマのインストール準備は終了です。

広告

テーマ導入に入る前に

購入後、「更新用ユーザーIDと会員フォーラムのアカウントの発行」を行っておきます。
無料バージョンアップサービスを受けるには、更新用IDの登録が必要です。

指定された「ID・アカウント発行フォーム」にて、必要な情報を入力して発行申請手続きを進めます。

↑クリックで拡大↑

発行申請すると1~2日で更新用ユーザーIDと会員フォーラムの投稿用のID・パスワードが送付されてきます。
届かない場合は、迷惑メールを確認してみましょう。

なお、「トール」は、1度の購入で複数サイトに使えますが、この場合も更新用ユーザーIDの発行は「1つだけ」とのこと。
個人利用であれば、同じIDを複数サイトで使いまわして問題ないそうです。

「トール」の導入手順

「トール」にテーマを切り替えるために、まず現在のテーマを新しいテーマに移行する段取りを固めないといけません。

前回「マテリアル2」導入時は、実際のサイト上でテーマ変更する「Theme Test Drive」というプラグインで切り替えを進めていました。
(使い方は、ぱぱたすさんの記事がわかりやすく参考になります。)

このプラグインはテーマ変更にあたってのイメージをつかむのには簡単便利です。
しかし前回は色々試しているうちに、運営中のサイトデザインが崩れてしまい、急遽本番環境を書き換える羽目になった苦い思い出があります。

このため、今回はきちんとパソコン上で新デザインを固めて、サーバー上に移行する方法をとることにしました。

具体的には次のとおり進めていきます。

  1. パソコンのローカルディスク上に現在のサイト環境をコピー
  2. 「トール」を導入・カスタマイズ
  3. 完成後に正式サイトと置き換え

パソコン上に現在のサイト環境をコピー

これには「Local by Flywheel」というソフトウェアを使います。

理由としては、直感的に使いやすいことと後述するバックアップ環境が簡単に準備出来ることです。
「Local by Flywheel」を使った環境構築は、ばんちゃこさんのブログ「キラネコ道」の”wordpressテーマを既存サイトで変更する方法!“がわかりやすかったので参照ください。

その他、作業をする中で僕が気がついた点は以下のとおりです。

サーバーのPHPバージョンを7以上に

「トール」の推奨です。

PHPは自分でバージョンアップの手続きをしないと切り替わりません。(今回まで知りませんでした。)
ちなみに僕のPHPバージョンは”5.6.40″でした…

PHPのバージョンアップで実行速度やセキュリティの向上が期待されますので、最新版の”7.3.1″に変更します。
変更方法は簡単。最新版を選んで変更を押すだけで即完了でした。

変更前 ↑クリックで拡大↑
変更後 ↑クリックで拡大↑

実はこれだけでもサイトの体感速度が上がったことが実感できます。

現在サイトのバックアップ

現在のサイトのバックアップを取っておきます。
これは直接作業に影響するものでありませんが、サイトに変更を加えるときのルーティンです。
また、現在のサイトのデータをすべてダウンロードしていくため、古いバックアップファイルが残っていると時間がかかります。
このため、古いバックアップファイルはあらかじめ削除しておくと、DLの時間短縮にもつながります。

こまめにクローンを作成し、手戻りを回避

これは僕自身の失敗をふまえてのものです。
ローカル上で「トール」をカスタマイズしていたところ、突然リアルタイムでのカスタマイズが機能停止になり、右側の画面が真っ白に。
結局一からサイトを構築することになりました。

こんなときのためにバックアップ用のデータベースを準備しておく方が良いです。
「Local by Flywheel」ではローカルサイト環境を複数保存できます。

その方法も簡単で、データベース名を右クリックして「clone」コマンドを選んで任意の名前でクローンが完成。
「”データベース名”_backup」などの名称をつけて保存しておきましょう。

プラグインをすべて一旦停止

現在のサイトには、多くのプラグインをインストールしていました。
「トール」は多機能なので、多くのことがプラグイン不要で実現できます。
現在使用中のプラグインは一旦停止して、どうしても「トール」だけでは実現できないものだけ有効にする方が良いと思います。

このときに特に注意してほしいのが、キャッシュ系プラグインです。
停止する前に「キャッシュを削除」してからプラグインを停止した方が無難な気がします。

↑クリックで拡大↑
広告

トールを導入・カスタマイズ

親テーマ→子テーマ順にインストール

テーマ変更の基本です。
今回の「トール」では、ダウンロードしたファイルに子テーマファイル”the-thor-child.zip”もついてきます。
さすがに有料テーマは親切です。

親テーマ”the-thor.zip”→子テーマ”the-thor-child.zip”の順にインストールしていきます。

↑クリックで拡大↑

また、有効化するのは、親テーマではなく子テーマの方にしましょう。

↑クリックで拡大↑

改めてカスタマイズ

「トール」は設定項目が多彩です。
その割には、導入マニュアルがあまり丁寧ではありません。

このため、最初は自分のイメージに近い「デモサイト」のデザインをダウンロードして、着せ替え機能を活用していく方が早いと思います。

なお、着せ替え機能には「Customizer Export/Import」というプラグインが必須です。
また、着せ替え機能ではそれまでのデザイン変更が上書きされるため、デザインを触り始める前に導入した方が効率的です。

カスタマイズの方法については、BlogFarmingさんの記事が大変参考になりました。参照にしてください。

次ページにて「大問題発生」

最新情報をチェックしよう!