2015年2月5日木曜日

bloggerのモバイルテンプレート編集覚え書き

このブログやDQ10日記も含めて、現在稼働中の私のブログはgoogle先生の無料ブログサービス「blogger」を使っています。
無料の割に結構いろんなことが出来て重宝しているのですが、モバイル表示のカスタマイズが中々手を出しにくい状態となっていたので、今後の作業をスムーズにするための覚え書きとして投稿。

今ではブログの閲覧はPCからのアクセスよりスマホやタブレット端末からのアクセスのほうが多くなっています。現時点ではPC/PC以外の比率はちょうど半々ぐらいですが、そのうちPC以外からのアクセスのほうが主流になるのでしょうな。
私なんかは家でがっつりPCの前に座ってブログやホームページを書いている側なのでついつい忘れがちなのですが、そろそろ真面目にモバイル環境からのアクセス対策も真面目に考えねばなーというのをちょっと思いまして。
もっと言うと、最近DQ10日記などに導入して雀の涙にもなっていないような広告の成果がもう少しでも上がればなと思いまして。下世話な話です。

DQ10日記への広告導入は、あまりにも日記の更新意欲が下がりすぎていて、ちょっとでも更新頻度上げようよという自分に対する追い込みの意味合いがあったのですが、その目論見通り日記の更新頻度はしっかり上がりましたので、この調子で継続させていきたいところ。
ここの日記もちゃんと更新しよう(何度目だその発言)

さて、肝心の今回手を入れた部分についてですが、これは私以外にはどうでもいい情報だと思うので、適当にメモだけ残しておきます。 

■ウィジェット単位で表示を制御する手順
・テンプレートの設定画面で「カスタム」のテンプレートを選択しておく
・テンプレートのhtml編集画面で、編集を加えたいウィジェットのタグを書き換える

※ウィジェットタグの編集例
 <b:widget から始まるタグの部分。
 「mobile=’yes’」を書き加えるとモバイルでも表示される
 「mobile=’no’」を書き加えるとモバイルでは表示されない
 「mobile=’only’」を書き加えるとモバイルのみ表示される(PCレイアウトでは表示されない)

※「mobile=’only’」の記述を加えるとその後はレイアウトメニュー画面の変更保存ができなくなる模様。レイアウトを弄る必要がある場合は、only表示を一時解除しておく必要がありそう。

参考URL:Bloggerでのhtmlをいじってのモバイル表示の変更 | 寿司はえんがわ。~Engawa RotMG ブログ~