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

Обратный звонок

Добрый день. Подскажите как добавить картинку на обратный звонок


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

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

Насколько мы поняли, вы хотите добавить изображение к ссылке Заказать обратный звонок на витрине вашего магазина. Для этого вы можете добавить ссылку на изображения в блок Обратный звонок на странице Дизайн > Макеты > По умолчанию в администраторской части вашего магазина. Откройте страницу редактирования данного блока, перейдите на вкладку Содержимое и замените данную строку:
<div class="ty-cr-link">{call_request}</div>

 на эту часть кода:

<div class="ty-cr-link">
<img src="путь до изображения">{call_request}
</div>


Здесь путь до изображения - ссылка на файл изображения. Предварительно вы можете загрузить нужное изображение в ваш магазин. Чтобы сделать это, следуйте инструкции:


1. Откройте страницу Администрирование > Файлы в администраторской части вашего магазина. Секция Пользовательские файлы будет открыта по умолчанию.

2. Загрузите изображение с помощью кнопки с иконкой дискеты. Также вы можете просто перетащить нужные файлы из окна вашего файлового менеджера (например, Проводника или Total Commander) на пустое пространство открытой секции.

3. Когда изображение загружено, нажмите на него правой кнопкой мыши и выберите пункт Свойства.

4. Нажмите правой кнопкой мыши на ссылке Ссылка и выберите пункт контекстного меню Копировать ссылку на изображение.


Если вы имели в виду что-то другое, пожалуйста, уточните.


Спасибо.

Да, именно это. Спасибо, получилось

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


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

Установил блок обратного звонка в шапку сайта, которая белого цвета.

Цвет цифр телефона и слова(до наведения на них курсора) "Заказать обратный звонок" тоже белые.

В итоге данный блок не видно. 

1. Как и где изменить цвет и толщину цифр номера телефона?

2. Как и где изменить цвет букв отображаемых до наведения курсора?

3. Как и где изменяется цвет после наведения курсора на буквы?

@mgmgmg,


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


Для изменения внешнего вида элементов вашего магазина мы рекомендуем воспользоваться редактором тем Мерчиума: для изменения цвета элементов, пожалуйста, воспользуйтесь секцией Цвета, а для изменения свойств шрифта измените начертание в секции Шрифты.


> 2. Как и где изменить цвет букв отображаемых до наведения курсора?

> 3. Как и где изменяется цвет после наведения курсора на буквы?


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


Для того чтобы найти информацию по используемому классу, а также определить, какой именно класс используется для определенного элемента, вы можете воспользоваться инструментом разработчика в браузере, который вы используете. Обычно он вызывается нажатием клавиши F12 на клавиатуре. Для поиска нужного элемента вам необходимо нажать на иконку с лупой (в браузере Google Chrome) или на иконку курсора, наводящую на прямоугольную область (в браузере Mozilla Firefox), выделить интересующий вас элемент на странице Мерчиума, и в секции Elements (в браузере Google Chrome) или Styles (в браузере Mozilla Firefox) вы сможете увидеть название класса или идентификатора, значение которого вы сможете изменить.


Подробнее об использовании данного инструмента в браузерах Google Chrome и Mozilla Firefox вы можете найти на следующих ресурсах:


https://developer.chrome.com/devtools (на английском языке)

http://ruseller.com/lessons.php?rub=28&id=1683


http://firebug.ru/

https://mozilla-russia.org/products/firefox/videos/firebug.html


Информацию по работе с различными CSS свойствами вы можете найти на данных ресурсах:


http://htmlbook.ru/

http://www.w3schools.com/css/


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

Спасибо. 

>Для изменения внешнего вида элементов вашего магазина мы рекомендуем воспользоваться редактором тем Мерчиума: для изменения цвета элементов, пожалуйста, воспользуйтесь секцией Цвета, а для изменения свойств шрифта измените начертание в секции Шрифты.

Не подходит данный метод, так как меняет цвет и шрифт для всего магазина, а не для отдельного блока "Обратный звонок".

Изменил цвет "вручную" 

  

/*Покрасили номер телефона обратного звонка в чёрный цвет*/
.ty-cr-phone-number-link .ty-cr-phone, .ty-cr-phone-number-link .ty-cr-phone-prefix {
color: #000000;
}
/*Покрасили номер телефона обратного звонка в чёрный цвет*/

/*Покрасили буквы "обратного звонка" в синий цвет*/
.ty-cr-link a {
color: rgba(64, 84, 186, 1);
}
/*Покрасили буквы "обратного звонка" в синий цвет*/

 Вопрос с покраской снят. Спасибо.


 

@mgmgmg,


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


Мы рады слышать, что у вас получилось изменить цвет элементов в блоке Обратный звонок.


Спасибо, что поделились своим решением на форуме.

Добавил иконку обратного звонка. Решил ее в виде кнопки сделать. Сразу же появились еще вопросы:

1. Как сделать иконку обратного звонка кликабельной?

2. Как убрать надпись "Заказать обратный звонок" под иконкой?

3. Как изменить размер этой иконки?

С третьим пунктом разобрался.

Со вторым тоже. Остался первый пункт.

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


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


Что касается первого пункта, пожалуйста, обратитесь к нашему ответу в теме Добавить кнопку.


Спасибо.

Анастасия, спасибо! Но, все-таки, это немного не то. При помощи Вами предложенного решения я могу сделать лишь текстовую кнопку. А если я хочу для кнопки использовать картинку, как поступить?

Попробовал зайти в Администрирование - Языки, нашел переменную call_requests.request_call и вставил туда тег с картинкой. На главной странице все заработало как надо, но при открытии всплывающего окна Обратного звонка вверху окна отображается полный адрес картинки вместе с тегами. Вернул пока все как было.

Korsar,

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

Для того чтобы сделать картинку ссылкой, можно добавить следующий код в Содержимое блока Обратный звонок:

 

<a id="opener_call_request_" class="cm-dialog-opener cm-dialog-auto-size "  data-ca-target-id="content_call_request_"  rel="nofollow"><span><img src="path_to_your_image" width="160" height="46"></span></a>

 

Мы добавили ссылку для картинки Обратного звонка в вашем магазине. Пожалуйста, проверьте.


Спасибо.


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