Здесь вы найдете примеры и способы размещения ссылки на форму регистрации Tallanto.
Перед началом необходимо подключить на сайте JavaScript библиотеку jQuery и плагин ColorBox. Сделать это можно так.
1. Разархивируйте скачанный архив плагина ColorBox. Нас интересуют только два файла – colorbox.css и jquery.colorbox.js – и папка images. Поместите эти файлы в директории сайта в созданную папку colorbox.
2. Поместите эти файлы в директории сайта в созданную папку colorbox.
3. Откройте в текстовом редакторе для редактирования:
- если сайт статический (не используется никакая CMS) – поочередно все страницы сайта;
- если сайт создан на wordpress – header.php используемой темы;
- для динамических сайтов на других CMS – ту часть шаблона (темы), где расположена секция HEAD.
4. Найдите секцию HEAD – все, что находится между открывающим и закрывающим тегами: <HEAD>...</HEAD>. И добавьте в конец, перед закрывающим тегом </HEAD>, код:
4.1 если на вашем сайте уже подключен jQuery
<link type="text/css" media="screen" rel="stylesheet" href="адрес_вашего_сайта/colorbox/colorbox.css" />
<script type="text/javascript" src="адрес_вашего_сайта/colorbox/jquery.colorbox.js"></script>
4.2 если на вашем сайте НЕ подключен jQuery
<link type="text/css" media="screen" rel="stylesheet" href="адрес_вашего_сайта/colorbox/colorbox.css" />
<script> src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="адрес_вашего_сайта/colorbox/jquery.colorbox.js"></script>
1. Форма регистрации во всплывающем окне
Добавьте данный код на страницу, на которой будет ссылка записи на занятие
<script type="text/javascript">
(function ($) {
$(document).ready(function() {
$(".tallanto_signin").colorbox({iframe:true, width:"85%", height:"90%"});
});
})(jQuery);
</script>
Разместите ссылку следующим образом:
<a class="tallanto_signin" href="ссылка_для_сайта_на_занятие" target="_blank">Записаться на занятие</a>
Форма записи выглядит так:
2. Форма регистрации непосредственно на странице (скрывающаяся)
Добавьте следующий код
<style type="text/css">
.tallanto-btn {
cursor: pointer;
}
</style>
<script type="text/javascript">
(function ($) {
$(document).ready(function() {
$(".tallanto-btn").click(function() {
$(".tallanto-form").toggle();
});
});
})(jQuery);
</script>
Разместите ссылку следующим образом:
<a class="tallanto-btn">Записаться на занятие</a> <iframe class="tallanto-form" style="display:none;" src="ссылка_для_сайта_на_занятие" width="число px" height="число px">Записаться на занятие</iframe>
Форма записи выглядит так:
3. Форма регистрации непосредственно на странице
Для размещения формы регистрации непосредственно на странице сайта необходимой добавить следующий код:
<iframe src="ссылка_для_сайта_на_занятие" width="число px" height="число px">Записаться на занятие</iframe>
