リファインスノースマホ表示の横幅を広げる方法

リファインスノーのスマホで表示される横幅を
簡単に広く出来る方法を紹介。

どうも、どらたんです。

リファインスノーテンプレートの
スマホで表示される画面の横幅を広くする方法と言いましたが、
厳密には余白を失くしてるだけで、
幅自体は広がってないんですけどね。

ただ、余白を失くせば画像も大きく見せることが出来るので、
結構使えるかなと思います。

やり方

やり方は簡単で、

「外観」⇒「テーマ編集」⇒「custom.php」に以下をそのままコピペすればOKです。

/* スマホ表示時の余白を変更 */

@media(max-width: 640px) {
.header-bar-inner,
.banner-inner,
.glovalnavi-inner,
.container-inner,
.footer-menu-inner,
.footer-inner {
padding-right: 10px !important;
padding-left: 10px !important;
}
.gnavi-btn {
margin: 10px 10px 0 !important;
}
}

余白を失くせば失くすだけ画像を大きく見せられるので、
さらに大きくする場合は”10px”の部分の数値を下げていけば、
さらに余白を失くせます。
(”0px”にすれば余白を完全になくせます。)

デフォルトの余白

↓↓↓

11122233333

 

余白10px

↓↓↓

1111332

 

余白なし

↓↓↓

11233

 

また、

「300×250のアドセンスをスマホで表示させたいんですが」

という問い合わせを頂いたんですが、
メールを返しても届かなかったので、
一緒にこちらで返事させて頂こうと思います。

 

300×250のアドセンスをスマホで表示させる場合、
余白を失くすだけでは幅が足りないので、
横幅自体を広げる必要があると思います。

0pxにすればギリギリ表示できますが、
ちょっと右に寄って変な感じになってしまいます。

↓↓↓

111111112

 

幅自体を広げる方法は、
ちょっと僕の方では力不足のため調べられなかったので、
直接リファインスノーのサポートメールに問い合わせて頂ければと思います。

 

ただ、余白を広げることで
アドセンスも大きく見せることが可能なので、
300×250以外のアドセンスでも代用できるのではないかと思います。

 

以上です。

気になることがあればいつでもどうぞ

LINEグループ作りました

コメントを残す