当ブログのテーマを変更しました。

ブログのテーマをCocoonに変更したいのでやったことなどをかいておこうと思います。

ブログのテーマを変更した理由
テーマを変更するとサイトが崩れる？
記事の修正
見た目の調整
アクセス解析関係
functions.php
まとめ

ブログのテーマを変更した理由

昔つかっていたテーマはうまく動作しない部分があったり、プラグインなどの追加で管理がめんどうなところもあったのでCocoonに変更しました。

Cocoonはテーマ側でほぼほぼほしい機能が実装されているので余計なプラグインを入れなくてよいので便利です。アフィリエイトとかアクセス解析とかもコピーして貼り付けて設定を保存するだけなのでコードを直接貼り付けたりする必要がないのが良いです。

テーマを変更するとサイトが崩れる？

テーマを変更するとCSSとかなにも書いてない状態になるので前のサイトの見た目に近づけようと思ったら、いちから子テーマにcssを書いていく必要があります。なので結構手間はかかります。

cssだけならまだいいですが、今回は昔使っていたテーマでsyntaxhilighterプラグインを使っていたのでそのプラグインが[py]のようなショートコードでコード本文を囲むものだったのでこれを修正する必要がありました。今回採用したCocoonの場合は「hilight.js」がテーマに組み込まれていて設定を有効にするとコードがシンタックスハイライトされます。

ただコード本文は<pre>タグで囲まなければならないので、前つかっていたショートコードを<pre>タグにする必要がありました。

記事の修正

さきほどのような修正をする場合、記事本文を置換できるプラグインが必要になります。プラグインは2つ使いました。

search regex
Better Search Replace

search regex

search regexは正規表現で本文を検索して置換することができます。ですがなぜか置換文字列にスラッシュが含まれているとエラーが発生して置換できませんでした。結局原因はわかりませんでした。なので代替えとしてBetter Search Replaceを使うことにしましたが、代わりに使ったというよりも、さきほどのようにエラーが発生するとこだけ使ったという感じで２つのプラグインを同時につかった感じです。

Better Search Replace

Better Search Replaceは正規表現はつかえませんがwordpressの記事本文の置換をすることができます。

ただ注意点としてこのプラグインはデータベースの選択が必須になっていてwordpressのデータベース構造がよくわかっていない人が使うのはちょっと危険です。しかしある設定のチェックを外さないと置換されないよになっているので、間違って置換してしまったということにはならなそうです。

修正後の確認作業

置換してうまくいったかどうかは実際に記事を見てみないとわからない部分があります。ですので記事のチェックはしないといけないと思いますが、時間がかかるので実はこの記事書いている時点ではまだやっていません。

見た目の調整

昔のブログとあまり見た目が変わらないようにするにはCSSを修正したあと新しいブログと旧ブログの見た目を比較する必要があります。

わたしの場合は完全に見た目は同じでなくてもあらかた一緒だったらいいなとおもったので、あまり手間はかけませんでしたが、WordPressをローカルで動かせるlocal by flywheelというソフトを使ってそっちでデバッグを行いました。

とはいえlocal by flywheelはたしかに簡単なんですが導入がめんどうなのとソフトの容量が大きいのでディスクの容量を食ったりもしますし、なにより手間と時間がかかるのであまりいいことばかりではありません。旧ブログの見た目にちかづけるにはなんらかのでデバッグは必要だと思いますが、こだわりがなければ、新テーマの見た目そのままでいくというのもありかもしれません。