0
Заказать Обратный Звонок В Шапке Как В Лазури
Автор Дмитрий Шумский, 12 июня 2016 14:42
Сообщений в теме: 10
#1
Отправлено 12 Июнь 2016 - 14:42
Здравствуйте!
Подскажите пожалуйста, как реализовать следующее.
Поставить ссылку под контактной информацией в шапке сайта, как на картинке
При нажатии на неё, чтобы выскакивало окошко, как в шаблоне Лазурь
А далее при заполнении приходило письмо с заявкой на обратный звонок.
Спасибо!
Подскажите пожалуйста, как реализовать следующее.
Поставить ссылку под контактной информацией в шапке сайта, как на картинке
При нажатии на неё, чтобы выскакивало окошко, как в шаблоне Лазурь
А далее при заполнении приходило письмо с заявкой на обратный звонок.
Спасибо!
#2
#3
Отправлено 13 Июнь 2016 - 15:58
MikDark (12 Июнь 2016 - 14:59) писал:
Здравствуйте. Уточните, для какого аккаунта нужны изменения?
Аккаунт SL-357668
_____________________________________________________________________________________________________
Здравствуйте!
Аккаунт SL-357668
Подскажите пожалуйста, как реализовать следующее.
Поставить ссылку под контактной информацией в шапке сайта, как на картинке
При нажатии на неё, чтобы выскакивало окошко, как в шаблоне Лазурь
А далее при заполнении приходило письмо с заявкой на обратный звонок.
Спасибо!
#4
Отправлено 13 Июнь 2016 - 17:25
Дмитрий Шумский (13 Июнь 2016 - 15:58) писал:
Аккаунт SL-357668
_____________________________________________________________________________________________________
Здравствуйте!
Аккаунт SL-357668
Подскажите пожалуйста, как реализовать следующее.
Поставить ссылку под контактной информацией в шапке сайта, как на картинке
При нажатии на неё, чтобы выскакивало окошко, как в шаблоне Лазурь
А далее при заполнении приходило письмо с заявкой на обратный звонок.
Спасибо!
_____________________________________________________________________________________________________
Здравствуйте!
Аккаунт SL-357668
Подскажите пожалуйста, как реализовать следующее.
Поставить ссылку под контактной информацией в шапке сайта, как на картинке
При нажатии на неё, чтобы выскакивало окошко, как в шаблоне Лазурь
А далее при заполнении приходило письмо с заявкой на обратный звонок.
Спасибо!
Для начала нам необходимо загрузить шаблон "Обратный звонок" (callme.zip)
Из архива файл callback.html загружаем в раздел Сайт - Редактор шаблонов
1) В шаблоне HTML находим код:
<script type="text/javascript" src="{FORALL_JS_PATH}jquery-1.4.2_nyroModal-1.6.2_validate_capslock_jquery-ui-1.8.4.custom.version2.min.js"></script>
и заменяем его на:
<link rel="stylesheet" href="{FORALL_STYLES_PATH}fancybox/jquery.fancybox-1.3.4.min.css" type="text/css" />
<script type="text/javascript" src="{FORALL_JS_PATH}jquery-1.4.2_nyroModal-1.6.2_validate_capslock_jquery-ui-1.8.4.custom_fancybox-1.3.4.version2.min.js"></script>
Далее в этом же шаблоне добавляем перед </head>:
<script>
$(document).ready(function() {
$(".callback").fancybox({
maxWidth : 300,
maxHeight : 330,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>
Далее в шаблоне HTML найдите код:
<!-- Время работы магазина --> {% IF SETTINGS_STORE_WORK_TIME %} <tr> <td class="contentTableHeadMainWorkTime"> {SETTINGS_STORE_WORK_TIME} </td> </tr> {% ENDIF %}
и после него добавьте:
<tr><td><div id="callback"> <a href="http://{NET_DOMAIN}/callback?only_body=1" class="callback fancybox.ajax">Обратный звонок</a> </div></td></tr>
Прикрепленные файлы
#5
Отправлено 26 Июль 2016 - 08:58
Установила обратный звонок, но не очень почему то получилось красивым всплывающее окошко, посмотрите может я не туда установила вот это и из за этого все криво...
<script>
$(document).ready(function() {
$(".callback").fancybox({
maxWidth : 300,
maxHeight : 330,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>
<script>
$(document).ready(function() {
$(".callback").fancybox({
maxWidth : 300,
maxHeight : 330,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>
#6
Отправлено 26 Июль 2016 - 13:06
Gerti (26 Июль 2016 - 08:58) писал:
Установила обратный звонок, но не очень почему то получилось красивым всплывающее окошко, посмотрите может я не туда установила вот это и из за этого все криво...
<script>
$(document).ready(function() {
$(".callback").fancybox({
maxWidth : 300,
maxHeight : 330,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>
<script>
$(document).ready(function() {
$(".callback").fancybox({
maxWidth : 300,
maxHeight : 330,
fitToView : false,
width : '70%',
height : '70%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>
Скажите, пожалуйста, для какого аккаунта Вы производили эти изменения?
#8
Отправлено 26 Июль 2016 - 18:44
Gerti (26 Июль 2016 - 13:07) писал:
Аккаунт SL-390809
Стили в всплывающем окне, настраиваются вручную.
Чтобы сделать отступы между полями в конец main.css добавьте
div#fancybox-content table.form td { padding: 5px; font-size: 15px; vertical-align: middle; }Пришлите скриншот, с обозначенными изменениями.
#10
Отправлено 26 Июль 2016 - 19:25
Gerti (26 Июль 2016 - 18:49) писал:
Весь код шаблона Обратный звонок замените на<div class="box"> <div class="content"> {% IF FORM_NOTICE %} <div class="{% IF FORM_NOTICE_IS_GOOD %}success{% ELSE %}warning{% ENDIF %}">{FORM_NOTICE | nl2br}</div> {% ENDIF %} <h1>Заказ обратного звонка</h1> <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> <td><input id="callback_person" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PERSON}]" value="{FORM_CALLBACK_PERSON}" maxlength="50" class="required" placeholder="Представьтесь пожалуйста"/></td> </tr> <tr> <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"placeholder="Введите номер телефона"/></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> </div>В main.css найдите
div#fancybox-content table.form td { padding: 5px; font-size: 15px; vertical-align: middle; }и замените на
div#fancybox-wrap { width: 300px !important; right: 0 !Important; left: 0 !important; margin: 0 auto; } div#fancybox-wrap #fancybox-content { width: 280px !important; } div#fancybox-wrap .right { float: none !important; display: block !important; text-align: center !important; } div#fancybox-wrap input { width: 200px; padding: 0px 15px; font-size: 12px; margin: 0 0 10px 0; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px; border: 1px solid #e9e9e9; background: #FFF; height: 30px; } div#fancybox-wrap h1 { line-height: 30px; text-transform: none; font-size: 21px; text-align: center; } div#fancybox-wrap table.form { text-align: center; width: 100%; } div#fancybox-wrap .right button.button { font-size: 16px; text-transform: none; padding: 6px 20px; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px; color: #666666; border: 1px solid #e9e9e9; background: #FFF; cursor: pointer; }
#11
Отправлено 26 Июль 2016 - 19:56
Danil (26 Июль 2016 - 19:25) писал:
Весь код шаблона Обратный звонок замените на
<div class="box"> <div class="content"> {% IF FORM_NOTICE %} <div class="{% IF FORM_NOTICE_IS_GOOD %}success{% ELSE %}warning{% ENDIF %}">{FORM_NOTICE | nl2br}</div> {% ENDIF %} <h1>Заказ обратного звонка</h1> <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> <td><input id="callback_person" type="text" name="form[{ANTISPAM_FORM_FIELD_NAME_CALLBACK_PERSON}]" value="{FORM_CALLBACK_PERSON}" maxlength="50" class="required" placeholder="Представьтесь пожалуйста"/></td> </tr> <tr> <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"placeholder="Введите номер телефона"/></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> </div>В main.css найдите
div#fancybox-content table.form td { padding: 5px; font-size: 15px; vertical-align: middle; }и замените на
div#fancybox-wrap { width: 300px !important; right: 0 !Important; left: 0 !important; margin: 0 auto; } div#fancybox-wrap #fancybox-content { width: 280px !important; } div#fancybox-wrap .right { float: none !important; display: block !important; text-align: center !important; } div#fancybox-wrap input { width: 200px; padding: 0px 15px; font-size: 12px; margin: 0 0 10px 0; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px; border: 1px solid #e9e9e9; background: #FFF; height: 30px; } div#fancybox-wrap h1 { line-height: 30px; text-transform: none; font-size: 21px; text-align: center; } div#fancybox-wrap table.form { text-align: center; width: 100%; } div#fancybox-wrap .right button.button { font-size: 16px; text-transform: none; padding: 6px 20px; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px; color: #666666; border: 1px solid #e9e9e9; background: #FFF; cursor: pointer; }
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных