Bloggerのサイトをスマホなどで見ると、URLの後ろに?m=1が自動で追加されて、モバイル専用テンプレートを読み込みます。
テンプレートのモバイル画像の下にある歯車ボタンをクリックし、
いいえ。携帯端末で PC テンプレートを表示する。を選択してスマホで見たときに、サイドバーのレイアウトが崩れてしまったため、
はい。携帯端末でモバイル テンプレートを表示する。を選択して、モバイルテンプレートを選択で「カスタム」を選択して、HTMLの編集でサイドバーに設置しているウィジェットを表示させるようにしました。
<b:section class='sidebar1' id='sidebar1' preferred='yes'>サイドバー丸ごと表示できれば簡単だと思ったけど、これではだめだったためウィジェット単位で表示させた。
それぞれの後ろにmobile='yes'を追加すると携帯（スマホ）で見たときにもウィジェットが表示される。それぞれのIDは、このブログの場合の例です。わかりにくい場合はtitleで探したほうが見つけやすいこともあります。
例えば、サイト内検索（ガジェットのタイトル）を探すときに、「CustomSearch」で検索するのではなく「サイト内検索」で検索するといいかも。
サイト内検索
<b:widget id='CustomSearch1'
最新の記事
<b:widget id='Feed1'
忍者まとめ
<b:widget id='HTML8'
人気記事
<b:widget id='PopularPosts2'
AdSense（サイドバー）
<b:widget id='HTML3'
AdSense（メイン下）
<b:widget id='HTML4'
AdSense（メイン上）
<b:widget id='HTML2'
変更後のHTMLはこのようになります。
これで、スマホなどで見たときも、記事の下にサイドバーが表示されるようになります。
モバイル表示の確認方法
実際に、スマホなどの携帯端末でアクセスする方法のほかに、URLの後ろに?m=1をつける方法とBloggerのプレビュー機能を使う方法や、GoogleChromeの拡張機能を使う方法があります。URLに?m=1を追加
このブログのトップページを確認する場合は、http://www.memorou.com/?m=1となります。Bloggerのモバイルプレビュー機能
テンプレートのモバイル画像の下にある歯車ボタンをクリックします。
QRコードの下のプレビューボタンを押すと、スマホサイズのウィンドウが開き確認できます。
GoogleChromeの拡張機能を使う
Chromeの「User-Agent Switcher for Chrome」という拡張機能を使ってiPhoneやAndroidで画面の確認ができます。参考：パソコンでスマートフォン（スマホ）表示の確認
スポンサーリンク
