SyntaxHighlighter モバイルテンプレートでの表示
"BloggerでSyntaxHighlighterを使う"を書いた後に気が付きましたモバイル環境でモバイルテンプレートを使っていると、SyntaxHighlighterがうまく機能していない
ハイライト表示されていないです
前は綺麗に表示されてた気が…
以前と違うことと言ったら、"autoloaderを使う"と"ガジェットを使う"の２つ
その辺りから調べてみると原因はガジェットであることがわかりました
モバイルテンプレートではデフォルトの設定で表示されるガジェットは6種類です
-> Introducing custom mobile templates | Blogger Developers Network
「ヘッダー」「ブログの投稿」「プロフィール」「ページリスト」「AdSense」「帰属」と書いてありました
そういえば、モバイルのページってアーカイブとか出てないなぁと納得
以上の理由から、SyntaxHighlighterの設定で新規に作ったガジェット「HTML/JavaScript」は読み込まれていなかったのです
原因がわかったので次は対策ですが、それについても記載されてました
6種類以外のガジェットをモバイルテンプレートで表示するにはテンプレートを編集すればいいらしいです
目的のガジェットの要素を見つけ、開始タグにモバイル属性を指定します
指定できる属性値は4つ
- yes - PC、モバイル両方で表示する
- no - PCだけ表示する
- default - デフォルトの設定に従う
- only - モバイルだけ表示する
今回は、HTML/JavaScriptのガジェットをPCとモバイルで表示したい（機能させたい）ので「yes」を指定する
テンプレート -> HTMLの編集 -> 「ウィジェットのテンプレートを展開」にチェック
-> HTML/JavaScriptのガジェットを探す
ガジェットにタイトルをつけていないなら「HTML1」とか
<b:widget id='HTML1' locked='false' mobile='yes' title='' type='HTML'>あとは使用するモバイルテンプレートはカスタムを選択する
モバイルテンプレートでの表示に関しては以上です
僕はアンドロイドのブラウザはFirefoxβを使っています
コードの見切れている部分はスワイプして（スクロールのほうが正しいかな）見ることが出来ます
Bloggerのモバイルテンプレートは画面の端にスワイプするとページが切り替わる仕様になっていて、かなり鬱陶しいので無効にしました
いまは、コードの部分だけスワイプできます
個人的にはこれで満足なんですよ
ここまでで十分なんです
ですが、これはアンドロイドのFirefox、しかもベータ版での話
おそらく、普通のFirefoxでも問題ないと思いますが一般的にはどうなのよ？
標準ブラウザではコードの部分はスワイプしません
見切れたままです
何かしら対策をと思いましたが、またの機会にします
(；´Д｀)
