#1
Отправлено 19 Август 2014 - 12:24
и как вставить саму кнопку в указанное место?
#2
Отправлено 19 Август 2014 - 12:35
janjak (19 Август 2014 - 12:24) писал:
и как вставить саму кнопку в указанное место?
Для начала нам необходимо загрузить шаблон "Обратный звонок" (callme.zip)
Далее нам необходимо указать при нажатии на какую кнопку выводить функцию с обратным звонком.
В шаблоне HTML Вставляем после
<div class="bottommain over clr"> <div class="headleft fleft txtalgncnt fmlptn fnt16 "> <ul> <li class="title"><a href="http://{NET_DOMAIN}/feedback"><span>Связаться</span> с Нами</a></li> {% IF SETTINGS_STORE_ICQ %}<li class="headerIcq"><img class="valignMiddle" src="http://wwp.icq.com/scripts/online.dll?icq={SETTINGS_STORE_ICQ_ONLY_DIGITS}&img=27" alt="Статус" width="16" height="16" />{SETTINGS_STORE_ICQ}</li>{% ENDIF %} <li class="skype">{% IF SETTINGS_STORE_SKYPE %}<span>Skype: </span><a href="skype:{SETTINGS_STORE_SKYPE}">{SETTINGS_STORE_SKYPE}</a>{% ENDIF %}</li> <li class="phone"> <span class="phoneNum"> {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<a class="tel1" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}" href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}{SETTINGS_STORE_PHONE_CITY_CODE1}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}</a>{%ENDIF%} {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<a class="tel2" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}" href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}"><span class="telColor"> | </span>{SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}</a>{%ENDIF%} {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<a class="tel3" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}" href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}"><span class="telColor"> | </span>{SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}</a>{%ENDIF%} </span>
вот этот код
<a class="callback fancybox.ajax" href="http://{NET_DOMAIN}/callback?only_body=1">Обратный звонок</a>
Вставляем данный код перед </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>
Прикрепленные файлы
#4
Отправлено 19 Август 2014 - 15:39
janjak (19 Август 2014 - 15:35) писал:
1) как изменить размер шрифта самой надписи "обратный звонок"?
при этом не меняя размер шрифта "связаться с нами" и размер номера телефона
2) и как сместить надпись под телефон, чтобы она получилась в одну строчку под телефоном?
В main.css добавьте:
a.callback.fancybox.ajax { font-size:16px; }
где 16px - это размер шрифта.
2) Изменения произвели.
#6
Отправлено 19 Август 2014 - 16:03
janjak (19 Август 2014 - 15:57) писал:
Здравствуйте.
В шаблоне html найдите код
<span class="phoneNum"> {% IF SETTINGS_STORE_PHONE_NUMBER1 %}<a class="tel1" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}" href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}{SETTINGS_STORE_PHONE_CITY_CODE1}{% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}">{SETTINGS_STORE_PHONE_COUNTRY_CODE1} {% IF SETTINGS_STORE_PHONE_CITY_CODE1 %}({SETTINGS_STORE_PHONE_CITY_CODE1}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER1}</a>{%ENDIF%} {% IF SETTINGS_STORE_PHONE_NUMBER2 %}<a class="tel2" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}" href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}"><span class="telColor"> | </span>{SETTINGS_STORE_PHONE_COUNTRY_CODE2} {% IF SETTINGS_STORE_PHONE_CITY_CODE2 %}({SETTINGS_STORE_PHONE_CITY_CODE2}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER2}</a>{%ENDIF%} {% IF SETTINGS_STORE_PHONE_NUMBER3 %}<a class="tel3" title="Номер телефона: {SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}" href="tel:{SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}"><span class="telColor"> | </span>{SETTINGS_STORE_PHONE_COUNTRY_CODE3} {% IF SETTINGS_STORE_PHONE_CITY_CODE3 %}({SETTINGS_STORE_PHONE_CITY_CODE3}){% ENDIF %} {SETTINGS_STORE_PHONE_NUMBER3}</a>{%ENDIF%} </span>После него добавьте
<br>
#8
Отправлено 19 Август 2014 - 16:24
janjak (19 Август 2014 - 16:19) писал:
Спасибо!
А можно вместо текста "обратный звонок" вставить вот такую кнопку с этим же функционалом?
Попробуйте такой вариант
Находим
<a class="callback fancybox.ajax" href="http://avnsport.ru/callback?only_body=1">Заказать обратный звонок</a>Заменяем на
<a class="callback fancybox.ajax" href="http://avnsport.ru/callback?only_body=1"><img src="ссылка на новую картинку"></a>
#9
Отправлено 19 Август 2014 - 16:33
Castiel (19 Август 2014 - 16:24) писал:
Находим
<a class="callback fancybox.ajax" href="http://avnsport.ru/callback?only_body=1">Заказать обратный звонок</a>Заменяем на
<a class="callback fancybox.ajax" href="http://avnsport.ru/callback?only_body=1"><img src="ссылка на новую картинку"></a>
#14
Отправлено 19 Август 2014 - 17:28
janjak (19 Август 2014 - 17:22) писал:
Подскажите, как изменить саму форму отправки данных?
много лишних полей
Удаляйте не нужные поля
Например:
<tr> <td><label for="coupon_code">Код купона на скидку</label></td> <td><input id="coupon_code" type="text" name="form[coupon_code]" value="{FORM_COUPON_CODE}" maxlength="255" class="input-text"/></td> </tr>
#15
Отправлено 19 Август 2014 - 18:14
batta (19 Август 2014 - 17:28) писал:
Удаляйте не нужные поля
Например:
<tr> <td><label for="coupon_code">Код купона на скидку</label></td> <td><input id="coupon_code" type="text" name="form[coupon_code]" value="{FORM_COUPON_CODE}" maxlength="255" class="input-text"/></td> </tr>
1) Убрать красную окантовку и сделать эти две надписи жирными?
2) Предлог "По" перенести под "С"?
3) "Перейти на главную" поместить по центру окна?
#16
Отправлено 19 Август 2014 - 18:36
janjak (19 Август 2014 - 18:14) писал:
1) Убрать красную окантовку и сделать эти две надписи жирными?
2) Предлог "По" перенести под "С"?
3) "Перейти на главную" поместить по центру окна?
В main.css
.required { border: 1px solid red; }изменить на
.required { /* border: 1px solid red; */ font-size: 12px; font-weight: bold; }2)
в шаблоне HTML
<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><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="{FORM_CALLBACK_PERSON}" 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> <tr> <td><label for="callback_convenient_hour_from">Удобное время звонка</label></td> <td> С: <input id="callback_convenient_hour_from" type="text" name="form[callback_convenient_hour_from]" value="{FORM_CALLBACK_CONVENIENT_HOUR_FROM}" maxlength="255" class="input-text"/> По: <input id="callback_convenient_hour_to" type="text" name="form[callback_convenient_hour_to]" value="{FORM_CALLBACK_CONVENIENT_HOUR_TO}" maxlength="255" class="input-text"/> </td> </tr> </table> <div class="buttons"> <div class="left"> <p class="back-link"><a href="http://{NET_DOMAIN}/">Перейти на главную</a></p> </div> <div class="right"> {% IFNOT FORM_SEND_OK %}<button type="submit" title="Отправить" class="button">Отправить</button>{% ENDIF %} </div> </div> </form> </div> </div>изменить на
<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><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="{FORM_CALLBACK_PERSON}" 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> <tr> <td><label for="callback_convenient_hour_from">Удобное время звонка</label></td> <td> С: <input id="callback_convenient_hour_from" type="text" name="form[callback_convenient_hour_from]" value="{FORM_CALLBACK_CONVENIENT_HOUR_FROM}" maxlength="255" class="input-text"/> <br> По: </br><input id="callback_convenient_hour_to" type="text" name="form[callback_convenient_hour_to]" value="{FORM_CALLBACK_CONVENIENT_HOUR_TO}" maxlength="255" class="input-text"/> </td> </tr> </table> <div class="buttons"> <div class="left"> <p class="back-link"><a href="http://{NET_DOMAIN}/">Перейти на главную</a></p> </div> <div class="right"> {% IFNOT FORM_SEND_OK %}<button type="submit" title="Отправить" class="button">Отправить</button>{% ENDIF %} </div> </div> </form> </div> </div>
3)
Добавьте в main.css
p.back-link { text-align: center; }
#18
Отправлено 20 Август 2014 - 10:20
janjak (20 Август 2014 - 10:02) писал:
1) Как добавить черную рамку, чтобы визуально разделить поля для заполнения между собой?
2) Как перенести предлоги "С" и "По" вместе с полями для заполнения под "Удобное время звонка"?
Обновите шаблон Обратный звонок
#19
Отправлено 20 Август 2014 - 10:48
Темы с аналогичным тегами об, ратный звонок
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных