[戻る]
No.1388

商品一覧表示

ブルホワさん  投稿日:2015/01/23(Fri) 13:51
key

商品一覧ページについて、現在縦並び(価格・商品詳細)で表示されますが、画像横並び表示で価格のみにすることはできますか?
できれば、3商品ずつの横並びで表示したいです。

Re: 商品一覧表示

おたすけマイショップさん  2015/01/23(Fri) 14:46 No.1389
key

まず、画像を縦並び⇒横並びにする方法を説明します。

フリーエリアパーツ管理(店長ナビ>デザイン設定>詳細レイアウト他)のレイアウト図中央にある商品一覧内の[表示設定]ボタンを押します。

商品表示設定画面が表示されるので、「初期表示」を[カタログ表示]にして保存します。

以上で、商品一覧ページが横並びになります。


次に、各商品の表示を画像と価格のみの表示にする方法です。

フリーエリアパーツ管理(店長ナビ>デザイン設定>詳細レイアウト他)のレイアウト図中央にある商品一覧内の[商品フレーム設定]ボタンを押します。

商品フレーム設定画面が表示されるので、[有効]にチェックを入れます。
画面最下部にある「商品情報・その他」の[価格]のみにチェックを入れます。
([価格の(税込)を表示]のチェックは任意です。また、[商品名]や[在庫]のチェックは外して下さい)

以上の設定後、保存すれば完了です。


最後に、3商品ずつの横並びで表示する方法です。

こちらは表示する商品数を固定するという設定や機能がない為、数値を調整いただく方法となります。

フリーエリアパーツ管理(店長ナビ>デザイン設定>詳細レイアウト他)のレイアウト図中央にある商品一覧内の[商品フレーム設定]ボタンを押します。

「ビッグフレーム」にある[チューニング]にチェックを入れていただき、[標準フレームサイズ]の幅の数値を調整して保存すれば完了です。

(ビッグフレーム、メガフレームの入力欄は削除して空欄にして下さい)

保存後、ショップページにてご確認ください。

尚、初期設定の160pxでは、一般的なパソコン画面で表示すると4商品、スマートフォン(縦)で2商品の横並びとなります。

※こちらの説明は、フリーエリアパーツ管理にて商品一覧の両サイドにメニューが表示されている場合の説明となります。
 設定により、再度のメニューを非表示または、商品一覧の下に配置している場合は、設定する数値を大きく設定して下さい。


Re: 商品一覧表示

ブルホワさん  2015/01/23(Fri) 15:20 No.1390
key

お早いご対応ありがとうございます。

>商品表示設定画面が表示されるので、「初期表示」を[カタログ表示]にして保存します。
>以上で、商品一覧ページが横並びになります。

せっかくお返事いただいたのですが、ここまでは何度か試してみました。
しかしなぜだか、プレビュー画面が変化しないのです。

各商品の表示を画像と価格のみの表示にする方法に関しても反映されないのですが、原因はお分かりになりますでしょうか?


Re: 商品一覧表示

ブルホワさん  2015/01/23(Fri) 15:26 No.1391
key

お早いご対応ありがとうございます。

>商品表示設定画面が表示されるので、「初期表示」を[カタログ表示]にして保存します。
>以上で、商品一覧ページが横並びになります。

せっかくお返事いただいたのですが、ここまでは何度か試してみました。
しかしなぜだか、プレビュー画面が変化しないのです。

各商品の表示を画像と価格のみの表示にする方法に関しても反映されないのですが、原因はお分かりになりますでしょうか?


Re: 商品一覧表示

おたすけマイショップさん  2015/01/23(Fri) 15:55 No.1392
key

反映されないのは、ブラウザのCookieにリスト表示が保存されているため、反映されていないように見えているかと思われます。

この場合、一度ブラウザを終了していただくことでCookieがクリアされますので、ブラウザを閉じた後に開き直してご確認ください。


また、商品フレーム設定について一点追記させて下さい。

現在、商品が横並びになっていることをこちらで確認できておりますが、商品画像の高さのサイズにより縦幅が均等になっておりません。

均等に並べる場合は、以下の設定を行って下さい。

フリーエリアパーツ管理(店長ナビ>デザイン設定>詳細レイアウト他)のレイアウト図中央にある商品一覧内の[商品フレーム設定]ボタンを押します。

「ビッグフレーム」にある[チューニング]にチェックを入れていただき、[標準フレームサイズ]の[自動]のチェックをはずしていただき、高さの数値を登録して保存すれば完了です。
([画像を領域内で余白が無くなるサイズにする]はお好みでチェックを入れて下さい)

以上で縦幅が均等に整列します。


Re: 商品一覧表示

ブルホワさん  2015/01/23(Fri) 16:25 No.1393
key

ありがとうございます!
無事解決いたしました^^

お手数おかけいたしました。



返信
*おなまえ
*email (回答通知用。公開されません)
*タイトル
*内容
ショップURL
*key (修正の際に使用します)

無料で本格的なネットショップ開業できるのは『イージーマイショップ』