バージョン選択

フォーラム

メニュー

オンライン状況

41 人のユーザが現在オンラインです。 (36 人のユーザが フォーラム を参照しています。)
登録ユーザ: 3
ゲスト: 38
468 matchbou hmorita_j もっと...

PR

デザインテンプレート EC-CUBE3.0版が登場!
広告掲載について

サイト内検索

質問 > その他 > スマホのページ幅設定について

その他

新規スレッドを追加する

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 スレッド
FISLAND
投稿日時: 2018/4/10 13:46
対応状況: −−−
新米
登録日: 2017/2/2
居住地:
投稿: 7
スマホのページ幅設定について
お世話になります。

スマホ版をのページ表示で困っています。
スマホ版の表示画面の横幅を調節したいですが
どこから調節可能でしょうか?

よろしくお願いします。

▼テンプレート
[EC-CUBE] 2.13.2
[レンタルサーバ] さくらインターネット
[OS] win10
[PHP] PHP 5.6.33
[データベース] MySQL 5.5.59-log
matchbou
投稿日時: 2018/4/12 10:49
対応状況: −−−
常連
登録日: 2018/3/19
居住地:
投稿: 44
オンライン
Re: スマホのページ幅設定について
表示画面の調整なので、data\Smarty\templates\sphone\site_main.tplにある
<div data-role="page" data-keep-native=".data-role-none" data-theme="f">

に以下のコードのようにstyle="width:○○px;"を追加すれば、画面全体の幅は調節できますが、
<div data-role="page" data-keep-native=".data-role-none" data-theme="f" style="width:240px;">

この認識よろしいのでしょうか?


----------------
アイフォーコム株式会社
お問い合わせ URL:https://www.iforcom.jp/ec/
tel:045-412-3010
EC-CUBEの構築・カスタマイズは有償で承ります。ご相談下さい

FISLAND
投稿日時: 2018/4/12 11:44
対応状況: −−−
新米
登録日: 2017/2/2
居住地:
投稿: 7
Re: スマホのページ幅設定について
matchbou 様

ご返信ありがとうございます。
サイズを指定し画像をwidth="100%"にしても画面に余白が出てしまうことが分かりました。

現在、スマホのページで文字や画像が小さすぎてかなりみにくい状態です。現状どのように改善すればよろしいでしょうか?

よろしくお願いします。
matchbou
投稿日時: 2018/4/12 13:39
対応状況: −−−
常連
登録日: 2018/3/19
居住地:
投稿: 44
オンライン
Re: スマホのページ幅設定について
質問の内容ですが、ページ幅を調節したいではなくて、スマホページの文字や画像を大きくしたいということでよろしいのでしょうか?

文字や画像に関してもどの箇所かにもよりますが、全体的に文字を大きくする場合は管理画面の「デザイン管理」→「スマートフォン」→「css設定」のページを開くと編集可能CSSファイルにcommon.cssがあり、そちらの「編集」をクリックしていただければ、bodyのfont-sizeを変更すれば、文字サイズを大きくできます。
画像もどの箇所かにもよりますが、例えばTOPに表示されている商品の画像であれば、同じ「css設定」でblock.cssの.recommendblock imgのwidthを変更すれば画像が大きくなります。


----------------
アイフォーコム株式会社
お問い合わせ URL:https://www.iforcom.jp/ec/
tel:045-412-3010
EC-CUBEの構築・カスタマイズは有償で承ります。ご相談下さい

FISLAND
投稿日時: 2018/4/12 14:26
対応状況: −−−
新米
登録日: 2017/2/2
居住地:
投稿: 7
Re: スマホのページ幅設定について
matchbou 様

早速のご返答ありがとうございます。
説明が下手で申し訳ございません。

スマホからページを確認すると「ようこそゲストさん」、「新規会員登録」、「ボタン」などがとっても小さく見えます。
そしてボタンの形も横長いのにボタンとボタンの間も隙間が入っていますしる状態です。(カスタマイズをしていない初期の状態と比較)

それで画面を拡大してみないとヘッダーとフッターは字が読めません。

matchbou様の説明の通り下記のように作成されていましたが、こちらが基本の状態でしょうか?

<div data-role="page" data-keep-native=".data-role-none" data-theme="f">

大変お手数をおかけしますが、よろしくお願いします。
matchbou
投稿日時: 2018/4/12 15:45
対応状況: −−−
常連
登録日: 2018/3/19
居住地:
投稿: 44
オンライン
Re: スマホのページ幅設定について
横幅の調整ではなく、文字サイズや画像の調整であれば、
<div data-role="page" data-keep-native=".data-role-none" data-theme="f">
上記ではなく、cssの調整になりますので、「style="width:○○px;"」部分は破棄していただければと思います。
cssの調整ですが、開発者モードで確認していただければ、どのcssファイルのどの箇所か等が分かるかと思うので、font-sizeやwidthを変更すれば、大きくなるかと思います。


----------------
アイフォーコム株式会社
お問い合わせ URL:https://www.iforcom.jp/ec/
tel:045-412-3010
EC-CUBEの構築・カスタマイズは有償で承ります。ご相談下さい

FISLAND
投稿日時: 2018/4/13 14:30
対応状況: −−−
新米
登録日: 2017/2/2
居住地:
投稿: 7
Re: スマホのページ幅設定について
matchbou 様

ご返信ありがとうございます。
文字の画像のサイズを調節しながらサイズを調節してみたいと思います。
色々調べたところviewportの設定もしてなかったので同時に進めてみたいと思います。

ありがとうございます。
スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ


 



ログイン


EC-CUBEペイメント

統計情報

総メンバー数は25,008名です
総投稿数は85,455件です

投稿数ランキング

1
seasoft
7331
2
AMUAMU
2712
3
nanasess
1710
4
yuh
1490
5
red
1146
6
umebius
913
7
fukap
907
8
468
904
9
shutta
827
10
tsuji
815
11 ramrun 789
12
tao_s
651
13 karin 642
14 sumida 641
15
homan
633
16 DELIGHT 571
17
patapata
502
18
flealog
483
19
h_tanaka
446
20 tonton 436


ネットショップの壺

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

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