スマホでも投稿記事内の画像を最適に表示するには

投稿記事内に、画像を貼り付けることはよくあることです。

パソコンのみの表示であれば、特に気にすることは無いのですが、「LP Designer」はレスポンシブ対応ですので、せっかくならばタブレットやスマートフォンでも最適に表示したいものです。

ここでは、様々な端末で、画像を最適に表示する方法をご紹介します。

投稿ページで画像を貼り付ける

まずは、通常通り「メディアを追加」で、投稿エリアに画像を貼り付けます。
画像貼り付け

コードを修正する

画像を貼りつけたら、エディタを「ビジュアル」から「テキスト」に変更します。
テキストに変更

エディタを「テキスト」に変更すると、投稿エリアが下図のように変わります。
※画像クリックで拡大します。
画像ソース

この中で変更する箇所は、画像サイズを指定している「width=”279″ height=”353″」の部分です。ここを次のように変更します。

width=”279″ height=”353″ → style=”max-width:279px”

「 height=”353″」の部分は完全に削除します。


以上で、修正は完了です。

画像がスマートフォンでも最適に表示できるかを簡易的に調べたい時は、ブラウザの幅を縮めてみるとわかります。

画像が、縦横比を保ちながら縮小されればOKです。



【スポンサーリンク】

新着情報