ぷよぱんのサイドFIREブログ

南国離島の田舎者の素人が投資・副業・ブログでサイドFIREを目指す。

【簡単コピペ】はてなブログ 楽天モーションウィジェット スマホ用にカスタマイズ【はみ出る】

皆さんごきげんいかがでしょうか?

今回は楽天モーションウィジェットの

レスポンシブ対応について書いていこうと思います‼️

当ブログのフッターに楽天モーションウェジェットを

使用していたのですが

スマホ画面で見るとはみ出てまして・・・

サイズ調整すると小さくなるし

調べると楽天モーションウェジェットは

レスポンシブ対応してないみたい🌀

よし検索だ‼️あったあった✨

参考にしたのはアフィリエイターのいたるさんのブログ

https://www.thoughtbuzz.net/楽天モーションウィジェット/www.thoughtbuzz.net

 
自分的にわかりやすかったのとコピペでオッケーなところ✨

軽く内容を説明すると

PC画面だと1列ですがスマホだと2列になります 

PC画面

f:id:puyo_pan:20201126221105p:plain

スマホ画面

f:id:puyo_pan:20201126221509j:plain

楽天モーションウィジェットのサイズは300×160がおすすめ‼️

フッターに貼りたい場合は

ダッシュボード→デザイン→カスタマイズ→フッタ

HTMLの記述にコピペ✨

設置方法のソースコードはこちら

<center>
<div style="float;left;">
<!--楽天モーションウィジェット-->
</div>
</center>

<!--楽天モーションウィジェット-->

楽天からコピーしてきたソースコードをコピペ‼️

左寄りに表示されるのが嫌だったので

上下に<center>を付け足して

真ん中での表記になってます

いや〜とっても簡単✨

しかし欠点が・・・

2つ同じウィジェットを並べると、

表示される商品がだぶる場合があるので

楽天モーションウィジェットのレスポンシブ対応に

悩んでいたら試してみたらいかがでしょうか

ではまたどー


ご愛読ありがとうございます✨

ブログランキングに参加しています‼️

応援よろしくお願いします🙇‍♂️


にほんブログ村 株ブログへ
 
にほんブログ村 株ブログ 配当・配当金へ


にほんブログ村にほんブログ村

 
ブログランキング・にほんブログ村へ
にほんブログ村