Перейти к содержимому


Поменять Цвет Меню

Автор emin808, 04 дек. 2012 14:06
менять цвет меню

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 53

#1 emin808

emin808

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 538 сообщений

Отправлено 04 Декабрь 2012 - 14:06

Подскажите пожалуйста , как поменять цвет меню и разделы сайта ?!

#2 emin808

emin808

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 538 сообщений

Отправлено 04 Декабрь 2012 - 14:11

может есть готовые варианты цветных меню,?!
Нужен темно серый

2. как еще регулировать высоту, ширину, шрифт?!

#3 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 04 Декабрь 2012 - 15:03

Здравствуйте.
В панели администратора, Сайт -> Редактор тем.
Открыть файл bootstrap-responsive.css.
Добавить код:
.menu_main li, .menu_main li a {
  background-color: #4d4d4d;/*цвет фона*/
  padding-left:5px;/*отступ слева*/
  color:white!important;/*цвет текста*/
 
}
.menu_main li:hover, .menu_main li a:hover{
  background-color: #EDEDED;/*цвет текста при наведение*/
  color:black!important;/*Цвет текста при наведение*/
}
.menu_main .menu_parent li:hover{
  background-color: #EDEDED;/*цвет текста при наведение*/
  color:black!important;/*Цвет текста при наведение*/
}
.menu_main .menu_parent li a:hover {
  background-color: #EDEDED;/*цвет текста при наведение*/
  color:black!important;/*Цвет текста при наведение*/
}

#4 emin808

emin808

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 538 сообщений

Отправлено 04 Декабрь 2012 - 23:48

БлагоДарю, все получилось! :)

#5 emin808

emin808

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 538 сообщений

Отправлено 09 Февраль 2013 - 16:29

подскажите пожалуйста, как например сделать меню в таком стиле   Изображение

#6 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 09 Февраль 2013 - 17:49

В файле "bootstrap-responsive.css".
Найти код:
.menu_main li, .menu_main li a {
background-color: #4BA203;/*цвет фона*/
padding-left:5px;/*отступ слева*/
color:white!important;/*цвет текста*/

}
Заменить:

.menu_main li, .menu_main li a {
background-color: #4BA203;/*цвет фона*/
background: url("адрес вашей картинки") 0px 1px;
padding-left:5px;/*отступ слева*/
color:white!important;/*цвет текста*/

}

#7 emin808

emin808

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 538 сообщений

Отправлено 09 Февраль 2013 - 18:33

да, получилось, благодарю ВАс, все отлично! :) :) :)

а подскажите пожалуйста , где задавать стили меню, например размер строки увеличить, закругление придать и т.п

#8 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 09 Февраль 2013 - 18:44

Можно изменять стили в "bootstrap-responsive.css".
/* Dropdown menu */
.menu_main li {
  position:relative;
  border-top: solid 1px #fff;
  border-bottom: solid 1px #fff;
   z-index: 100;
}

#9 emin808

emin808

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 538 сообщений

Отправлено 09 Февраль 2013 - 20:39

да, благодарю чуть разобрался методом тыка конечно , но вот ни как не найду путь как

1. выпадающие пункты перекрасить (например цвет: background: url("http://asfn.storelan...ню 25.png?7107") 0px 1px;

2. при наведении чтоб текст менялся на белый

Изображение

#10 miyako

miyako

    Активный участник

  • Модератоpы
  • 5 372 сообщений

Отправлено 10 Февраль 2013 - 11:00

Просмотр сообщенияemin808 (09 Февраль 2013 - 20:39) писал:

да, благодарю чуть разобрался методом тыка конечно , но вот ни как не найду путь как

1. выпадающие пункты перекрасить (например цвет: background: url("http://asfn.storelan...ню 25.png?7107") 0px 1px;

2. при наведении чтоб текст менялся на белый

Изображение

В файле "bootstrap-responsive.css" в коде (цвет подкатегорий при наведении):
.menu_main .menu_parent li a:hover {
  background-color: red;/*цвет текста при наведение*/
  color:black!important;/*Цвет текста при наведение*/
}
Цвет категорий:
.menu_main li, .menu_main li a {
background-color: #71A744;
background: url("http://asfn.storeland.ru/web/upload/assets/images/154/153295/%D1%81%D1%82%D0%B8%D0%BB%D0%B8%20%D0%BC%D0%B5%D0%BD%D1%8E%2029.png?7188") 0px 1px; /*цвет категорий как фон*/
padding-left: 5px;
color: #61625F!important;
}

#11 emin808

emin808

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 538 сообщений

Отправлено 10 Февраль 2013 - 11:17

Просмотр сообщенияmiyako (10 Февраль 2013 - 11:00) писал:

В файле "bootstrap-responsive.css" в коде (цвет подкатегорий при наведении):
.menu_main .menu_parent li a:hover {
background-color: red;/*цвет текста при наведение*/
color:black!important;/*Цвет текста при наведение*/
}
Цвет категорий:
.menu_main li, .menu_main li a {
background-color: #71A744;
background: url("http://asfn.storeland.ru/web/upload/assets/images/154/153295/%D1%81%D1%82%D0%B8%D0%BB%D0%B8%20%D0%BC%D0%B5%D0%BD%D1%8E%2029.png?7188") 0px 1px; /*цвет категорий как фон*/
padding-left: 5px;
color: #61625F!important;
}

Да, благодарю, с цветом при наведении разобрался , но вот как изменить цвет выпадающей категории Я так и нашел пути .

Поясню:

У нас сейчас меню серого цвета, при наведении на пункт например Apple цвет меняется на зеленый, а выпадающие подпункты остаются серыми , вот нам необходимо чтобы эти выпадающие подпункты тоже были зелеными.

#12 emin808

emin808

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 538 сообщений

Отправлено 11 Февраль 2013 - 11:44

:mellow:

#13 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 11 Февраль 2013 - 13:08

Попробуйте в файл "main.js".
Добавить код:

$(document).ready(function() {
$(".menu_parent ul li a").css('background','url("http://asfn.storeland.ru/web/upload/assets/images/154/153295/%D1%81%D1%82%D0%B8%D0%BB%D0%B8%20%D0%BC%D0%B5%D0%BD%D1%8E%2025.png")');
$(".menu_parent ul li a").css('background-color','#71A744');
});

#14 emin808

emin808

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 538 сообщений

Отправлено 12 Февраль 2013 - 10:21

да, благодарю получилось, но по все видимости когда добавляешь такие пункты остальные функции перестают работать , или Я просто не там делаю .

в частности : поменять цвет текста не получается, и при наведении фон не меняется

Изображение

#15 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 13 Февраль 2013 - 02:06

Для изменения цвета под категорий при наведении - необходимо в файл стилей main.css добавить

.menu_main .menu_parent li a:hover {
	background-color: white !important;
	color: black !important;
}

с указанием необходимого вам цвета в свойстве background-color

#16 Trendiz

Trendiz

    Пользователь

  • Пользователи
  • PipPip
  • 16 сообщений

Отправлено 26 Сентябрь 2013 - 19:37

Добрый вечер! Подскажите. пожалуйста, как поменять цвет меню на чёрный (вместо серого) и заменить все цвета шрифта на чёрный + при наведении белый (если в верхнем меню) или фиолетовый (если сбоку и в теле сайта)? пытаюсь найти разделы. которые вы здесь описываете, но у меня их нет...
сайт trendiz.ru
хочется меню как в теме Вечность, но логику сайта и расположение всего оставить эти.
Спасибо!

#17 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 27 Сентябрь 2013 - 03:38

Вы можете добавить в файл стилей main.css следующие правила

#subNavigation li a:hover,
#subNavigation li a:active {
	color: #AC00FF !important;
}

#mainNav {
	background: #000000 !important;
}

#mainNav table td div {
	background: #000000 !important;
}

#mainNav table td div a.selected,
#mainNav table td div a:hover,
#mainNav table td div a:active {
	color: #FFFFFF !important;
	text-decoration: underline !important;
}
#mainNav table td div a:link,
#mainNav table td div a:visited {
	color: #FFFFFF !important;
background: #000000 !important;
}

#18 Trendiz

Trendiz

    Пользователь

  • Пользователи
  • PipPip
  • 16 сообщений

Отправлено 27 Сентябрь 2013 - 18:33

Спасибо огромное!!!
а можно ли как-то меню растянуть на всю ширину страницы, а "в корзине товаров на... руб" сместить под "модные тренды по доступным ценам, т.е. выше меню, под поиском?

#19 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 28 Сентябрь 2013 - 01:20

Найдите в файле стилей main.css

#cartInfo {
	bottom: 6px;
	font-size: 13px;
	position: absolute;
	right: 10px;
	white-space: nowrap;
}

и замените на

#cartInfo {
	font-size: 13px;
	position: absolute;
	right: 10px;
	top: 50px;
	white-space: nowrap;
}

далее найдите

#mainNav {
	background: url("{ASSETS_IMAGES_PATH}nav_bg.jpg") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
	bottom: 0;
	height: 35px;
	left: 5px;
	position: absolute;
}

и замените на

#mainNav {
	right: 5px;
	bottom: 0;
	height: 35px;
	left: 5px;
	position: absolute;
}

далее найдите

#mainNav table {
	background: url("{ASSETS_IMAGES_PATH}nav_bg_right.gif") no-repeat scroll right bottom rgba(0, 0, 0, 0);
	border-collapse: collapse;
	border-spacing: 0;
	float: left;
	height: 30px;
	margin: auto;
	padding: 5px 5px 0 0;
}

и замените на

#mainNav table {
	border-collapse: collapse;
	border-spacing: 0;
	float: left;
	height: 30px;
	margin: auto;
	padding: 5px 5px 0 0;
}

#20 Trendiz

Trendiz

    Пользователь

  • Пользователи
  • PipPip
  • 16 сообщений

Отправлено 28 Сентябрь 2013 - 11:39

Всё заменила, ничего...
Обратно в Изменение общей стилистики



Темы с аналогичным тегами менять цвет, меню

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Техника
  5. → Изменение общей стилистики
  6. Privacy Policy