ブログテンプレート、壊れました

業務外

告知

現在、PC用のWebバージョンのブログテンプレートが壊れて、レイアウトが崩れております。保守担当の頑張り次第ですが、少々お待ちください。右サイドバーにトップメニューリンク他が移動してます。

なお、モバイルバージョンもデッドリンク調査が途中で、一部コンテンツが参照できない、中途半端な状態になっています。こちらも対処します。

ちょっと体調崩して、現在井戸掘り休止中です。
暖かくなる頃には再開したいな。

---

経緯

Bloggerの管理ツールを使ってますが、相変わらず使いにくい。ブログを開設した2014年頃に比べれば、バクは少なくなりましたが、UXは古いままです。ところがこの完了ツールの新規バージョンが段階的にリリースされるそうです。良かたい、良かたい。

既に幾つか、動かせるようなので試してみました。テーマ設定です。

新しいBlogger管理ツールが
リリースされました

一方、ブログテーマも第2世代版がリリースされているようです。ふーん。

ブログテンプレートの第2世代が
リリースされました

管理ツールとブログテーマが同時にバージョンアップされたのですね。

テーマをバージョンアップすると、カスタマイズ箇所が消失するようです。まあ危ないから止めときましょう。

管理ツールだけ、バージョンアップしてお試ししましたがまだ不安定のようです。戻しましよう。ここでボケました。何故かツールの表示上、テーマが第2世代にバージョンアップされていたようです。勘違いかも知れませんが…。
管理ツールを戻すつもりがテーマを戻してしまったようです。進めてないのに戻すのも変ですが。

結局、バックアップも取らずに操作してしまい、テーマが初期状態に戻ってしまいました。
ヤバいなー、でも以前取ったテーマのバックアップがあるからいいや。テーマを戻して動作確認です。

壊れてます。笑い

なにこれ？ブログが壊れています

何度やってもバックアップから復元出来ません。最低…。

とりあえず、第2世代の初期状態のテーマを設定しました。右サイドバーにトップメニューが付いた、クレイジーなデザインです。

Webバージョンのテンプレートを復旧しましたが
崩れています

---

2020年1月12日（日）

PCからブログテンプレートの回復に挑戦しています。まだ、不完全ですが、トップページリンクとか、復旧しました。

Webバージョンのテンプレートが復旧しました

しかし、今度はモバイルバージョンのテンプレートが壊れました。笑
トップページリンクも反映されません。第2世代テンプレートはダメだ。

モバイルテンプレートが適用されていません

くそー、ふて寝します。

---

2020年1月13日（月）AM

管理ツールを旧世代に戻して、テーマも第1世代の『シンプル』を選択したら、モバイルバージョンもいい感じで復旧してきました。

Webバージョンでは有効なCSSが、モバイルバージョンに当たりません。うーん、テンプレートのカスタマイズ全般が無効になってきますね。

モバイルバージョンのカストマイズを有効化するには、何かおまじないが必要だったはず。ブログを確認したけど見つからない。ネット検索して参考記事をみつけました。モバイルバージョンのテーマ選択でカスタムの選択でした。
これでモバイル画面にカストマイズが反映されました。

モバイルテンプレートの
カスタマイズを有効にします

モバイルテンプレートに
カスタマイズが反映されました

残るはブログタイトル部です。ここも初期化されています。

---

2020年1月13日（月）PM

ブログタイトル部はテンプレートをカストマイズして、エンブレムの画像の追加と改行位置を調整しています。テンプレートを確認すると、CSS と JS へのカストマイズがリセットされています。バックアップから手編集で復旧させます。復旧手順は以前のブログ記事を参考にします。

	2018年9月12日水曜日
	ブログタイトルの改行

こちらも直しましょう。モバイルバージョンのアーカイブリストが開きぱなしの件です。こちらはバックアップを取り忘れていました。幸いブログ記事に修正内容の記録がありました。良かたい。良かたい。

	2019年6月26日水曜日
	Blogger ブログ アーカイブの修正

ブログテンプレートの修正完了です。ここでモバイル画面を確認するとモバイルバージョンのテンプレートが壊れています。1月12日に戻りました。笑
モバイルテーマをいったんPC用に切り替え、再度モバイルバージョンのカスタムに変更します。どうじゃ！！

だめです。何度やっても、復旧しません。ぐぬぬ…。

Webバージョンのテーマを『シンプル』を選択し直したらモバイルバージョンのテンプレートが復旧しました。さて、モバイル画面を確認するとカストマイズが中途半端です。エンブレムの画像サイズが調整されず、アーカイブリストは開きっぱです。
ブログテンプレートを確認すると JS は反映されていますが、CSS がリセットされています。何度か繰り返しましたが、どうやら、

• ブログテンプレートをカストマイズするとモバイルバージョンの画面が壊れる。
• 壊れたモバイルバージョンの画面を復旧するため、テーマを選択し直しすとブログテンプレートのカストマイズがリセットされる。

ダメだこりゃ。ブログテンプレートのCSSのカストマイズを正しく認識してないようです。header、script、bodyへのカストマイズは大丈夫なようです。なんか、遥か昔に同じような事象を経験した覚えがあります。

管理ツールの不具合だと思いますが、今時点でブログテンプレートにCSSを組み込むのは無理です。うーん…。

ピコーン！！　閃きました。
テンプレート不具合の暫定処置として CSS を切り出してガジェット化すれば良いはず。コピペして、ちょいちょいとガジェットを作成しました。どうじゃ！！

テンプレートの修正をガジェット化しました

アーカイブリストは閉じるようになりました。エンブレムの画像はリサイズされません。なんで半分だけ失敗するんだろう。原因は？

少し疲れてきました。泣

---

2020年1月13日（月）MN

テンプレートにガジェットが正しく組み込まれているのか確認にしてみましょう。
ダメです。エンブレムの画像サイズがテンプレートに反映されていません。なんでだよ！！怒

念のため、暫定処置用のガジェットを確認します。ありゃ、コピペミスしたみたい。ガジェットに画像サイズが組み込まれていません。笑

ガジェットに画像サイズのCSSをコピペし直しました。

ブログテンプレート、修復完了

やー、やー、やっとブログが復旧しました。

一応、見られるレイアウトにはなりましたが、ブログテンプレートのカストマイズは全部見直さないとダメですね。
とりあえず、syntaxhighlighterが無効化されているのに気が付きました。まだまだ、修復に手がかかりそうです。

感想と構想

リカバリ手段でリカバリできない、最低の状態です。
手元にPCがなく、スマホ操作ではここが限界です。

井戸掘りも停滞中で、申し訳ないです。笑

---

モバイルバージョンのカスタマイズ反映は、以下の記事を参考にさせていただきました。

Bloggerのテンプレートをモバイル端末対応にしてデザインの自由度を格段にアップさせる方法
http://blogger.weblix.net/2012/06/blogger-mobile-template.html

---

ブログテンプレートの回復は、以下の記事を参考にさせていただきました。

Bloggerのテンプレートが壊れた時の対処法
https://blogger-memoblog.blogspot.com/2018/08/blogger-format.html

環境が完全に壊れるのが怖くて、実際は試せませんでした。

記事を参考にして試したのは以下です。

Step1. ダミーの新規ブログを作成

Step2. ブログテンプレートのリストア

Step3. 破損前のブログテンプレートのHTMLの確認

Step4. 復旧用資材の切り出し

バックアップ済のカストマイズは、これで比較的簡単に復帰可能でした。バックアップしたHTMLファイルはプレーンテキストなので、エディタ等で直接参照しても見辛く、利用は無理でした。

このダミーの新規ブログのHTML全体を壊れたテンプレートと差し替えれば良かったかもしれません。ただ、レイアウトの配置のバックアップを取っていなかったので、不完全な状態です。これで一気にリカバリする度胸はなかった。笑