#1
Отправлено 19 Ноябрь 2017 - 18:06
Подскажите, пожалуйста:
1) Необходимо создать кнопку обратного звонка на сайте (указал примерно как должно выглядеть во вложении).
2) Во всплывающем окне сделать поле для заполнения "представьтесь пожалуйста" не обязательны тоесть запрашивать только номер телефона.
3)После нажатия на кнопку "отправить" появляется надпись "В ближайшее время с Вами свяжется наш сотрудник!"
Аккаунт SL-421285.
#2
Отправлено 24 Ноябрь 2017 - 14:22
Paparam (19 Ноябрь 2017 - 18:06) писал:
Подскажите, пожалуйста:
1) Необходимо создать кнопку обратного звонка на сайте (указал примерно как должно выглядеть во вложении).
2) Во всплывающем окне сделать поле для заполнения "представьтесь пожалуйста" не обязательны тоесть запрашивать только номер телефона.
3)После нажатия на кнопку "отправить" появляется надпись "В ближайшее время с Вами свяжется наш сотрудник!"
Аккаунт SL-421285.
#4
Отправлено 29 Ноябрь 2017 - 17:18
Paparam (24 Ноябрь 2017 - 14:24) писал:
<div class="login"> <ul> <li><a href="{USER_LOGIN_URL}">Вход</a></li> <li><a href="{USER_REGISTER_URL}">Регистрация</a></li> </ul> </div> {% ENDIF %}и сразу после него добавьте блок
<a href="#" class="orderCallHeader">Обратный звонок</a> <div class="fancyform" style="display:none;"> <h2>Заказать обратный звонок</h2> <form method="post" action="{CALLBACK_URL}" class="callbackForm" enctype="multipart/form-data"> <input type="hidden" name="hash" value="{HASH}" /> <!-- Набор полей которые не видит пользователь, но видят боты. Когда они их заполняют мы точно знаем, что их прислал нам бот и мы не сохраняем подобный отзыв о товаре, а боту отправившему отзыв сообщаем, что отзыв добавлен успешно, но будет отображён здесь после прохождения модерации --> {ANTISPAM_CODE} <table class="form"> <tr style="display:none;"> <td><label for="callback_person" class="required">Представьтесь, пожалуйста<em>*</em></label></td> <td><input id="callback_person" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PERSON}]" value="Представьтесь, пожалуйста" maxlength="50" class="required"/></td> </tr> <tr> <td><label for="callback_phone" class="required">Телефон<em>*</em></label></td> <td><input id="callback_phone" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PHONE}]" value="{FORM_CALLBACK_PHONE}" maxlength="255" class="required input-text"/></td> </tr> </table> <div class="buttons"> <div class="right"> {% IFNOT FORM_SEND_OK %}<button type="submit" title="Отправить" class="button">Отправить</button>{% ENDIF %} </div> </div> </form> </div>Затем в конец файла main.css добавьте код
.orderCallHeader{ display: block; clear: both; background: #fff; width: 130px; margin: 0 auto; padding: 5px; }В конец файла man.js добавьте код
$(function(){ $('.orderCallHeader').click(function(){ var formFancy = $('.fancyform').html(); console.log($('.fancyform').html()) $.fancybox({ content : formFancy }); return false; }) })
#5
Отправлено 29 Ноябрь 2017 - 17:44
Stasya (29 Ноябрь 2017 - 17:18) писал:
<div class="login"> <ul> <li><a href="{USER_LOGIN_URL}">Вход</a></li> <li><a href="{USER_REGISTER_URL}">Регистрация</a></li> </ul> </div> {% ENDIF %}и сразу после него добавьте блок
<a href="#" class="orderCallHeader">Обратный звонок</a> <div class="fancyform" style="display:none;"> <h2>Заказать обратный звонок</h2> <form method="post" action="{CALLBACK_URL}" class="callbackForm" enctype="multipart/form-data"> <input type="hidden" name="hash" value="{HASH}" /> <!-- Набор полей которые не видит пользователь, но видят боты. Когда они их заполняют мы точно знаем, что их прислал нам бот и мы не сохраняем подобный отзыв о товаре, а боту отправившему отзыв сообщаем, что отзыв добавлен успешно, но будет отображён здесь после прохождения модерации --> {ANTISPAM_CODE} <table class="form"> <tr style="display:none;"> <td><label for="callback_person" class="required">Представьтесь, пожалуйста<em>*</em></label></td> <td><input id="callback_person" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PERSON}]" value="Представьтесь, пожалуйста" maxlength="50" class="required"/></td> </tr> <tr> <td><label for="callback_phone" class="required">Телефон<em>*</em></label></td> <td><input id="callback_phone" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PHONE}]" value="{FORM_CALLBACK_PHONE}" maxlength="255" class="required input-text"/></td> </tr> </table> <div class="buttons"> <div class="right"> {% IFNOT FORM_SEND_OK %}<button type="submit" title="Отправить" class="button">Отправить</button>{% ENDIF %} </div> </div> </form> </div>Затем в конец файла main.css добавьте код
.orderCallHeader{ display: block; clear: both; background: #fff; width: 130px; margin: 0 auto; padding: 5px; }В конец файла man.js добавьте код
$(function(){ $('.orderCallHeader').click(function(){ var formFancy = $('.fancyform').html(); console.log($('.fancyform').html()) $.fancybox({ content : formFancy }); return false; }) })
Спасибо! Кнопочка работает.
Единственное хотелось бы применить маленькие изменения. Во вложении.
Также хотелось бы сделать такую же кнопку в подвале сайта.
Спасибо!
#6
Отправлено 08 Январь 2018 - 14:39
#7
Отправлено 16 Январь 2018 - 14:28
Paparam (29 Ноябрь 2017 - 17:44) писал:
Единственное хотелось бы применить маленькие изменения. Во вложении.
Также хотелось бы сделать такую же кнопку в подвале сайта.
Спасибо!
1) В конец файла main.css добавьте код
.fancybox-wrap .right button.button { background: #22b14c; }2) Уточните, пожалуйста, необходимо кнопку в подвале "покрасить" зеленым цветом или сделать кнопку вызова формы как в шапке, а саму форму скрыть?
3) В файле main.css найдите код
.orderCallHeader{ display: block; clear: both; background: #fff; width: 130px; margin: 0 auto; padding: 5px; }и замените его на
.orderCallHeader{ display: block; clear: both; width: 180px; margin: 45px auto; padding: 5px; background: #22b14c; color: #fff; border: 4px solid #fff; font-size: 23px; }
#8
Отправлено 16 Январь 2018 - 14:31
Stasya (16 Январь 2018 - 14:28) писал:
1) В конец файла main.css добавьте код
.fancybox-wrap .right button.button { background: #22b14c; }2) Уточните, пожалуйста, необходимо кнопку в подвале "покрасить" зеленым цветом или сделать кнопку вызова формы как в шапке, а саму форму скрыть?
3) В файле main.css найдите код
.orderCallHeader{ display: block; clear: both; background: #fff; width: 130px; margin: 0 auto; padding: 5px; }и замените его на
.orderCallHeader{ display: block; clear: both; width: 180px; margin: 45px auto; padding: 5px; background: #22b14c; color: #fff; border: 4px solid #fff; font-size: 23px; }
В ответ на второй пункт, сделать кнопку как в шапке, зеленым цветом.
#9
Отправлено 17 Январь 2018 - 05:25
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.indexfeedb_button button{border:1px solid #ddd;padding:5px 15px; cursor:pointer;background:white;color:#666;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-o-transition:all 0.35s ease;-moz-transition:all 0.35s ease;}
замените на:
.indexfeedb_button button{border: 4px solid #fff;font-size: 23px;font-weight: bold;padding:5px 15px; cursor:pointer;background: #22b14c;color:#fff;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-o-transition:all 0.35s ease;-moz-transition:all 0.35s ease;}
#10
Отправлено 17 Январь 2018 - 09:05
Vaccina (17 Январь 2018 - 05:25) писал:
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.indexfeedb_button button{border:1px solid #ddd;padding:5px 15px; cursor:pointer;background:white;color:#666;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-o-transition:all 0.35s ease;-moz-transition:all 0.35s ease;}
замените на:
.indexfeedb_button button{border: 4px solid #fff;font-size: 23px;font-weight: bold;padding:5px 15px; cursor:pointer;background: #22b14c;color:#fff;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-o-transition:all 0.35s ease;-moz-transition:all 0.35s ease;}
Здравствуйте! Произвел измененея, окрасилась только кнопка отправить, хотелось бы сделать как в шапке, просто одна кнопка Обратный звонок.
#11
Отправлено 08 Февраль 2018 - 10:07
Stasya (29 Ноябрь 2017 - 17:18) писал:
<div class="login"> <ul> <li><a href="{USER_LOGIN_URL}">Вход</a></li> <li><a href="{USER_REGISTER_URL}">Регистрация</a></li> </ul> </div> {% ENDIF %}и сразу после него добавьте блок
<a href="#" class="orderCallHeader">Обратный звонок</a> <div class="fancyform" style="display:none;"> <h2>Заказать обратный звонок</h2> <form method="post" action="{CALLBACK_URL}" class="callbackForm" enctype="multipart/form-data"> <input type="hidden" name="hash" value="{HASH}" /> <!-- Набор полей которые не видит пользователь, но видят боты. Когда они их заполняют мы точно знаем, что их прислал нам бот и мы не сохраняем подобный отзыв о товаре, а боту отправившему отзыв сообщаем, что отзыв добавлен успешно, но будет отображён здесь после прохождения модерации --> {ANTISPAM_CODE} <table class="form"> <tr style="display:none;"> <td><label for="callback_person" class="required">Представьтесь, пожалуйста<em>*</em></label></td> <td><input id="callback_person" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PERSON}]" value="Представьтесь, пожалуйста" maxlength="50" class="required"/></td> </tr> <tr> <td><label for="callback_phone" class="required">Телефон<em>*</em></label></td> <td><input id="callback_phone" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PHONE}]" value="{FORM_CALLBACK_PHONE}" maxlength="255" class="required input-text"/></td> </tr> </table> <div class="buttons"> <div class="right"> {% IFNOT FORM_SEND_OK %}<button type="submit" title="Отправить" class="button">Отправить</button>{% ENDIF %} </div> </div> </form> </div>Затем в конец файла main.css добавьте код
.orderCallHeader{ display: block; clear: both; background: #fff; width: 130px; margin: 0 auto; padding: 5px; }В конец файла man.js добавьте код
$(function(){ $('.orderCallHeader').click(function(){ var formFancy = $('.fancyform').html(); console.log($('.fancyform').html()) $.fancybox({ content : formFancy }); return false; }) })
Здравствуйте еще раз! Столкнулся с проблемой, сделанная кнопка обратного звонка не показывается в мобильной версии сайта.
#12
Отправлено 01 Июнь 2018 - 06:11
Простите за ожидание. Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.container .row2{display:block;position:static;height:180px;}
замените на:
.container .row2{display:block;position:static;height:280px;}
#13
Отправлено 01 Июнь 2018 - 09:56
Vaccina (01 Июнь 2018 - 06:11) писал:
Простите за ожидание. Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.container .row2{display:block;position:static;height:180px;}
замените на:
.container .row2{display:block;position:static;height:280px;}
Большое спасибо!
Темы с аналогичным тегами Об, ратный звонок
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных