Luxeritasテーマで子テーマのバージョン更新

2017/10/03

Luxeritasもそうですけど最近のWordPressテーマはGoogleの仕様変更なども頻繁ですし、それに合わせて更新が頻繁です。もちろんさまざまな利便性向上などもあります。テーマのユーザーカスタマイズやユーザー設定が更新ファイルで上書きされないために親テーマと子テーマとを分けて、親テーマには個人設定を入れないで子テーマに常に設定項目を挿入することで主な更新は親テーマ側の更新だけにして、親テーマをアップグレードして上書きしていくことで新たな機能をテーマに装備できます。

親テーマの更新ファイルを上書きするだけですから実に簡単です。
Luxeritas Update Themeというメンテナンス中という表示をしてくれる便利アップグレード用のファイルまでLuxeritas公式で用意されています。FTPソフトで上書きでも良いですがアクセスの多いサイトならLuxeritas Update Themeを使う方が親切です。私のサイトはそれほどアクセスも無いのでFTPで上書きしちゃっていますけどLuxeritasは更新も頻繁でたびたびアクセス不能になるのは良くないでしょうからね。

子テーマの更新

親テーマのファイルを直接に変更したりした時も親テーマの更新でLuxeritas Update ThemeやFTPでの場合でもそっくり入れ替わってしまうから変更したところをまた新しい親テーマに加えてあげる必要があります。

そういう手間の無いように子テーマがあるわけですが、親テーマの更新にも慣れて「今度は子テーマも更新か」って思っていると子テーマには過去に行った設定が無いか確かめる必要があります。新しい子テーマで上書きしてしまうと全て設定が消えて、すっぴん状態に戻ります。すっぴん状態の子テーマなら親テーマと同じく新しい子テーマに入れ替え、もしくは上書きで大丈夫です。

カスタマイズはファイルではなくテーマ上から行う

知識のある方はテーマのファイルをダウンロードしてエディタでカスタマイズやテキスト挿入とかしてまたアップロードしてカスタマイズします。何をしているのかわかっていれば覚えてもいられるのでしょう。私にはとても無理です。子テーマのどこかファイルをカスタマイズしたとしても調べて書かれている通り行うという場合が多くて知識が無いので何をしているのかわかっていません。ただ子テーマにしてもいずれはファイル更新の必要が出てきます。その時はどのファイルのどこをカスタマイズして新しい子テーマにも同じカスタマイズしないとカスタマイズじたい消えてしまいます。ですからなるべくダッシュボードからカスタマイズした方が新しい子テーマにした時にその古い子テーマにしたカスタマイズに戻すのも楽です。ファイルに直接カスタマイズはより慎重にやらないと最悪WordPressじたいにアクセス出来ない事態も起こりえます。

カスタマイズとか設定とか調べたりGoogleさんの命令通り行ってきていてさっぱり意味が分かっていないので自分のサイトで子テーマ部分の変更は多分ダッシュボード上からしか行っていないと思います。ただ現在の子テーマもかなり前から更新していないわけでして、「何かしら設定でファイルに直接書き込んだことがあるかも?」という疑念があるのですけれど、それはあきらめましてとりあえず子テーマもLuxeritas Child Theme 2.0.0というバージョンに変えます。「2.0.0」というバージョン名はすぐにまた新しいバージョンが来そうですから子テーマも必ずダッシュボード上でカスタマイズするということを徹底する必要があります。全て覚えていたりメモしておいたりすればいいのかもしれませんけど、メモの場所も忘れてしまうことが多いので、ダッシュボード上からのカスタマイズだけにしていくつもりです。何かファイルを編集しないとならない場合はダッシュボード→子テーマの編集のどれかのタブにその行った編集を書いてコメントアウトするのもいいのかもしれません。

新しい親テーマと子テーマをダウンロード

Luxeritasサイト https://thk.kanzae.net/wp/ へアクセスします。一番上に並ぶナビで「リリース情報」で自分のブログサイトのテーマより新しいものがあったら「リリース情報」の右横の「ダウンロード」をクリックしてダウンロードページからダウンロードします。

luxeritas親テーマ解凍前ファイル
Luxeritas 2.3.2が現在最新でした。私はLuxeritas 2.3.1しかまだ利用させてもらっていないのでダウンロードしました。

luxeritas親テーマ解凍後ファイル
全て展開するとluxeritas-232と言うフォルダが出てきてその中に「luxeritasフォルダ」があってこの「luxeritasフォルダ」をサーバーにアップロードします。

luxeritas232親テーマフォルダ
サーバーの方にも同じ「luxeritasフォルダ」があるので上書き保存していきます。上書き保存中にいつも1度くらい止まってしまいますが上書き保存を続けるようにクリックして全部上書きします。

子テーマ更新の準備として子テーマの設定をコピーしておきます

さて今回は子テーマも更新します。デザインやマウスオーバーでリンク色を変化させたり程度のスタイルシートの編集、google analystic用の通知設定などわりと子テーマ編集を行っているので上書き更新する前にこれらをコピーしておきます。

ダッシュボードからLuxeritasメニューの子テーマの編集をクリックする画像
ダッシュボードから「luxeritas」メニュー内の「子テーマの編集」をクリックします。

ここからは各自のやり方次第ですが子テーマ編集ページにおける各タブに編集した部分があれば保存していきます。キャプチャーでもいいですが画像から見て新たに書いていくとミスも起きるのでメモ帳に保存していきました。もっと正確にはPHPやJavascript設定されたエディタの方が安心です。

私は幸か不幸かPHPやJavascript編集なんてことはできないのでメモ帳で済ませました。

子テーマの編集のスタイルシートタブの編集部分をコピーする
子テーマの編集ページを表示させたら編集されてあるタブを表示させていきます。これは自分で行っているものでデフォルトだとphpタグで囲まれたコメントアウトされたテキストだけなのでその下に自分で挿入した設定をメモ帳の保存していきます。この辺は自由に行いやすいようにやれば結構です。とにかくご自分で設定したものが消えてしまうのでいったん待避させておくだけのことです。私の場合は「スタイルシート : style css」タブにh1タグなどデザインカスタマイズを入れてあったので設定した部分だけ全てコピーします。コメントアウト部分の元からある文字は必要ありません。

メモ帳にスタイルシート編集部分貼り付けた画像
メモ帳を新規作成してコピーしたスタイルシート編集部分を貼り付けます。スタイルシート編集部分を貼り付けたメモ帳を分かるようにstylecssというファイル名にして保存します。デスクトップでもドキュメント内でも分かるところで良いのですが「子テーマの編集」というフォルダを作成しその中に保存しておきました。
子テーマの設定部分をコピーしたテキストを入れるフォルダの画像

Headタグにも編集設定があったのでこれもメモ帳にコピーして「Headタグ」というファイル名にして「子テーマの編集」フォルダに保存しました。

「子テーマの編集」の各タグを全て見て設定があるタブをメモ帳のファイル名してコピー&ペーストして「子テーマの編集」フォルダに保存です。もし自分で直接に子テーマのファイルを編集したのなら編集部分をコピーして同じように残しておく必要があります。

子テーマluxechの設定

luxeritas子テーマluxech-200zipファイルの画像
ダウンロードした子テーマzipファイル「luxech-200」を全て展開します。展開すると「luxech-200」フォルダが出来ます。

FFFTPでluxech-200子テーマをアップロード上書き保存する画像
FTPソフトで親テーマと同じように上書き保存します。今回は「luxech-200」フォルダ内のLuxechフォルダをアップロードします。これをアップロードするとサーバー側に上書きされるので子テーマの編集でされた設定が消えるので一応全てコピーしてあるか確かめたほうが安全です。

全て上書きアップロードしたらまずサイトが表示されるか確認します。

LuxeritasのデフォルトH2タグとH3タグの表示画像
H2タグとH3タグもデフォルトに変わってしまっています。

ダッシュボードから「luxeritas」メニュー内の「子テーマの編集」を確認します。

ダッシュボードからLuxeritasメニューの子テーマの編集ページを開いた画像
ダッシュボードから「luxeritas」メニュー内の「子テーマの編集」を表示させて「スタイルシート : style.css」タブを開くと見事にコメントアウトしかありません。ダウンロードした新しい子テーマをアップロードしたので当たり前ですけど。

子テーマの設定部分をコピーしたテキストを入れるフォルダの画像
先ほど保存しておいた「スタイルシート : style.css」の設定した部分をコピーしておいたファイルを開きます。子テーマの編集と私が勝手に命名したフォルダにこれもまた私が命名したstylecss.txtにコピペして保存してあるのでstylecss.txtを開きます。

stylecsstxtメモ帳内容をコピーする画像
設定内容がコピーしてあるのでもらさず選択してコピーします。

子テーマの編集ページで変更し保存をクリックした画像
「子テーマの編集」ページの「スタイルシート : style.css」タブにコピーした設定を全てペーストしたら忘れずに「保存マーク」をクリックします。

子テーマの編集保存した時に出る表示の画像
「変更を保存しました」という表示を確認します。

H2タグとH3タグのスタイル変更した画像
無事デフォルトから設定してたタグ表示になりました。
このように子テーマの編集フォルダ内にコピーした全ての設定をペーストして保存すれば子テーマの更新は終わりです。

luxeritas子テーマluxech200インストールした後の子テーマの編集タブの画像
Luxeritas 2.3.2とLuxeritas Child Theme 2.0.0をインストールしてみると子テーマの編集ページが2つに分かれていました。
これはGoogle Analyticsの変更に対応するためだとのことです。
https://thk.kanzae.net/dev/wp-themes/luxeritas/t7667/
テーマの管理開発って大変ですね。
私は新しいトラッキング コードを貼っておきました。コピペしておいたそれまで貼っておいたトラッキングコードは破棄しました。
Google Analyticsに「新しく実装する場合は、gtag.js をトラッキング コードとして使用することをおすすめします。」とあるのでアクセス解析(head)の方に貼りました。コピ-して保存していたコードを貼ろうかと思いましたが、新しい方だけにしました。Google Analyticsに「ページにすでに Global Site Tag が配置されている場合は、以下のスニペットの config 行のみを既存の Global Site Tag に追加してください。」とあるのですが、もう一つはっきりしないので全部一新したコードを貼りました。

翌日Google Analyticsを確認しましたがトラッキングは平常通りでした。Luxeritasを使っている方は新しいトラッキングコードを「子テーマ編集」のアクセス解析(head)の方に貼れば問題無く動くようです。

Posted by クチコミ探し