[Blogger]「シンプル」テーマ をレスポンシブ化する

前にエントリした

• [Blogger]レスポンシブ化された「シンプル」テーマ

は Simple (Bold) の紹介の様になっていましたが(ダウンロードできるテーマは実際にそれだけ)

以下に「シンプル」テーマ をお手軽にレスポンシブ化する方法が書かれています

</head> 前(上)に以下のコードを追加

<style type='text/css'>
body {
min-width: 280px;
}
.content-outer, .content-fauxcolumn-outer, .region-inner {
min-width: 280px;
}
img {
max-width: calc(100% - 10px);
height: auto;
}
.separator a {
margin-left:0 !important;
margin-right:0 !important;
}

@media only screen and (max-width:768px){
.main-inner .columns {
padding-left: 0;
padding-right: 0;
}
.main-inner .fauxcolumn-center-outer {
left: 0;
right: 0;
}
.main-inner .fauxcolumn-left-outer {
width: 0;
}
.main-inner .fauxcolumn-right-outer {
width: 0;
}
.main-inner .column-left-outer {
width: 100%;
margin-left: 0;
right: 0;
}
.main-inner .column-right-outer {
width: 100%;
margin-right: 0;
}
.main-inner .column-center-outer {
margin-bottom: 25px;
padding-bottom: 25px;
border-bottom: 1px solid #eeeeee;
}
}

@media only screen and (max-width:480px){
body {
padding: 10px;
}
.main-inner .column-center-inner {
padding: 0;
}
.main-inner .column-center-inner .section, .main-inner .column-left-inner .section, .main-inner .column-right-inner .section {
margin: 0;
}
}
</style>

Download Template Default Blogger Versi Responsive Terbaru - Blog Deaky
http://deaky.my.id/template-default-blogger-responsive/

続いて
以下の <meta> タグを

<meta expr:content='data:blog.isMobile         ? &quot;width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0&quot;         : &quot;width=1100&quot;' name='viewport'/>

<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>

Download Template Default Blogger Versi Responsive Terbaru - Blog Deaky
http://deaky.my.id/template-default-blogger-responsive/

に書き換えるだけ