バージョン選択

フォーラム

メニュー

オンライン状況

80 人のユーザが現在オンラインです。 (61 人のユーザが フォーラム を参照しています。)
登録ユーザ: 1
ゲスト: 79
Hmura もっと...

サイト内検索

質問 > フロント機能 > PC・スマホでの商品表示件数の変更

フロント機能

新規スレッドを追加する

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 スレッド
moge1203
投稿日時: 2018/4/9 13:56
対応状況: −−−
一人前
登録日: 2018/3/15
居住地:
投稿: 89
PC・スマホでの商品表示件数の変更
▼テンプレート
[EC-CUBE] 3.0.15 , 新規インストール
[レンタルサーバ] heteml
[OS] macOS High Sierra ver10.13.3
[PHP] 5.6
[ブラウザ] Google Chrome
[導入プラグインの有無] Point , おすすめ商品管理 , 売上 , 新着商品ブロック , 商品並び替え (今後も追加予定)
[カスタマイズの有無] システム的なカスタマイズはないが,フレームワークを用いずに、独自のhtmlファイルから組み込み


▼質問内容
皆様いつもお世話になっております。
スマホとPCでの表示切り替えについてご質問があります。

商品一覧ページやその他プラグインでの表示なのですが、
パソコンとスマホでの表示件数を変更したいと考えています。

例えば、パソコンでアクセスした場合一覧ページには
(■=商品アイコン)

■■■■
■■■■
■■■■
■■■■
■■■■
[pager]

のように1列4個ずつの計20個を表示

スマホでアクセスした際には
■■■
■■■
■■■
■■■
■■■
[pager]

上記のように1列3個の計15個の表示


このような切替えは可能でしょうか?

どなたかご教授いただけると幸いです。

よろしくお願いします。

K-web
投稿日時: 2018/4/9 17:09
対応状況: −−−
半人前
登録日: 2018/3/12
居住地:
投稿: 29
Re: PC・スマホでの商品表示件数の変更
ec-cubeには‎Bootstrapが入っているのでそちらで表示の切り替えをすれば良いと思います。
cssで@mediaなどを使うとより細かく指定できます。

Bootstrapの使い方はこちらなどを参照に
https://techacademy.jp/magazine/6270

ec-cubeのBootstrapは多少特殊ですが基本的な操作方法は変わりませんので参考にしてみてください。
moge1203
投稿日時: 2018/4/9 18:39
対応状況: −−−
一人前
登録日: 2018/3/15
居住地:
投稿: 89
Re: PC・スマホでの商品表示件数の変更
K-web様
ご回答ありがとうございます。

Bootstrapについてなのですが、今回は独自HTMLを使用しているため利用していません。
また、@mediaを用いた指定方法というのはカラム数の変化ということでしょうか?
今回実装したいのはPCとSPのアクセスした際に、商品一覧ページの最大読込数の変化を実装したいと考えており、カラム数を変更しただけですと、最後の1枠だけ空白のような不細工な形になってしまうので避けております。

スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ


 



ログイン


EC-CUBEペイメント

統計情報

総メンバー数は33,206名です
総投稿数は87,773件です

投稿数ランキング

1
seasoft
7331
2
AMUAMU
2712
3
nanasess
1790
4
yuh
1515
5
468
1271
6
red
1178
7
umebius
1007
8
fukap
907
9
shutta
827
10
tsuji
815
11 ramrun 789
12
tao_s
664
13 karin 656
14 sumida 641
15
homan
633
16 DELIGHT 571
17
h_tanaka
571
18
patapata
502
19
flealog
483
20 tonton 436


ネットショップの壺

EC-CUBEインテグレートパートナー

Copyright© LOCKON CO.,LTD. All Rights Reserved.