超高速テーマ「Godios.」に変更しました【カスタマイズ有】

ついにテーマを変更しました!

長い間、2013年とかのStinger3をずっとずっと使ってきました。
カスタマイズにもそこそこ時間を掛けてたし、TOP画像のサイズもStingerの幅に調整して書いてもらっていたため、過去の遺産を捨てきれずにいました…

ずっと騙し騙し使ってきたのですが、かなり重くなってきたのとレスポンシブデザインにすら対応していなかったので、思い切ってテーマを変更する事にしました。
(思い立ったのが今年の春くらい…)

で、お盆休みの期間を使って、以前から少しずつテスト環境で移行してきたものに対して一気にカスタマイズを行いました。

Godios.とは?

はやいWordpressテーマです。
何がはやいかというと、サイト内のページ遷移。

最近の投稿とか、下記リンクとかを適当にクリックしてみてください。

旧TOP画像

早くないですか?
これでもWEBサーバー(kusanagi)に割り当てているスペックをStinger3の頃の半分にしています。
(CPUを4スレッド→2スレッドに減らしました)

テーマに使われている、非同期画面遷移の力で以前よりもずっと早いページロード等が可能になっています。

なぜ非同期画面遷移だとはやいの?

理由は単純で、通信量を少なくする事ができるからです。

通常のページなら、すべての情報を更新します。
ですが、赤枠部分は本当に毎回更新する必要がある情報でしょうか?

Godiosは、ページ遷移をjavaScriptの非同期通信技術を使って擬似的に行っています。

つまり、通常のページ遷移で行うリクエストを投げず、裏でJavaScriptが通信して、メインコンテンツの部分だけ読み込むように細工がしてあるのです。

もっと詳しい技術的な話は、作者がGitHubに載せていた気がします。
気になる方はググってみてください。

どこで手に入るの?

godios.

ここから手に入ります。
4月頃有償化されたようで、今だと5000円くらい掛かりますね。

私がサイト移行を始めた3月頃は、無償で公開されていました。

GPLライセンスなので、個人的にデザイン等を修正して再配布する事も可能ですが、おそらくそんな余力は無い気がします…
※WordPressのテーマはPHPに関しては、必ずGPLライセンスが適用されます。
 また、Godiosは下記のように100%GPLライセンスを謳っているので、jsやcssに至るまで、GPLライセンスの元改変・再配布を行えます。

このテーマのご利用について
商用、非商用問わずどのようなサイトにもご利用いただけます。

動作環境についてはダウンロードページをご覧ください。

ライセンスについて
本テーマは100%GPLを適用しています。

利用規約|Godios.より

note等で流行っている有料記事にも興味があるので、当ブログにもデザインの情報とか有意義なものを書いて有償化したいですね…。
いつかはKixiもWPテーマでも作って有料で配布したい…。

どこをカスタマイズしたの?

cssだけでいけるかと思いましたが、思ったより複雑だったのでほぼ全てphpからカスタマイズしました。

ウィジェットの新着記事にサムネイルを対応させました。

godios 新着記事

重くなる要因だとは思うのですが、Stingerの頃からそうしていたので、逆に居心地が悪くてやってしまいました…。
慣れて無い事もあって、カスタマイズにはそこそこ時間が掛かりました。

画像に直指定してあるWidthとheightが聞かない事件等がありました。

ワンサイズ上の広告がキレイに入るように調整しました。

Godios. 広告サイズ変更

赤枠の通り、ウィジェットのサイズギリギリにデフォルトよりワンサイズ上の広告がキレイに収まるようにカスタマイズしました。
これだけで見栄えは良くなるし、収益も上がる(気がします)。

人気記事一覧を追加しました

godios 人気記事

以前からのアクセス数を表示したかったので、重くなるのは承知で入れました。

関連コンテンツに対応させました

非同期エリアに入れる必要があったので、多少苦労しました。

Google AdSenseを非同期で読み込むようにしました

スマホでは、スクロール時、PCでは通常通り読み込まれるように修正しました。
※PCではトップビューですが、スマホの場合はメインコンテンツの下にサイドバーが設置される&アンカー広告は少しスクロールした後で出てきても困らないのでそうしました。

読み込み速度が上がるように整理しました。

jsの読み込み順序を整理&無駄な呼び出し箇所等を削除しました。

カスタマイズ後の速度は?

カスタマイズすれば重くなるのが道理ですが、画像を多様しつつ、なるべく重くならないように考えて構築しました。

PC表示時の速度

godios. PC表示時 速度 97

97ポイント

モバイル表示時の速度

godios. スマホ表示時の速度 94

94ポイント

かなり高速な部類だと思います。

ちなみに、何も対策しなければモバイルは40点台、PCは70点台くらいでした。

カスタマイズの難易度

他のテーマより、ソースと仲良くないとカスタマイズは難しいかもしれません。

非同期技術が使われているので、きちんと表示されているようでも遷移が発生すると想定外の動きをする事もあります。

困ったのが、AmazonJsで、表示する画像を恐らく記事内にBASE64的な感じで埋め込まれているようなのです。
当然非同期遷移すると、埋め込み画像が存在しないので、表示されません。

プラグインに手を入れようと思いましたが、別のプラグインで丁度よいものがあったので、そちらに乗り換えました。

最後に

素晴らしいテーマなのですが、プラグイン等との相性問題があるなど、非同期遷移の代償も少なからずあります。
しかし、それらを理解して使うのであれば、かなり良いテーマです。

自分でカスタマイズできる人は、買っても良いと思います。
godモードをOFFにするくらいなら、別テーマで良いと思います。

それでは!