Начать новую тему

Как поменять цвет фона карточки товара?

Добрый день,

Каким образом можно поменять цвет фона карточки товара в разделах на витрине? А также размер этой карточки? Где искать размер внутренней иконки я нашел.

 

С уважением,

Вадим Викторович


ещё 1 человеку задает этот вопрос

Здравствуйте, Вадим!


Спасибо, что обратились к нам.


Для изменения цвета элементов вашего магазина мы рекомендуем воспользоваться визуальным редактором. Например, для изменения фона страницы карточки товара в списке Редактировать выберите Цвета и измените фон в секции Содержимое. Обращаем ваше внимание на то, что цвет фона содержимого будет изменен для всех страниц магазина.


Что касается карточки товара, упомянутой в вашем сообщении, пожалуйста, уточните, какой элемент имеется в виду, чтобы мы могли предоставить вам точные инструкции.


Спасибо.

Имеется ввиду карточка товара которая на странице категорий, она  по умолчанию белая и не меняется с помощью фона

 

Здравствуйте, Вадим.

Спасибо за ваше уточнение.

В вашем случае вам нужно добавить следующие правила в секцию Пользовательские CSS визуального редактора:

.ty-column4 form, .ty-column3 form, .ty-column2 form, .ty-column1 form {
	background: none repeat scroll 0 0 #fff;
}

 

, где #fff - желаемый цвет. Палитру цветов, рекомендуемую для дизайна веб-страниц, вы можете найти по этой ссылке: http://www.artlebedev.ru/tools/colors/ .

Что касается размера ячейки товара, то он зависит от размера иконки товара и количества столбцов в списке товаров. Размер иконки товара вы можете изменить на странице Настройки > Иконки, а количество столбцов - на странице Настройки > Внешний вид в панели администратора вашего магазина.

Надеемся, что данная информация окажется полезной для вас.

Спасибо.

Здравствуйте! Фон карточки поменял, фон иконки поменял, фон страницы тоже поменял, но, несмотря на все изменения, в карточке товара по бокам остаются белые полосы - обрамление иконки в теле карточки. Как и этот цвет изменить? На скрине по курсору. Спасибо за помощь.

@modastyle25,


Здравствуйте!


Спасибо за ваш запрос.


Для решения данной проблемы мы рекомендуем вам изменить значения следующих полей на странице Настройки > Иконки в панели администратора вашего магазина:


Ширина иконки в списке товаров (страницы категории, поиска и т.д.)

Высота иконки в списке товаров (страницы категории, поиска и т.д.)


Если данное решение не поможет, вы можете изменить цвет данного элемента с помощью CSS-свойства background для селектора .ty-grid-list__image. Пожалуйста, используйте раздел Пользовательские CSS в редакторе тем Мерчиума для добавления необходимых CSS-правил.


Пожалуйста, проверьте.


Спасибо.

Изменение размеров иконки не помогает. А вот с кодом сложнее - чайник я в этих CSS, аднака... В пользовательских CSS такого селектора нет, пробовал прописать - ничего не меняется. Подскажите, что и где прописать в коде. Спасибо.

Селектор нашёл. Пробую поменять свойства.

 

.ty-column4:hover .ty-grid-list__image,
.ty-column3:hover .ty-grid-list__image,
.ty-column2:hover .ty-grid-list__image,
.ty-column1:hover .ty-grid-list__image { border-color: none repeat scroll 0 0 #6600cc;}

Правильно? Цвет не изменился.

 

Прописал. Цвет изменяется только при наведении курсора.

 

@modastyle25,


Спасибо за ваш ответ.


Мы рады слышать, что вам удалось найти решение. Чтобы изменить цвет данного элемента не только при наведении курсора, пожалуйста, удалите псевдокласс hover из вышеупомянутых селекторов. Например, следующий текст:

 

.ty-column4:hover

 

необходимо заменить на

 

.ty-column4

 

Пожалуйста, проверьте и сообщите нам о результате.


Спасибо.

.ty-column4 .ty-grid-list__image,
.ty-column3 .ty-grid-list__image,
.ty-column2 .ty-grid-list__image,
.ty-column1 .ty-grid-list__image { background: #6600cc;}

Это окончательный и правильный вариант. Для таких же чайников, как и я, напомню, что #6600cc - цвет, который можно изменять.


Спасибо за помощь!

 

@modastyle25,


Спасибо за ваш ответ. Мы рады слышать, что все получилось. Благодарим вас за то, что поделились итоговым решением с пользователями Мерчиума.


Надеемся, что данная информация будет полезна другим участникам форума.


Спасибо.

А у меня нет свойства background, как поступить?

Вот часть кода:
.ty-grid-list__image {
border-color: transparent;
}

.ty-quick-view-button {
visibility: visible;
text-align: center;
}

 

Здравствуйте, Сергей!

Чтобы изменять дизайн элементов в Мерчиуме, которые не меняются стандартными настройками, необходимо добавлять новые правила и свойства в секцию Пользовательские CSS вашего Редактора тем. То есть предоставленный ранее код нужно добавить в ваши Пользовательские CSS.

Спасибо.

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