パソコンとスマホの商品説明文を替えて表示させたい。
または、スマホだけ商品説明文内の画像を非表示にしたい。
パソコンとスマホのショップで商品説明文を個々に設定することはできませんが、
HTMLとcss使う事で、現行でもデバイスにより非表示にする事ができます。
手順は以下の通りです。
フリーエリアパーツ管理(店長ナビ>デザイン設定>詳細レイアウト他)の
[ページ選択:]から[商品詳細]を選択し、レイアウト図へ以下の<style>を
追加します。
<style>
@media only screen and (max-width: 500px) {
.smartphone_non_display {
display: none;
}
}
@media only screen and (min-width: 501px) {
.pc_non_display {
display: none;
}
}
</style>
<style>の追加方法は以下のヘルプをご参考ください。
また、作成したパーツは中央の[商品詳細]枠のすぐ上に配置して下さい。
イージーマイショップオープンガイド - ページに<style>を追加する
http://emshelp.easy-myshop.jp/c-item-detail?ic=add-style
次に、商品説明文をHTMLモードに切り替えていただき、各タグの要素に以下を追加します。
・スマホで非表示にする場合 ⇒ class="smartphone_non_display"
・パソコンで非表示にする場合 ⇒ class="pc_non_display"
記述例)スマホで画像や文章を非表示にする
<img src="画像" class="smartphone_non_display">
<p class="smartphone_non_display">
<div class="smartphone_non_display">
<span class="smartphone_non_display"> など
※この要素を追加する際、他に「class="○○"」と入っていると適用され
ませんので、元の「class="○○"」を削除またはクラス名の編集をする
必要がございます。