Форма обратной связи wordpress без плагина!

Здравствуйте, уважаемые друзья и гости блога! Сегодня расскажу вам, как делается форма обратной связи wordpress на сайте без плагина, а в следующем своем материале, планирую рассказать о том, как делается красивая форма обратной связи wordpress при помощи плагина.

И так, давайте приступим и узнаем как делается обычная форма обратной связи wordpress на сайте без плагина …

Простая форма обратной связи wordpress на сайте без плагина!

Некоторые вебмастера, особенно начинающие, очень боятся что-то менять в движке WordPress, мотивируя это тем, что мол не знаю ничего и не разбираюсь в коде. Но ведь если Вы сами не попробуете разобраться, то и никогда не поймете и не сможете разобраться. Нужно когда-то начинать учиться!

Давайте это сделаем прямо сейчас!!!

Вот код:

function myform_action_callback() {
global $wpdb;
global $mail;
$nonce=$_POST['nonce'];
$rtr='';
if (!wp_verify_nonce( $nonce, 'myform_action-nonce'))wp_die('{"error":"Error. Spam"}');
$message="";
$to="vash_mail@help-wp.ru"; // заменить на свою почту
$headers = "Content-type: text/html; charset=utf-8 \r\n";
$headers.= "From: ".$_SERVER['SERVER_NAME']." \r\n";
$subject="Сообщение с сайта ".$_SERVER['SERVER_NAME'];
do_action('plugins_loaded');
if (!empty($_POST['name']) && !empty($_POST['mess']) && !empty($_POST['email'])){
$message.="Имя: ".$_POST['name'];
$message.="<br/>E-mail: ".$_POST['email'];
$message.="<br/>Сообщение:<br/>".nl2br($_POST['mess']);
if(wp_mail($to, $subject, $message, $headers)){
$rtr='{"work":"Сообщение отправлено!","error":""}';
}else{
$rtr='{"error":"Ошибка сервера."}';
}
}else{
$rtr='{"error":"Все поля обязательны к заполнению!"}';
}
echo $rtr;
exit;
}
add_action('wp_ajax_nopriv_myform_send_action', 'myform_action_callback');
add_action('wp_ajax_myform_send_action', 'myform_action_callback');
function myform_stylesheet(){
wp_enqueue_style("myform_style_templ",get_bloginfo('stylesheet_directory')."/css/styleform.css","0.1.2",true);
wp_enqueue_script("myform_script_temp",get_bloginfo('stylesheet_directory')."/js/scriptform.js",array('jquery'),"0.1.2",true);
wp_localize_script("myform_script_temp", "myform_Ajax", array( 'ajaxurl' => admin_url( 'admin-ajax.php' ), 'nonce' => wp_create_nonce('myform_action-nonce') ) );
}
add_action( 'wp_enqueue_scripts', 'myform_stylesheet' );
function formZak() {
$rty='<div class="form">';
$rty.='<div class="line"><input id="name" type="text" placeholder="Имя"/></div>';
$rty.='<div class="line"><input id="email" type="text" placeholder="Почта"/></div>';
$rty.='<div class="line"><textarea id="mess" placeholder="Сообщение"></textarea></div>';
$rty.='<div class="line"><input type="submit" onclick="myform_ajax_send(\'#name\',\'#email\',\'#mess\'); return false;" value="Отправить"/></div>';
$rty.='</div>';
return $rty;
}
add_shortcode( 'formZak', 'formZak' );

Его Вы должны скопировать и вставить в файл functions.php вашей рабочей темы оформления сайта.

Затем в данном коде найдите вот такую строку ($to=”vash_mail@help-wp.ru”; // заменить на свою почту) и просто замените в ней на свой e-mail, куда вам должны приходить письма.

Следующее действие, которое Вы должны сделать – это создать пару папок: “css” и “js“. Если такие папки в вашей теме оформления сайта есть, то создавать их не нужно!

Теперь в папке “css” создаем файл стилей “styleform.css” и оставляем его пустым, так как для работы нашего примера стили необязательны, но если Вы захотите их в дальнейшем применить, то это будет возможно сделать, просто закачав их в данную директорию.

В папке “js” создаем файл “scriptform.js“, а вот в нем нужно будет сделать некоторые действия, чтобы наша форма обратной связи wordpress заработала – вставляем туда вот этот код:

function myform_ajax_send(name,email,mess){
jQuery.ajax({
type: 'POST',
url: myform_Ajax.ajaxurl,
dataType:'json',
data:{
'name':jQuery(name).val(),
'email':jQuery(email).val(),
'mess':jQuery(mess).val(),
'nonce': myform_Ajax.nonce,
'action':'myform_send_action'
},
success: function (data) {
if(data.error==""){
alert(data.work);
}else{
alert(data.error);
}
},
error: function () {
alert("Ошибка соединения");
}
});
}

Вот теперь наша форма обратной связи wordpress для сайта практически готова к использованию. Осталось лишь закачать все эти файлы к вам на хостинг и можно начинать пользоваться.

А чтобы форма обратной связи wordpress начала у Вас работать, то вам нужно вставить вот такой шорткод [formZak] в любое место на вашем сайте, в пост или запись или еще куда-то.

А если вам нужно вызвать форму из пхп, например в низу страницы воспользуйтесь вызовом шорткодов: