Поменять Цветовую Схему
#1
Отправлено 27 Август 2014 - 09:46
Подскажите, пожалуйста, где поменять все цвета на сайте? Пронумерованы цифрами от 1 до 10. Что не указал - потом укажу, останется немного.
Хороший, лёгкий шаблон. Очень быстро работает. Думаю, легко и быстро будет поменять немного цветовую схему. Особо изменений не планируется. Минималистичный стиль.
#2
Отправлено 27 Август 2014 - 10:36
Aromaro (27 Август 2014 - 09:46) писал:
Подскажите, пожалуйста, где поменять все цвета на сайте? Пронумерованы цифрами от 1 до 10. Что не указал - потом укажу, останется немного.
Colors.png
Хороший, лёгкий шаблон. Очень быстро работает. Думаю, легко и быстро будет поменять немного цветовую схему. Особо изменений не планируется. Минималистичный стиль.
Здравствуйте.
1)Зайдите в main.css и найдите код
.header { position: absolute; position: fixed; top: 0; left: auto; z-index: 1024; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: auto; margin-left: auto; min-width: 100%; width: auto; /* height: 45px; */ background-color: #2C3E50; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }Нужно изменять значение
background-color: #2C3E50;
2) в main.css найдите код
.footer { position: relative; height: auto; background-color: #2C3E50; color: white; }Нужно изменять значение
background-color: #2C3E50;
3)в main.css найдите код
.panel-top .head li a.selected { background-color: #1abc9c; color: #FFF; }Там же найдите
.panel-top .head li a:hover { background-color: #1abc9c; box-shadow: none; color: white; text-decoration: none;Нужно изменять значение
background-color:#1abc9c;
4)
.footerMenu li.active a { background-color: #1abc9c; }
.footerMenu li a:hover { background-color: #1abc9c; box-shadow: none; text-decoration: none; }Нужно изменять значение
background-color:#1abc9c;
5)Найдите код
.infoSite { display: block; float: right; padding: 1% 1% 1% 2%; margin: 1% 1% 0% 0%; width: 20%; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #1abc9c; color: #d1f2eb; line-height: 1.4; }Нужно изменять значение
background-color:#1abc9c;
6)Найдите код
.crumbs { margin: 0 0 1.8%; padding: 8px 1.6% 8px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #34495E; color: #ECF0F1; list-style: none; line-height: 1.7; display: inline-block; width: 97%; }Нужно изменять значение
background-color:#34495E;7)Найдите код
.homePageListCart h4 { padding: 4px 6px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; background-color: #34495E; color: #ECF0F1; font-size: 120%; }Нужно изменять значение
background-color:#34495E;
8-10)Найдите код
a { color: #16a085; text-decoration: none; -webkit-transition: 0.25s; transition: 0.25s; }Нужно изменять значение
color:#16a085;
9)Найдите код
#contactShow .title a { color: #16a085; }Нужно изменять значение
background-color:#16a085;
#3
Отправлено 28 Август 2014 - 08:18
Danil (27 Август 2014 - 10:36) писал:
1)Зайдите в main.css и найдите код
.header { position: absolute; position: fixed; top: 0; left: auto; z-index: 1024; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: auto; margin-left: auto; min-width: 100%; width: auto; /* height: 45px; */ background-color: #2C3E50; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }Нужно изменять значение
background-color: #2C3E50;
2) в main.css найдите код
.footer { position: relative; height: auto; background-color: #2C3E50; color: white; }Нужно изменять значение
background-color: #2C3E50;
3)в main.css найдите код
.panel-top .head li a.selected { background-color: #1abc9c; color: #FFF; }Там же найдите
.panel-top .head li a:hover { background-color: #1abc9c; box-shadow: none; color: white; text-decoration: none;Нужно изменять значение
background-color:#1abc9c;
4)
.footerMenu li.active a { background-color: #1abc9c; }
.footerMenu li a:hover { background-color: #1abc9c; box-shadow: none; text-decoration: none; }Нужно изменять значение
background-color:#1abc9c;
5)Найдите код
.infoSite { display: block; float: right; padding: 1% 1% 1% 2%; margin: 1% 1% 0% 0%; width: 20%; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #1abc9c; color: #d1f2eb; line-height: 1.4; }Нужно изменять значение
background-color:#1abc9c;
6)Найдите код
.crumbs { margin: 0 0 1.8%; padding: 8px 1.6% 8px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background-color: #34495E; color: #ECF0F1; list-style: none; line-height: 1.7; display: inline-block; width: 97%; }Нужно изменять значение
background-color:#34495E;7)Найдите код
.homePageListCart h4 { padding: 4px 6px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; background-color: #34495E; color: #ECF0F1; font-size: 120%; }Нужно изменять значение
background-color:#34495E;
8-10)Найдите код
a { color: #16a085; text-decoration: none; -webkit-transition: 0.25s; transition: 0.25s; }Нужно изменять значение
color:#16a085;
9)Найдите код
#contactShow .title a { color: #16a085; }Нужно изменять значение
background-color:#16a085;
Спасибо! Вот остаётся ещё доделать:
1. Фон внизу сделать таким же как и выше. Где этот цвет находится?
2. Цвет выделения при наведении в меню корзины.
3. Подскажите какой цвет текста используется в местах, указанных стрелками? Чтобы его сделать таким же, а то придётся много цветов переделывать, что очень не хочется..
4. Цвет при наведении на ссылки или как их там правильно назвать..
5. Поменять зелёный цвет всплывающих сообщений.
6. Цвет без наведения и при наведении на кнопку в разделе связи с администрацией
7. Цвета при входе в личный кабинет, без наведения на кнопку и при наведении. Цвета кнопок.
8. Цвета при добавлении товара в корзину:
а) в каталоге при выделении раздела - цвет букв
б) кнопка оформить заказ - цвет фона
в) сообщение о том, что товар добавлен в корзину - цвет фона
г) кнопка положить в корзину - цвет фона
д) цвет цены
9. Цвета в товаре:
а) цвет фона в количестве штук
б) цвет цены
в) цвет цены
г) цвет фона кнопки "в корзину" без наведения и при наведении
10) Цвета кнопок и рамки:
а) цвета кнопок без наведения и при наведении
б) цвет рамки
11) Цвета 2 кнопок при оформлении заказа:
а) очистить корзину - без наведения и при наведении
б) заказать
12) После нажатия кнопки "заказать"
а) Цвет фона кнопки "отменить заказ"
б) цвет кнопки оформить заказ - без наведения и при наведении
в) текст "отменить заказ" в углу справа внизу - без наведения и при наведении, цвет.
13) цвет цены при оформлении заказа:
а) цвет цены при оформленном заказе
б) цвет левой кнопки, без выделения и при выделении
в) цвет правой кнопки, без выделения и при выделении
14) Цвета кнопок режимов списка и таблицы - без наведения и при наведении:
#4
Отправлено 28 Август 2014 - 08:27
Aromaro (28 Август 2014 - 08:18) писал:
1. Фон внизу сделать таким же как и выше. Где этот цвет находится?
1Vnizu_fon.png
2. Цвет выделения при наведении в меню корзины.
2korzina_pri_vydelenii.png
3. Подскажите какой цвет текста используется в местах, указанных стрелками? Чтобы его сделать таким же, а то придётся много цветов переделывать, что очень не хочется..
3kakoj_cvet_iz_teksta.png
4. Цвет при наведении на ссылки или как их там правильно назвать..
4cvet_pri_navedenii.png
5. Поменять зелёный цвет всплывающих сообщений.
5cvet_vsplyvayushih_soobshenij.png
6. Цвет без наведения и при наведении на кнопку в разделе связи с администрацией
6cvet_bez_navedenija_i_pri_navedenii.png
7. Цвета при входе в личный кабинет, без наведения на кнопку и при наведении. Цвета кнопок.
7cvet_knopok_bez_navedeniya_i_pri_navedenii.png
8. Цвета при добавлении товара в корзину:
8-5cvetov.png
а) в каталоге при выделении раздела - цвет букв
б) кнопка оформить заказ - цвет фона
в) сообщение о том, что товар добавлен в корзину - цвет фона
г) кнопка положить в корзину - цвет фона
д) цвет цены
9. Цвета в товаре:
9cveta_v_tovare.png
а) цвет фона в количестве штук
б) цвет цены
в) цвет цены
г) цвет фона кнопки "в корзину" без наведения и при наведении
10) Цвета кнопок и рамки:
10-cveta-knopok-i-ramki.png
а) цвета кнопок без наведения и при наведении
б) цвет рамки
11) Цвета 2 кнопок при оформлении заказа:
11-cveta-knopok.png
а) очистить корзину - без наведения и при наведении
б) заказать
12) После нажатия кнопки "заказать"
12-knopka-otmenit.png 12-oformit.png 12-tekst-otmenit-bez-i-s.png
а) Цвет фона кнопки "отменить заказ"
б) цвет кнопки оформить заказ - без наведения и при наведении
в) текст "отменить заказ" в углу справа внизу - без наведения и при наведении, цвет.
13) цвет цены при оформлении заказа:
13cvet-ceny.png
а) цвет цены при оформленном заказе
б) цвет левой кнопки, без выделения и при выделении
в) цвет правой кнопки, без выделения и при выделении
Здравствуйте, рекомендуем ознакомиться с данной темой
http://forum.storela...нужно-производ/
#5
Отправлено 28 Август 2014 - 11:07
Danil (28 Август 2014 - 08:27) писал:
Помогло, но не всё нашёл ((
Сейчас заново, но почти всё сделал:
1. При наведении мышкой на раздел каталога в меню, не могу найти этот бирюзовый цвет, чтобы поменять на оранжевый:
Связаться с нами, возможно, тоже поменяется. А может и нет.. Если нет, подскажите, пожалуйста, где это найти..
При наведении на ссылку "главная" - тоже не знаю, поменяется или нет. Она, вроде, темнее:
Также и в товаре, в каталоге, при наведении:
И в отзывах:
Вот тут вот тоже при наведении:
2. Блок с надписью "Корзина пуста", цвет при наведении:
Изменить нужно почти чёрный цвет - на оранжевый.
3. При нажатии на кнопку "Положить "..." в корзину":
Мелькает зелёный цвет кнопки. не могу найти его. Изменить на оранжевый.
И влево улетает зеленая корзинка. Где найти её, чтобы также изменить на оранжевую? Если что - другую корзинку найду.
4. Изменить три цвета в верхнем меню справа при добавленных в корзину товарах:
а) Где 2 шт - количество, сделать синим, заменив белый.
б) Рамку вокруг количества сделать белой, заменив бирюзовый.
в) Цена "столько-то" сделать белой, заменив бирюзовый.
Будет вот так (разве что по-красивей, тк не удается правильный размер подобрать шрифта):
5. Когда открыт товар, как и в п.3 мелькает зелёный, я его отобразил на скриншоте, не пойму где он:
Один товар, тестовый, есть в разделе "Очистители поверхностей - для плит"
А вот эта корзина в полёте как в п.3:
6. При нажатии на кнопку "оформить заказ":
Также мелькает зелёная кнопка. Только вроде больше светло-зелёная.
Изменить.
#6
Отправлено 28 Август 2014 - 12:51
Aromaro (28 Август 2014 - 11:07) писал:
Сейчас заново, но почти всё сделал:
1. При наведении мышкой на раздел каталога в меню, не могу найти этот бирюзовый цвет, чтобы поменять на оранжевый:
1pri_navedenii.png
Связаться с нами, возможно, тоже поменяется. А может и нет.. Если нет, подскажите, пожалуйста, где это найти..
1svyazatsya.png
При наведении на ссылку "главная" - тоже не знаю, поменяется или нет. Она, вроде, темнее:
1glavnaya.png
Также и в товаре, в каталоге, при наведении:
1-v-tovare.png
И в отзывах:
1-otzyvy.png
Вот тут вот тоже при наведении:
1-v-kataloge-pri-navedenii.png
2. Блок с надписью "Корзина пуста", цвет при наведении:
2korzina.png
Изменить нужно почти чёрный цвет - на оранжевый.
3. При нажатии на кнопку "Положить "..." в корзину":
3polozh-v-korzinu.png
Мелькает зелёный цвет кнопки. не могу найти его. Изменить на оранжевый.
И влево улетает зеленая корзинка. Где найти её, чтобы также изменить на оранжевую? Если что - другую корзинку найду.
4. Изменить три цвета в верхнем меню справа при добавленных в корзину товарах:
4-tri_cveta.png
а) Где 2 шт - количество, сделать синим, заменив белый.
б) Рамку вокруг количества сделать белой, заменив бирюзовый.
в) Цена "столько-то" сделать белой, заменив бирюзовый.
Будет вот так (разве что по-красивей, тк не удается правильный размер подобрать шрифта):
4-tri_cveta-itog.png
5. Когда открыт товар, как и в п.3 мелькает зелёный, я его отобразил на скриншоте, не пойму где он:
5-tut_tozhe_melkaet_zelyonyj.png
Один товар, тестовый, есть в разделе "Очистители поверхностей - для плит"
А вот эта корзина в полёте как в п.3:
5-korzina_v_polyote.png
6. При нажатии на кнопку "оформить заказ":
6-oformit.png
Также мелькает зелёная кнопка. Только вроде больше светло-зелёная.
Изменить.
Чтобы изменять цвета активных, выделенных и т.д. ссылок, нужно нажать кнопку в браузере, как на скриншоте и поставить все галочки.
#10
Отправлено 01 Октябрь 2014 - 12:47
внимательно ознакомился с этой темой, спасибо! Очень помогла!)
Но некоторые вопросы все же остались =)
1) Как изменить цвет фона бокового меню? С белого на розовый.
2) Не нашел кнопки "Заказать". НУжно поменять цвет фона с зеленого на розовый.
3) Название магазина и логотип. Как можно их куда либо передвинуть, изменить размер шрифта и цвет?
как изменить логотип знаю =)
4) В сортировке есть очень много ненужных фильтров (от хорошего к плохому и прочая ерунда). Где можно убрать все лишнее?
5) Где можно изменить шрифт меню?
Следующие вопросы касаются мобильной версии
6) Не работает зеленая кнопочка меню в левом верхнем углу. Как я понимаю это из-за ошибки Джава скрипт? Не подскажите, как починить?))
7) Вроде все цвета менял, а этот темный цвет фона у контактов остался. Надо поменять
8) Ну и сама зеленая кнопочка должна стать розовой!)))
9) При добавлении в корзину вылетает такое сообщение. Как изменить цвет фона?
Заранее благодарен)
#11
Отправлено 01 Октябрь 2014 - 13:04
Kartoved (01 Октябрь 2014 - 12:47) писал:
внимательно ознакомился с этой темой, спасибо! Очень помогла!)
Но некоторые вопросы все же остались =)
1) Как изменить цвет фона бокового меню? С белого на розовый.
2) Не нашел кнопки "Заказать". НУжно поменять цвет фона с зеленого на розовый.
3) Название магазина и логотип. Как можно их куда либо передвинуть, изменить размер шрифта и цвет?
как изменить логотип знаю =)
4) В сортировке есть очень много ненужных фильтров (от хорошего к плохому и прочая ерунда). Где можно убрать все лишнее?
5) Где можно изменить шрифт меню?
Следующие вопросы касаются мобильной версии
6) Не работает зеленая кнопочка меню в левом верхнем углу. Как я понимаю это из-за ошибки Джава скрипт? Не подскажите, как починить?))
7) Вроде все цвета менял, а этот темный цвет фона у контактов остался. Надо поменять
8) Ну и сама зеленая кнопочка должна стать розовой!)))
9) При добавлении в корзину вылетает такое сообщение. Как изменить цвет фона?
Заранее благодарен)
1. Найдите в main.css
.left-sidebar .block-content li.parent ul, .left-sidebar .block-content li.parent { background-color: white; }замените на
.left-sidebar .block-content li.parent ul, .left-sidebar .block-content li.parent { background-color: #FFCCCC; }2. найдите в main.css
.btn.green { border-color: #48a043; background-color: #48a043; }замените на
.btn.green { border-color: FFCCCC; background-color: FFCCCC; }3 Что бы поменять размер шрифта, найдите
.logo .store_name { display: block; float: left; }замените на
.logo .store_name { display: block; float: left; font-size: 12px; }где меняете значение font-size: 12px; меняется цвет например на
font-size: 17px;
4 вам будет полезна данная тема форума
http://forum.storela...ка-по-рейтингу/
5 найдите в main.css
.panel-top .head li a { display: block; padding: 0 10px 0 10px; color: white; text-transform: uppercase; letter-spacing: 0.13em; font-size: 105%; line-height: 45px; }меняете значение font-size: 105%;
6 уточните о какой именно кнопке идет речь
8 найдите
#contactShowBut { display: block; padding: 2.8%; width: 94%; background-color: #34495E; color: white; text-decoration: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; cursor: pointer; }заменить на
#contactShowBut { display: block; padding: 2.8%; width: 94%; background-color: #800080; color: white; text-decoration: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; cursor: pointer; }
#12
Отправлено 02 Октябрь 2014 - 12:22
очень помогли!)) Ответиили менее чем за 10 минут) Вы замечательная тех.поддержка)
Под номером шесть я имел в виду зеленую кнопочку меню в левом верхнем углу (относительно человека, который смотрит на меню). Она есть только в мобильной версии и она единственная у меня зеленая.
Проблема в том что она часто не работает. Я читал, что вообще существует такая проблема, из-за которой данная кнопка не всегда нажимается. Но у себя я заметил такую особенность: кнопка не работает только если я нахожусь в каталоге, и тогда обязательно выскакивает вот эта красная полосочка ошибки ( на рисунке под номером шесть, сама кнопочка меню это цифра восемь). Как я понимаю, это какая-то ошибка Java. Только бы понять какая =)
#13
Отправлено 03 Октябрь 2014 - 00:16
ошибка отображается только админу, попробуйте выйти с админ панели и как обычный пользователь протестировать кнопку, чтобы убедиться, что проблема из-за полоски ошибки.
#15
Отправлено 21 Ноябрь 2014 - 14:59
vadim777 (21 Ноябрь 2014 - 14:04) писал:
.header { position: absolute; position: fixed; top: 0; left: auto; z-index: 1024; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: auto; margin-left: auto; min-width: 100%; width: auto; /* height: 45px; */ background-color: #2C3E50; }и в
#sb-site.wrapper { position: relative; z-index: 0; margin: 0 auto; min-width: 305px; min-height: 100%; height: auto; background-color: #2C3E50; }параметрами background-color: #2C3E50;
#16
Отправлено 21 Ноябрь 2014 - 15:32
Alekseys (21 Ноябрь 2014 - 14:59) писал:
.header { position: absolute; position: fixed; top: 0; left: auto; z-index: 1024; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: auto; margin-left: auto; min-width: 100%; width: auto; /* height: 45px; */ background-color: #2C3E50; }и в
#sb-site.wrapper { position: relative; z-index: 0; margin: 0 auto; min-width: 305px; min-height: 100%; height: auto; background-color: #2C3E50; }параметрами background-color: #2C3E50;
#17
Отправлено 21 Ноябрь 2014 - 15:38
vadim777 (21 Ноябрь 2014 - 15:32) писал:
Зайдите в шаблон main.css и найдите следующий код:
.panel-top .head li a { color: white; display: block; font-size: 15px; letter-spacing: 0.13em; line-height: 45px; padding: 0 10px; text-transform: uppercase; }И теперь замените его на вот этот код, например:
.panel-top .head li a { color: rgb(153, 153, 153); display: block; font-size: 15px; letter-spacing: 0.13em; line-height: 45px; padding: 0 10px; text-transform: uppercase; }
Количество пользователей, читающих эту тему: 1
0 пользователей, 1 гостей, 0 анонимных