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

Иконки доставки, гарантии низкой цены и возврата

Как поменять иконки в блоке "Выгода и гарантии"?


В этой теме (http://help.merchium.ru/support/discussions/topics/1000036335) даётся инструкция для изменения иконки соц. сетей, но у иконок доставки и гарантии, по-видимому, нет атрибута content, а вместо этого есть ссылка вида: url('../../../../../../../../design/themes/responsive/media/images/icons/benefits_sprite.png') no-repeat 17px 6px


Через Пользовательские CSS ничего не меняется. Т.е. если писать, например:


.ty-icon-benefits-low-price:before {

content: "\e007";

}


Ничего не происходит. 


Как же поменять эти иконки?


Спасибо!

Здравствуйте, Юлия!


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


Данные иконки реализованы несколько иным способом, чем описано в упомянутой теме, с помощью спрайтов. Под спрайтами в CSS принято называть одно изображение, которое состоит из нескольких "частей", которые показываются по отдельности в зависимости от действий пользователя. Например, интересующий вас спрайт содержит 3 иконки. Ниже мы предоставим инструкции по процессу их изменения.


1. В панели администратора перейдите на страницу Дизайн > Темы.

2. Нажмите на кнопку Визуальный редактор справа от выбранной темы.

3. Откройте секцию Пользовательские CSS.

4. Вставьте следующий код:


.ty-benefits-low-price {

background: url('http://example.com/1.jpg');

}


, где http://example.com/1.jpg - абсолютный путь до изображения, которое вы хотели бы использовать. 


5. Нажмите Сохранить.


Пожалуйста, проверьте и сообщите нам о результате. Если вам необходима инструкция по изменению других иконок, пожалуйста, сообщите.


Спасибо.

Мария, спасибо за ответ. Получается, мне надо использовать какой-то сторонний хостинг для изображений? Нельзя ли хостить их на сервере Мерчиума (в своей установке), загружая как-то через админку?

Уважаемая Юлия!


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


1. В администраторской части магазина перейдите на страницу Дизайн > Редактор файлов.

2. Откройте секцию, в которую будете загружать изображения (Темы, Изображения или Файлы).

3. Загрузите изображение в желаемую директорию с помощью кнопки с иконкой +.

4. Когда изображение загружено, в секции слева выберите изображение. С помощью контекстного меню откройте изображение в новой вкладке браузера и скопируйте адрес изображения из адресной строки браузера. Данную ссылку вы сможете использовать при указании фона в поле Пользовательские CSS в визуальном редакторе Мерчиума.


Также отметим, что использование изображений со сторонних серверов также возможно, если имеется ссылка на изображение.


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


Спасибо.

Уважаемая Мария,


Спасибо за ответ. Иконки поменять удалось, однако с некоторыми оговорками (может кому будет полезно на будущее): по умолчанию загруженная картинка начинает повторяться, как паттерн. Удалось решить эту проблему с помощью создания спрайта в стороннем сервисе (http://spritepad.wearekiss.com/) и добавлением нескольких строк кода, в результате получилось так:


.ty-benefits-low-price {

background: url('http://rishikesh-store.mymerchium.ru//users/7045/images/heart.png') no-repeat; background-position: 0 0;

 width: 54px;

 height: 54px;

}


Возможно, можно было обойтись и без сторонних сервисов (подозреваю, что можно было использовать тег no-repeat, но синтаксиса не знаю, может не туда ставился он).


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

Уважаемая Юлия!


Спасибо, что поделились с нами данной информацией. 


Если у вас есть сомнения по поводу свойства no-repeat, вы можете попробовать записать его отдельным правилом. Например:


background-repeat: no-repeat;


Тем не менее мы рады слышать, что вам удалось найти решение данной проблемы. Если у вас будут какие-либо вопросы, пожалуйста, обращайтесь к нам. Мы сделаем все возможное с нашей стороны, чтобы вам помочь.


Спасибо.


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