Помощь » База знаний » Поддержка »
Для того чтобы форма отправки запроса органично смотрелась на вашем веб-сайте, необходимо придать ее внешнему виду цвета и пропорции, использующиеся в оформлении сайта. Несколько основных настроек внешнего вида веб-форм доступны при использовании вариантов публикации «ссылка» и «iframe». Если этих возможностей недостаточно, воспользуйтесь вариантом публикации «javascript и form» — в этом случае возможно произвольное редактирование исходного кода веб-формы, включая HTML-код, стили CSS и даже обработку действий пользователя с помощью JavaScript. Придерживайтесь приведенных ниже инструкций при редактировании дизайна веб-формы, чтобы сохранить ее работоспособность.
Следующие элементы должны быть сохранены без изменений:
Строки вызова JavaScript-файлов:
<script type="text/javascript"
src="http://mydomain.ru/WG/js/jquery.js"></script>
<script type="text/javascript"
src="http://mydomain.ru/WG/js/jquery.validate.js"></script>
<script type="text/javascript"
src="http://mydomain.ru/WG/js/st.js"></script>
<script type="text/javascript"
src="http://mydomain.ru/WG/js/contacts-rus.js"></script>
Значение атрибута action тега FORM:
<form class="wbs-st-form use-iframe" method="post"
action="http://mydomain.ru/WG/widget.php?q=RFUyOTQ5-59090f22">
Функциональные элементы формы: теги FORM, INPUT, LABEL, TEXTAREA.
Названия CSS-классов «.wbs-st-form use-iframe», «.wbs-st-form-msg», «.error».
Блок кода, отвечающий за отображение CAPTCHA:
<img style="vertical-align:middle" style="display:none"
src="http://mydomain.ru/common/img/loading.gif" class="captcha" />
→<input style="width: 75px" id="wbs-field-captcha" name="CAPTCHA"
type="text" class="captcha digits" maxlength="4" minlength="4" />
Структуру HTML-разметки можно изменять произвольным образом при условии сохранения тегов, перечисленных выше. Например, можно вместо табличной верстки использовать верстку блоками DIV.
Блок STYLE, задающий внешний вид формы, рекомендуется вынести внутрь блока HEAD вашего веб-сайта.
<head>
<style type="text/css>
...
</style>
</head>
Все стили отображения формы рекомендуется указывать с привязкой к родительскому классу wbs-st-form, как показано ниже:
Вход для клиентов.wbs-st-form table.form { background:#F0F0F0; border-collapse:collapse;
border: 1px solid #999999}
.wbs-st-form table.form td {padding:0.25em 0.5em; margin: 0}
.wbs-st-form table.form td.title { padding: 5px; background-color: #999999;
color: #FFFFFF}
.wbs-st-form label { display:block }
.wbs-st-form p {margin:0;padding:0;}
.wbs-st-form h4 {margin:0;padding:0;}
.wbs-st-form .text {width:100%}
Если в настройках формы отключен параметр CAPTCHA, соответствующий фрагмент веб-формы должен быть скрыт:
.wbs-st-form img.captcha { display:none;}
Элементы <div class="error">...</div> (сообщение о ошибке) и <div class="wbs-st-form-msg" style="display:none">...</div> (сообщение об успешной отправке формы) должны остаться неизмененными. Вы можете добавить произвольные стили для их отображения, например:
.wbs-st-form .error { color:red; }
.wbs-st-form .wbs-st-form-msg { text-align:center; font-size:1.2em; color:green; }
