DLE UniForm

Лучшая email форма для ДЛЕ от pafnuty - которая работает на AJAX вызовах и имеет возможность конфигурировать вид.

Это значит, что вы можете кастомизировать внешний вид не только формы, но и -сообщения так, как этого требует дизайн. и отправка форм даёт максимальную защиту от автоматических заполнений и не обременяет пользователя разгадкой каптчи.

----

Сайт автора -  https://pafnuty.name/modules/159-uniform.html
Депозитарий модуля - скачать

---

Версия - 2.0 - смотреть

Установка DLE UniForm:

1. Основаня проблема при установке - Как запустить установку модуля UniForm?

- по адресу: ваш_сайт/dle_module_install.php?module=uniform и следовать инструкциям.

2. Проблема - форма очень тяжела и портит все СЕО сайта где она установлена, а все через свои стили и скрипты которые вызывают модальное окно. Решение:
2.1 Не нужно подключать стили формы (создаем свои)
2.2 Код подключения формы без лишних скриптов.

<!-- DLE UniForm -->
<script src="/engine/classes/min/index.php?charset=utf-8&f={THEME}/uniform/js/alfile-uniform.js"></script>
<!-- /DLE UniForm -->

Файл (alfile-uniform.js) в котором я соединил все скрипты формы:

Скачать файл alfile-uniform.rar ^{[9.4 Kb] (cкачиваний: 41)}

3. Нужно создать свое простое модульно окно на чистом CSS(о самом окне):

<div class="dm-overlay" id="win1"><div class="dm-table"> <div class="dm-cell"><div class="dm-modal"> 
<a href="#close" class="closform">Закрыть</a>
     <a style="font-size:20px;" href="tel:+79647251344"> +7-964-725-13-44</a><br />
<h5 class="zagzakaz">Заказ звонка для бесплатного замера:</h5>
   
<!-- FORMA -->
<div data-uf-inline="/engine/ajax/uniform/uniform.php" data-uf-settings='{"formConfig": "callback"}'>
	<div class="uf-inline-loading"></div>
</div>
<!-- /FORMA -->     
</div></div></div></div>

 3.1 Стили модульного окна

/* Всплывающее окно */
.dm-overlay { position: absolute;top: 0;left: 0;display: none;overflow: auto;width: 100%;height: 100%;background: rgba(255, 255, 255, 0.65);z-index:9999;}
.dm-overlay:target { display: block;}
.dm-table {display: table;width: 100%; height: 100%;}
/* блок модульного окна */
.dm-cell { width:30%;position:fixed;left:40%;top:20%;padding:15px;}
.dm-modal {display:block;padding:25px;width: 100%;background:#eeefef;border-radius:6px; border: 1px solid #363636; -webkit-box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.22), 0px 19px 60px rgba(0, 0, 0, 0.3);box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.22), 0px 19px 60px rgba(0, 0, 0, 0.3); color: #cfd8dc;text-align: left;}

3.2 Кнопка вызова модульного окна:

<a href="#win1">Открыть окно 1</a>