これまで WordPress のテーマとしては、無料の Cocoon を使って細かなところは自分で CSS をカスタマイズして使ってきましたが、初めて有料テーマ（ザ・トール）を導入してみたので使い勝手とかを紹介します。
THE THOR (ザ・トール) について
WordPress にはテーマを適用することで、簡単に色んなデザインにすることが出来ますが、WordPress 用のテーマには無料のものと有料のものが存在してます。今回、紹介する THE THOR(ザ・トール) に関しては有料のテーマになります。
THE THOR(ザ・トール)の何が凄いの？
まず言えるのは、簡単にめっちゃおしゃれなブログデザインが簡単に導入できるということ。
私は HTML とか CSS の知識は殆どなくて、これまで使っていた無料の Cocoon でも無料にしてはかなりのレベルのブログは作れてたんだけど、あともう少しどうにかしたいなと思っても、なかなか実装するのは難しかった・・・
ブログデザインの設定時間は約５時間で完了
今回、THE THOR(ザ・トール) のテーマを購入してから、自分の好みにデザインをカスタマイズ（CSSコードの記述は不要でマウスでポチポチするだけ）して、本番環境への適用が完了するまでに掛かった時間は、わずか５時間程度でした！ 2018年11月にブログを始めたばかりの頃に無料テーマの Cocoon を導入し、CSS によるカスタマイズ方法とかをネットで調べつつ形になったのは約１週間くらいだったので、圧倒的に楽なのが分かる。
今回、約５時間で導入が完了したブログはこんな感じです。写真ブログなので出来るだけシンプルだけど、写真が見やすくて他の記事にも飛びやすい使いやすさを意識したブログが直ぐに作成出来ました。
THE THOR(ザ・トール) の特徴
詳細な特徴はトールの公式サイトに記載がありますが、私が魅力に関したのは以下の点になります。
- 簡単におしゃれなデザインのブログ作成が可能
- 完全レスポンシブデザイン（PCで表示してもタブレットで表示してもスマホで表示しても、綺麗に表示してくれる）
- 見出しデザイン、リストデザイン等をクリックだけで簡単にデザイン変更ができる
- 検索の王者 Google が推奨する AMP／PWA に対応してる
料金について
料金体系について２種類あって、テーマとサポートだけと、サーバーへのセットアップも含めて実施してくれるプランがあります。レンタルサーバーとかは既に持っていている場合には、テーマ＆サポートプランでいいと思います。
| テーマ＆サポートプラン | らくらくサーバセットプラン（初心者向け） |
| ・WordPress テーマ一式（親テーマ、子テーマ） ・会員限定サイト利用権 ・無料バージョンアップ | ・WordPress テーマ一式（親テーマ、子テーマ） ・会員限定サイト利用権 ・無料バージョンアップ |
| ・インストール時の「安心メールサポート」 | ・レンタルサーバー１年間分 ・ドメイン１点（.net、.com、.biz、.info）１年間分 ・WordPress 本体とテーマのインストール代行 ・テーマのデザイン初期設定代行 |
| 価格： 14,800 円(税別) | 価格： 27,400 円(税別) |
私は元々さくらのレンタルサーバー（スタンダードプラン）を利用しているのもあって、「テーマ＆サポートプラン」を購入しました。
THE THOR(ザ・トール) の購入方法について
THE THOR(ザ・トール) のサイトにアクセスして「テーマをダウンロード」をクリックします。
希望する方のプランの「テーマを購入する」をクリックします。
後は画面の表示に従って、決済を行います。
決済が完了すると、登録したメールアドレス宛にダウンロード用の URL とパスワードの情報が届くのテーマファイルをダウンロードします。なお、ダウンロード期限は決められているのでダウンロード期限内にダウンロードを完了しておく必要があります。
これまで利用していた無料テーマ Cocoon について
無料としては考えられないレベルの使い勝手
2018年11月にブログを始めた時から使っていた 無料テーマの Cocoon だけど、正直なところ不満という不満はありませんでした。むしろ無料でここまでのレベルのものを提供してくれてるのは凄すぎると思う。
今回、なぜ有料テーマに乗り換えたかというと、２年も経過してブログデザインに飽きてきたから・・・
ただ、Cocoon の場合にはデザインを変えようとすると CSS とかをイジれば変えられるんだけど、そもそも CSS の知識がほぼ無いので、自分の理想とするデザインにするのは至難の技なので、理想のデザインに近いデザインを持っている有料テーマを選べば手っ取り早いので乗り換えました。
WordPress でのテーマの入れ替え方法について
ブログを始めてから同じテーマを使い続けて来たので、テーマの入れ替え自体を行ったことがなかったので、テーマの入れ替えを行う人の参考になれば思い記載しておきます。
さくらインターネットであればテスト用サイトで事前の作り込みが可能
私のブログの実行環境として利用しているさくらインターネットのレンタルサーバーでは標準機能として、ステージング用サイトを作る機能が提供されてたので、今回はその機能を利用し、本番サイトには影響を出さずにステージング環境でテーマの入れ替えと入れ替えた後の詳細設定を完了してから本番サイトに反映を行いました。
バックアップ＆ステージング SnapUp（さくらインターネット）
さくらのインターネットの管理パネルにメニューが用意されていて、数回クリックするだけで、本番環境には影響を出さずにステージング環境を作ってくれます。
「Webサイト/データ」→「バックアップ」を選択。
「SnapUp」をクリック。
「サイトを追加する」をクリック。
以下のとおり選択して、「追加」をクリックします。
「スナップショットを追加、作成する」をクリックする。
「本番サーバーから取得」をクリック。
取得したスナップショットの状態を後で見て分かりやすいコメントを入力して「実行」をクリック。
処理状況が表示されるので「処理終了」になるまで待ちます。
本番サイトのデータ容量にもよりますが、私の環境（約710MB）では約１～２分程度でスナップショットの取得が完了しました。
取得したスナップショットをステージング環境で使えるようにするために、「ステージングサーバーを作成する」をクリックします。
ステージングサーバー名は自動生成されるので基本的にはそのままで大丈夫です。
http/https、MySQLバージョン、PHPバージョンは本番環境と合わせて選択して「追加」をクリックします。
作成したスナップショットのところに「ステージングサーバーへセット」とあるのでクリックします。
「OK」をクリックします。
処理が終わるまで待ちます。（約5分程度かかります）
ステージング用の URL をクリックすると、ステージング環境が利用出来ます。なお、ステージング環境は一般ユーザーがアクセス出来ないように ID/PW による認証が必要なので、ステージング環境にログインする際には「認証情報を確認する」をクリックして、アクセス情報を確認します。
ステージング環境として本番と同様のサイトが扱える状態になるので、ワードプレスの管理URL となるドメインの後に /wp-admin/ を付けて管理画面にアクセスしてテーマの入れ替えなどを実施します。
Cocoon から THE THOR(ザ・トール) への入れ替えで困ったこと
アイキャッチの画像比率として ３：２ が選べない
これまで使っていた Cocoon ではアイキャッチの比率としての自由度は高くて、ミラーレスカメラの比率と同じ３：２が選べてました。THE THOR(ザ・トール) の場合には３：２の選択肢がなくて、１６：９／４：３／１：１ の３パターンからの選択になります。
今回は ３：２ に比率が近い ４：３ を選択しましたが、比率が違うため、これまでの記事のアイキャッチ用として作成していた３：２の画像がフィットせずに、両サイドが切れた状態で表示されるのが微妙です。ただ、全ての記事のアイキャッチ画像を ４：３ で作り直すのは面倒くさ過ぎるので、これから書く新しい記事と古い記事の中でどうしても気になるアイキャッチだけ作り直そうかな。。
THE THOR(ザ・トール) にメニューが表示されない
これは Cocoon からの移行だからというわけではなく、THE THOR(ザ・トール) の問題だと思うけど、メニューを表示するように設定しているのに、デフォルトだとメニューが表示されません。調べた感じだとどうやらバグらしくて、改善方法としては、一度メニューを非表示にしてから再度表示設定にすることで正常に表示されるようになりました。
不具合の状態としてはこんな感じで、管理画面のカスタマイズ画面では表示されている状態になってます。
実際に公開しているサイトでは、メニューが表示されないという謎現象・・・
改善する手順としては「共通エリア設定[THE]」→「ヘッダーエリア設定」→「グローバルメニュー設定」の「グローバルメニューを表示するか選択」で一度「PCで表示しない」を選択して公開してから「PC/スマホで表示する(default)」を選択し公開することで改善しました。うーん、ここだけで 30分程度は時間を使ってしまった・・・
FooGallery で作成した写真ギャラリーが１つ目だけズレる
写真ギャラリーのページは FooGallery で作ってるんだけど、なぜが１枚目だめ微妙にズレて表示される・・・
解決策がわからなかったので、とりあえず放置。。時間がまた出来たら頑張ってみよう。
THE THOR(ザ・トール) を導入してよかったこと
見出しなどのデザインをクリックだけで適用できる
これまでの Cocoon の場合には、見出しデザインを変更する時は CSS を頑張って書いてたけど、THE THOR(ザ・トール) であれば、こんな感じで、用意されているデザインから好みのデザインを選択するだけで設定することが可能です。
選択したデザインの中で色も好みの色を簡単に指定できるので、CSS を書く必要は凄く楽です。
メニューの表示が綺麗
Cocoon の時は上部のメニューを綺麗にプルダウンで表示させるために、色々と CSS の書き方を調べて苦労して実装してたけど、THE THOR(ザ・トール) であれば、デフォルトでこんな感じで表示してくれて何もイジる必要が無いくらいいい感じ。
最後に
ブログを始めた当初は有料テーマにお金を出すのは意味が分からないと思ってたけど、約１年半ブログをやってきてから有料テーマを使ってみると、有料テーマの使い勝手の良さを考えると十分価値はあるなと思いました。
有料テーマは色んなところから出てるけど、有料テーマはサンプルページが用意されているところが多いので、自分好みのデザインを採用されている有料テーマがあれば、そこのテーマを購入するば簡単にブログデザインがかっこよくなるのでオススメです。
私のブログデザインが良いなと持っていただけば場合は THE THOR(ザ・トール) を購入しておけば問題ないです。
ブログを１から作るやり方は以下に纏めています。写真ブログをやりたい人の参考になれば。