バージョン選択

フォーラム

メニュー

オンライン状況

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

サイト内検索

質問 > フロント機能 > メニュードロワーの背景色、文字色を変更したいです。

フロント機能

新規スレッドを追加する

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 スレッド
ematin
投稿日時: 2019/4/8 20:19
対応状況: 確認中
新米
登録日: 2019/4/8
居住地:
投稿: 7
メニュードロワーの背景色、文字色を変更したいです。
ec-cube3のハンバーガーメニュー?をスマホから開いた時に新規会員登録やカテゴリが表示されるところの背景色、文字色を変更したいです。どうすれば良いでしょうか?
468
投稿日時: 2019/4/9 10:29
対応状況: −−−
登録日: 2008/10/26
居住地:
投稿: 3217
Re: メニュードロワーの背景色、文字色を変更したいです。
ECCUBE3のスタイルシートはかなり複雑ですので、
ブラウザのデベロッパーツール等(F12キーで表示)で該当箇所のスタイルシートを確認して変更していくのが確実で早いかと思います。

該当メニューの背景色は
/html/template/default/css/style.css .drawer{} (1030行付近※バージョンによって異なります)で定義されているみたいです。

文字色は、新規会員登録等のメニューが
/html/template/default/css/style.css .member_link a{} (1290行付近※バージョンによって異なります)
カテゴリーリンクが
/html/template/default/css/style.css .category-nav a{} (1054行付近※バージョンによって異なります)
で定義されているようです。

デザインテンプレートをデフォルト以外に変更されている場合は、
/html/template/*****/css/の箇所がdefaultから変わります。


----------------
株式会社シロハチ
■ECCUBE2系、3系構築カスタマイズご相談ください。
EC-CUBE3マニュアル
blog

ematin
投稿日時: 2019/4/9 17:50
対応状況: −−−
新米
登録日: 2019/4/8
居住地:
投稿: 7
Re: メニュードロワーの背景色、文字色を変更したいです。
ご回答ありがとうございます。
drawerのcolorの部分を別の色に変えても反映されない場合は、何が原因になりますでしょうか?
色々試していますが、なかなかうまくいかずで。。
468
投稿日時: 2019/4/10 11:17
対応状況: −−−
登録日: 2008/10/26
居住地:
投稿: 3217
Re: メニュードロワーの背景色、文字色を変更したいです。
colorということは文字色の変更ですか?
.drawerのcolorを変更しても、aタグのcoloroが優先されているのではないでしょうか?


----------------
株式会社シロハチ
■ECCUBE2系、3系構築カスタマイズご相談ください。
EC-CUBE3マニュアル
blog

ematin
投稿日時: 2019/4/10 11:47
対応状況: −−−
新米
登録日: 2019/4/8
居住地:
投稿: 7
Re: メニュードロワーの背景色、文字色を変更したいです。
http://matin-avenir.com/
こちらのサイトをスマホから見たときの右上のドロワーを開いた時に色を鼠色のままから黒白のはっきりした色に変更したいのですが、一度見て頂けますでしょうか?どこを修正すればよろしいでしょうか?
468
投稿日時: 2019/4/10 14:33
対応状況: −−−
登録日: 2008/10/26
居住地:
投稿: 3217
Re: メニュードロワーの背景色、文字色を変更したいです。
style.css 3246行目付近の.category-nav a{}

style.css 1296行目付近の.member_link a{}
ではないでしょうか?

ある程度、サイトが見える状況であれば、
尚更、ツールを使われたほうが良いと思います。
該当のスタイルを一時的に直接変更でき、変化する具合をリアルタイムで確認する事が出来ますので。


----------------
株式会社シロハチ
■ECCUBE2系、3系構築カスタマイズご相談ください。
EC-CUBE3マニュアル
blog

ematin
投稿日時: 2019/4/10 15:45
対応状況: −−−
新米
登録日: 2019/4/8
居住地:
投稿: 7
Re: メニュードロワーの背景色、文字色を変更したいです。
ありがとうございます。試してみましたが、category-nav a{}とmember_link a{}のcolorの部分を編集しても変わらない状態です。。
編集するところが間違っているのでしょうか?
また、ツールというのはどちらで使用できますでしょうか。
468
投稿日時: 2019/4/10 18:24
対応状況: −−−
登録日: 2008/10/26
居住地:
投稿: 3217
Re: メニュードロワーの背景色、文字色を変更したいです。
ブラウザは何をお使いですか?
Chromeの場合、ドロワーを開いた状態で該当の箇所にマウスカーソルを持っていって、右クリック→検証をクリックする事で
デベロッパーツールが起動して新しいパネルが表示されるかと思います。
(画面下か右に表示されるかと思います)
WEBサイトのソースを見ながら、表示している箇所を確認する事ができる状態になります。

詳しい説明は以下のページにあります。
機能が多いので文章が多いですが、スタイルシートの調査は[Elements]パネルの説明まで読んでいただければ十分かと思います。
https://www.buildinsider.net/web/chromedevtools/01

Firefoxでも右クリック→要素の調査で同じようなツールを起動できます。

もしMacでsafariをお使いの場合は、メニュー「Safari」→「環境設定…」→タブ「詳細」→「メニューバーに”開発”メニューを表示」にチェックした後、
「command + option + I」のショートカットキーで表示するようです。


----------------
株式会社シロハチ
■ECCUBE2系、3系構築カスタマイズご相談ください。
EC-CUBE3マニュアル
blog

ematin
投稿日時: 2019/4/12 13:11
対応状況: −−−
新米
登録日: 2019/4/8
居住地:
投稿: 7
Re: メニュードロワーの背景色、文字色を変更したいです。
ブラウザ検証で解決しました!
ありがとうございます
スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ


 



ログイン


EC-CUBE公式 Amazon Payプラグイン

統計情報

総メンバー数は88,710名です
総投稿数は109,948件です

投稿数ランキング

1
seasoft
7367
2
468
3217
3
AMUAMU
2712
4
nanasess
2313
5
umebius
2085
6
yuh
1819
7
h_tanaka
1638
8
red
1570
9
mcontact
1285
10
tsuji
958
11
fukap
907
12
shutta
835
13
tao_s
799
14 ramrun 789
15 karin 689
16 sumida 641
17
homan
633
18 DELIGHT 572
19
patapata
502
20
flealog
485


ネットショップの壺

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

Copyright© EC-CUBE CO.,LTD. All Rights Reserved.