/ Адаптивность / Сбор ящиков для подписки в БД

Сбор ящиков для подписки в БД

HIT

Создадим форму для сбора email для подписки, которая будет сохранять значения в специальную таблицу в БД.

Форма

<form id="form_site_subscribe" class="form_site_subscribe" method="post">

	<h2>Подпишитесь на нашу рассылку</h2>
	<p>Будьте в курсе последних акций и новостей</p>

	<div>
	<input type="text" name="sub_email" class="sub_email" placeholder="E-mail">
	<button type="submit" class="button">Подписаться</button>
	</div>
	<div class="submit-ajax" style="display: none;"></div>
	
</form>

Скрипт по передаче данных (ajax)

$('#form_site_subscribe').on('submit', function (event) {
	event.preventDefault();

	var email = $('#form_site_subscribe .sub_email').val();
	
	$.ajax({
		url: "/wp-admin/admin-ajax.php",
		method: 'post',
		data: {
			action: 'ajax_subscribe',
			email: email
		},
		success: function (response) {
			$('#form_site_subscribe .submit-ajax').slideDown();
			$('#form_site_subscribe .submit-ajax').html(response);
			setTimeout(function () { $('#form_site_subscribe .submit-ajax').slideUp(); }, 2000);
		}
	});
});

Стили формы

#form_site_subscribe {padding: 15px 0;}

#form_site_subscribe div {display: flex; justify-content: center;}

#form_site_subscribe div input {padding: 10px 20px; border: none; border-radius: 50px 0 0 50px;}

#form_site_subscribe div button {padding: 10px 30px; border: none; border-radius: 0 50px 50px 0; cursor: pointer;}

#form_site_subscribe div button:hover {background: #ccc;}


@media screen and (max-device-width: 480px) { 
	#form_site_subscribe div input {width: 50%;}
	#form_site_subscribe div button {padding: 10px 15px;}
}

Функция по отправке формы

Данная функция отправляет очередной подписанный e-mail на указанный адрес администратора и сохраняет его в БД.

Сначала предварительно создаем необходимую БД

register_activation_hook(__FILE__, function() {
	global $wpdb;

	$wpdb -> query("CREATE TABLE IF NOT EXISTS `{$wpdb -> prefix}subscribers` (
	`id` INT(11) UNSIGNED NOT NULL PRIMARY KEY AUTO_INCREMENT,
	`e-mail` VARCHAR(255) NOT NULL
	) {$wpdb -> get_charset_collate()};");
});
// Отправка формы
function ajax_subscribe_send(){
	
    $email = $_REQUEST['email'];
	
	$response = '';
	
	global $wpdb;
	$tablename = $wpdb->prefix."subscribers";
	$datum = $wpdb->get_results("SELECT * FROM $tablename WHERE `e-mail` = '".$email."'"); 	
	
	if( empty($email) ) { // Проверка на заполненность поля
		$response = 'Впишите свой e-mail';
	} elseif( !is_email($email) ) { // Верификация e-mail
		$response = 'Некорректный e-mail';
    } elseif( count($datum) > 0 ) { // Проверка есть ли такой e-mail в БД
		$response = 'E-mail уже сохранен';
    } else {
		
		// Отправляем почтовое сообщение
		$thm  = 'У вас новый подписчик!';
		$thm  = "=?utf-8?b?". base64_encode($thm) ."?=";
		
		$msg = "E-mail: ".$email;
		
		$mail_to = 'mailtech777@mail.ru';
		
		$headers = "Content-Type: text/html; charset=utf-8\n";
		$headers .= 'From: '.get_bloginfo().' <no-replay@'.$_SERVER['HTTP_HOST'].'>' . "\r\n";		
		
		// Cохраняем значение в БД
		if( 
			$wpdb->insert($tablename,
				array(
					'e-mail' => $email,
				), '%s'
			) == false
		) {
			$response .= 'Ошибка сохранения.';
		} else { 
			$response .= 'E-mail успешно сохранен. Теперь вы будете получать письма с новостями и акциями.';
		}		
		
	}
	
    // Сообщение о результате
    if ( defined( 'DOING_AJAX' ) && DOING_AJAX ){
        echo $response;
        wp_die();
    }
}

add_action('wp_ajax_nopriv_ajax_subscribe', 'ajax_subscribe_send' );
add_action('wp_ajax_ajax_subscribe', 'ajax_subscribe_send' );
[site-socialshare]
  • Похожие записи
  • Комментарии
  • Вложения
Ajax форма без плагина

Ajax форма без плагина

Создаем формы без использования плагинов (например Contact Form 7). Делаем форму Ajax. Создание простой формы Добавляем скрипт обработчик (с валидацией полей) Прописываем функцию формы Данное решение взято с сайта inprocess.by Читать далее »

Ajax форма с вложением файла

Ajax форма с вложением файла

Долго искал и нашел (здесь www.thenerdyblog.com) отличное решение — форма с вложением файла на ajax. Форма Скрипт Файл-обработчик Если нужно чтобы вложение было обязательным, то в условии else прописываем ошибку: Читать далее »

/
Contact Form 7

Contact Form 7

Contact Form 7 — очень нужный плагин для модулирования различных форм обратной связи. Имеет множество дополнений. Плагин Contact Form 7 Код вставки формы Отключить обертку в <p> и добавление <br> Читать далее »

/

Добавить комментарий

Notice: Функция WP_Styles::add вызвана неправильно. Стиль с дескриптором "editor-buttons" был поставлен в очередь с незарегистрированными зависимостями: dashicons. Дополнительную информацию можно найти на странице «Отладка в WordPress». (Это сообщение было добавлено в версии 6.9.1.) in /home/t/tiberi6w/opttour.ru/public_html/wp-includes/functions.php on line 6170

Пока нет комментариев. Будь первым!

Сбор ящиков для подписки в БД
Поля особого назначения
Рекомендации для васПоля особого назначенияOpttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.