blogger新管理画面でQooQ、Tokyoを使う場合の注意点

bloggerの管理画面デザインが新しいのに変わりましたね。元に戻すこともできるけどなにやらおしゃれになっていていい感じ。

ただQooQやらTokyoなどのテンプレートをお使いの方に2点ほど注意点があります。

1. 新管理画面とQooQの注意点
1. 表の罫線が出ない
2. HTML編集モードの整形ボタンで写真が出ない
2. まとめ

新管理画面とQooQの注意点

注意点①「表の罫線」はQooQv1.27より暫定対応済み。下に紹介する暫定コードはv127以前を使ってる人のみコピペして使ってください。

んで注意点②「写真と整形ボタン」についてはたぶんbloggerのバグ。

表の罫線が出ない

くうく堂で配布してるbloggerテンプレートはたぶん全部だったと思いますが、表の線が表示されません。

blogger旧編集画面にはそもそも表挿入のボタンがなかったんでそれでもよかったんですが、新編集画面には表ボタンがあるんですよねー…。なぜこのスマホ全盛期にあらためて表挿入ボタンなんか追加したんだろう。

いっても仕方ないんで重い腰あげていっちょ対応するか―と思ったんですが、なんとこの表挿入、デザイン設定のためのクラスが振られていない。

bloggerって内部では今回追加された表と、以前からずっとあった写真のキャプションが同じ構造で作られてる。てことは何も考えずに今回の表についてデザインを設定すると、写真のキャプションにもモロに影響が出る、というわけ。

もうちょい待ってみて今回追加された表についてクラスが振られたら対応しようと思います。…というかスクロールもしない表をポンと追加するだけっていうのはbloggerさんちょっとどうかと思いますね。

■暫定コード

このcssを適用すると表の罫線が表示される。写真キャプションのデザインには影響なしです。

table:not([class]) td{
  border: solid 1px $(other.border);
}

table:not([class]) td{
  border: solid 1px red;
}

HTML編集モードの整形ボタンで写真が出ない

これはQooQやらTokyoだけの問題じゃなく、試したテンプレート全部（blogger公式テンプレート含む）で発生する共通バグ。

bloggerの新編集画面のHTML編集モードにはいるとソースコードの整形ボタンが押せます。これ押すと読みづらかったHTMLがよき塩梅で改行されて見やすくなるんですが、なぜかこの整形ボタンを押すと記事一覧や関連記事の表示で写真が出なくなる。

原因は良く分からないけど整形しちゃうと記事一覧などに画像データが正しくわたらなくなる…っぽい。そのうち修正されるはずなんでゆっくり待ちましょう。

■直し方

HTML編集モードから普通のエディタモードに戻して、なにかしら記事変更して保存しなおすと直るみたい。もしくは写真入れなおすと直った。

まとめ

bloggerに新しく追加されたおしゃれ管理画面でQooQやらTokyoを利用する場合の注意点を紹介しました。

ぶっちゃけ新編集画面はおしゃれなんですが、レスポンスが悪くて使いづらい。見出し選んでもワンテンポ遅れて反映されるからなんかノロノロ。

写真挿入もクリックしたところではなく記事の最後尾に入ったりとまだまだバグが多い印象を受けました。まあまだリリースしたてのほやほやインターフェースだから、もうちょいバグが落ち着くの待ってから切り替えよう。