ほうこうレポート

ほうようポケモン、こうもりポケモン。

【はてなブログ】デザインCSSの内容が急に消えた!原因は文字数上限にあり


はじめに

はてなブログのデザインCSSをいじっていた時のこと。
急に思わぬ変更でレイアウトが崩れた!

慌てて見直すと、CSSの下の方が急に消滅していました。


その理由がわかった報告記事です。

CSSの書き込みが消える?

まずは症状を整理。

新しいCSSを入力して、「変更を保存」を押すと
以下のようにCSSの後ろが途切れてしまう、というのが今回の悩みでした。


CSSの文字数上限

結論から言うと、
「CSS欄には文字数に上限がある」
ことが原因でした。

最初僕は行数制限だと勘違いして、見やすさを犠牲に行間を消しては効果がなく首をひねったりしていました。

はてなブログ公式によると、
64KiBまで読み込み可能、それ以降は切り捨てる
とのことでした。
要するに、CSS欄に書けるのは65535文字まで、ということです。
(全角=2文字、半角や改行=1文字)

まぁそんなにCSSを書くことは普通ないわけですが、僕はCSSの勉強をしていないのに色んなサイトからばかすかCSSを引っ張ってきてキメラ合成をしていたため、文字数が多くなってしまっていました。

解決できないか?

困るので解決策を探ります。

テーマショップを使う(失敗)

はてなブログにテーマショップってあるじゃないですか。
あれって要するに、他の人が書いたCSSを呼び出して自分のブログに使えるよというものなわけですが
呼び出すとデザイン欄のCSSには呼び出す文章一つが書かれるんですよね。

→これって、テーマショップが外付けCSS文字列タンクになってくれるのでは??


と思い、自分のブログのCSSをテーマショップに投げつけました。



非公開で保存して、自分のテーマをプレビューしてインストール。

これでいけるんじゃないか……?と思いながら、超過する分のCSSを張り付けました。

普通に消えました。

失敗。


どうやら、テーマショップからダウンロードしてきたCSSも展開されてから文字数としてカウントされるみたい。
ずるはできませんでした。

なるほどそのために非公開のテーマがあるのか!
とめちゃくちゃ納得したのに失敗して納得がいかない。

ブログのシステムに救済措置はないか?(なかった)

最初検索したときに、この公式記事がヒットしました。

曰く、「64KiB以上になった場合は『ファイルアップローダー』を使え」と。
外付けCSS文字タンクできるじゃん!
と思って探したんですが

ありませんでした


ファイルアップローダーは、企業向けサービスである「はてなMedia」限定機能らしいです。

もしこのブログを見ている企業の方がいたら、はてなMediaを契約すれば解決です。おめでとうございます。
我々一般市民にはそんなものは手が出ないので、失敗。

CSSを消す

結局一般市民には、上限突破の方法はないようです。
新しくCSSを消すには、64KiBを切り詰めるしかないわけですが

要らないCSSを探すよりはいい方法がありました。
コメントを消すこと

プログラミングをするときは必ず、それが何の意味を持つプログラムなのかコメントを残します。
しかしコメント自体はプログラムの動作には全く関係しません。
日本語で書いていると全角で2文字消費することもあって、コメントをなるべく消すことで文字数を捻出できました。
どこか別の場所にコメントごと取っておけば最悪困りません。

おわりに

結局手段はありませんでした、というのが結論で申し訳ないです。
これもはてなブログの陰謀。許せない。