Добавить новое сообщение, используя страницу внутри веб-сайта

Я искал несколько часов, чтобы найти способ вставки «Добавить новую запись» внутри страницы в интерфейсе. Я прочитал этот пост, но, к сожалению, ответа на него нет.

Я добавил форму входа на другую страницу (example.com/user-login), и я хочу, чтобы страница (example.com/add-post) позволяла человеку, который вошел в систему, опубликовать сообщение в страницы, которая находится в теме WordPress.

Точно так же, как метод по умолчанию публикации публикации (example.com/wp-admin/post-new.php), но без перехода на панель инструментов WordPress.

Я нашел несколько плагинов, которые позволяют гостевые сообщения , но я хочу, чтобы кто-то, кто вошел в систему , мог отправлять сообщения.

Вы никогда не читали документацию WP?

Создайте любой шаблон и форму, и при отправке формы она может быть

Пример:

$args = array('post_type'=>'post', 'post_title'=>'your title', 'post_status'=>'publish', 'post_content'=>'post content'); wp_insert_post ($args); 

Это позволит любой почтовой странице или пользовательскому типу сообщения вставить сообщение

Это довольно просто. Так просто вам нужно убедиться, что ваши гости не вставляют в вас плохой код. Поэтому ознакомьтесь с информацией о проверке данных и подтверждении Sanitizing and Escaping User Data, прежде чем добавлять что-либо на свой сайт из front-end формы.

  1. Создать новую страницу в /new-post
  2. Создание шаблона страницы для таргетинга на эту страницу
  3. Настройка действий AJAX
  4. Внесите свою форму внутри шаблона пользовательской страницы.
  5. Используйте jQuery для отправки данных формы в AJAX
  6. Действие AJAX будет проверять данные
  7. Если это хорошо, новая должность будет создана
  8. AJAX выдаст сообщение об успешном завершении или сбое
  9. jQuery в форме front-end будет информировать пользователя об успехе или неудаче.

Сначала создайте страницу с именем new-post которая будет содержать вашу форму. Затем создайте шаблон страницы для таргетинга на эту страницу, используя страницу структуры файла – page-{slug}.php .

 page-new-post.php 

На этой странице вы можете проверить, есть ли is_user_logged_in и если у них есть возможность создавать сообщения, используя current_user_can . Если нет, вы всегда можете wp_redirect в другом месте или просто wp_die .

Вам нужно будет сделать все это с помощью AJAX, чтобы создать интерфейсную форму, которая при нажатии; отправляет данные в WP, проверяет и создает новое сообщение.

Обратите внимание на _nopriv который вы не хотите использовать в своем случае, потому что кто-то будет спамить ваш сайт на обход.

 // AJAX for logged in users add_action( 'wp_ajax_create_new_post', 'ajax_create_new_post_action' ); // AJAX for non-logged in users add_action( 'wp_ajax_nopriv_create_new_post', 'ajax_nopriv_create_new_post_action' ); 

После того как вы собрали данные и ajax_create_new_post_action их в своем ajax_create_new_post_action вам нужно будет создать новую запись с помощью wp_insert_post .


Поскольку есть несколько шагов, я рекомендую генерировать большую часть этого автоматически, используя WP Secure Forms и заполняя пробелы после. Вот пример формы отправки электронной почты AJAX, чтобы дать вам довольно хороший обзор частей AJAX, включая дезинфекцию.

Шаблон для WP Secure Forms

 Title {30 characters limit} > * 30 | Your Title ! Field specific error message Textarea{150 characters limit} > 150 | Content | | ! Field specific error message This label is invisible > H 

форма

Этот скрипт входит в файл PHP вашей темы.

 <p id="wpse_form_message_wrap" class="secureforms-message-wrap"></p> <form id="wpse_form" method="post"> <div id="wpse_form_10000-wrapper"> <label for="wpse_form_10000">* Title <span>30 characters limit</span></label> <input type="text" name="wpse_form_10000" id="wpse_form_10000" value="" placeholder="Your Title" required="required" maxlength="30" /> <p class="secureforms-error-msg">Field specific error message</p> </div> <div id="wpse_form_20000-wrapper"> <label for="wpse_form_20000">Textarea{150 characters limit}</label> <textarea rows="3" name="wpse_form_20000" id="wpse_form_20000" value="" maxlength="150" ></textarea> <p class="secureforms-error-msg">Field specific error message</p> </div> <div id="wpse_form_30000-wrapper" class="secureforms-hidden-wrapper"> <input id="wpse_form_30000" name="wpse_form_30000" type="hidden"> </div> <div id="wpse_form_footer"> <input type="hidden" id="check_wpse_form" name="check_wpse_form" value="" /> <input type="hidden" name="action" value="wpse_form" /> <?php echo wp_nonce_field('wpse_form', '_nonce_eklwu', true, false); ?> <input type="submit" name="wpse_form_submit_btn" id="wpse_form_submit_btn" value="Submit" /> </div> </form> 

functions.php

Это входит в ваши функции. Php

 // WP SECURE FORMS - EMAIL VALIDATION & SENDING require_once( 'ajax/wpse_form.php' ); // WP SECURE FORMS - ENQUEUE EMAIL JS function enqueue_ajax_wpse_form() { if (!is_admin()) { wp_enqueue_script( 'ajax_wpse_form', get_template_directory_uri().'/ajax/wpse_form.js', array('jquery'), '', true ); wp_localize_script( 'ajax_wpse_form', 'ajax_wpse_form', array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) ); } } add_action( 'wp_enqueue_scripts', 'enqueue_ajax_wpse_form', 999 ); 

Проверка

В папке темы создайте папку «ajax» с файлом wpse_form.php. Вставьте в него код ниже.

 <?php function ajax_wpse_form_action() { if ($_SERVER["REQUEST_METHOD"] == "POST"){ $return_message = ''; $status = 'success'; $fields_with_errors = array(); // validate nonce if(!wp_verify_nonce($_POST['_nonce_eklwu'], $_POST['action'])){ $status = 'error'; } // validate hidden field if(!empty(trim($_POST['check_wpse_form']))){ $status = 'error'; } if ($status == 'error') { $return_message = 'Data verification error. Check marked fields.'; } else { $wpse_form_10000 = strip_tags(trim(stripslashes($_POST['wpse_form_10000']))); if(!empty($wpse_form_10000)){ if(strlen($wpse_form_10000) > 30){ $status = 'error'; $fields_with_errors[] = 'wpse_form_10000'; } } else { $status = 'error'; $fields_with_errors[] = 'wpse_form_10000'; } $wpse_form_20000 = strip_tags(trim(stripslashes($_POST['wpse_form_20000']))); if(!empty($wpse_form_20000)){ if(strlen($wpse_form_20000) > 150){ $status = 'error'; $fields_with_errors[] = 'wpse_form_20000'; } } $wpse_form_30000 = strip_tags(trim(stripslashes($_POST['wpse_form_30000']))); if ($status == 'error') { $return_message = 'Data verification error. Check marked fields.'; } else { // message $to = 'email@yourdomain.com'; $header = 'From: '. get_bloginfo('name') . ' <contact@yourdomain.com>'.PHP_EOL; $subject = 'Test Email Subject'; $formMessage = ''; $formMessage .= 'Title {30 characters limit}' . "\n"; $formMessage .= $wpse_form_10000 . "\n\n"; $formMessage .= 'Textarea{150 characters limit}' . "\n"; $formMessage .= $wpse_form_20000 . "\n\n"; $formMessage .= 'This label is invisible' . "\n"; $formMessage .= $wpse_form_30000 . "\n\n"; if ( wp_mail($to, $subject, $formMessage, $header) ) { $return_message = 'Thank you for contacting us. We will get in touch as soon as possible.'; } else { $status = 'error'; $return_message = 'There was an error sending the message. Please try again.'; } } } $resp = array( 'status' => $status, 'return_message' => $return_message, 'fields_with_errors' => $fields_with_errors, ); header( "Content-Type: application/json" ); echo json_encode($resp); die(); } else { http_response_code(403); } } add_action( 'wp_ajax_wpse_form', 'ajax_wpse_form_action' ); add_action( 'wp_ajax_nopriv_wpse_form', 'ajax_wpse_form_action' ); 

AJAX

В папке темы создайте папку «ajax» с файлом с именем wpse_form.js. Вставьте в него этот код.

 jQuery(document).ready(function($) { var wpse_form_btn = $('#wpse_form_submit_btn'); function init_wpse_form(){ /* VARS */ var form = $('#wpse_form'), type = form.attr('method'), requiredFields = ['wpse_form_10000 | textline']; /* FUNCTIONS */ function showErrors(fieldsWithErrors){ form.find('.hasError').removeClass('hasError').end().find('.secureforms-error-msg.active').removeClass('active'); for(var i=0; i< fieldsWithErrors.length; i++){ if(fieldsWithErrors[i].length > 0){ $('#' + fieldsWithErrors[i]).addClass('hasError').next().addClass('active'); } } } /* TRIGGER */ wpse_form_btn.on('click', function(e){ e.preventDefault(); e.stopPropagation(); if($('#check_wpse_form').val()){ return false; } else { var emptyErrors = []; for(var i = 0; i<requiredFields.length; i++){ var fieldData = requiredFields[i].split(' | '), field = $('#' + fieldData[0]), fieldType = fieldData[1]; if(fieldType == 'select'){ var selected = field.find(':selected'); if(selected.length > 0){ if(selected.val() == 'wpse_form_select_null'){ emptyErrors.push(fieldData[0]); } } else { emptyErrors.push(fieldData[0]); } } else if(fieldType == 'radio' || fieldType == 'checkbox'){ if(field.find('input:checked').length <= 0){ emptyErrors.push(fieldData[0]); } } else { if(!field.val()){ emptyErrors.push(fieldData[0]); } } } if(emptyErrors.length > 0){ showErrors(emptyErrors); $('#wpse_form_message_wrap').removeClass('success').addClass('error').text('Please fill all the required fields'); return false; } else { var data = form.serialize(); $.ajax({ type: type, url: ajax_wpse_form.ajax_url, data: data, dataType: 'json', success: function(response) { if (response.status == 'success') { $('#wpse_form_message_wrap') .removeClass('error') .addClass('success') .text(response.return_message); showErrors([]); } else { $('#wpse_form_message_wrap') .removeClass('success') .addClass('error') .text(response.return_message); showErrors(response.fields_with_errors); } }, error: function(xhr,err){ console.log("readyState: "+xhr.readyState+"\ status: "+xhr.status); console.log("responseText: "+xhr.responseText); } }) } } }); }; if(wpse_form_btn.length > 0){ init_wpse_form(); } }); 

JS

Вставьте этот код в основной файл js вашей темы.

 $('body').on('click', 'input[type=radio]', function(){ var wrapper = $(this).parent(), triggers = wrapper.find('.isTrigger'); if(triggers.length > 0){ triggers.each(function(){ if($(this).is(':checked')){ $('.' + $(this).attr('data-toggle')).slideDown(200); } else { $('.' + $(this).attr('data-toggle')).slideUp(200); } }) } }) $('body').on('click', 'input[type=checkbox]', function(){ var that = $(this), wrapper = that.parent(), limit = wrapper.attr('data-limit'), chosen = wrapper.find('input:checked').length; // disabling / enabling choices if(that.is(':checked')){ if(chosen + 1 > limit){ wrapper.find('input').not(':checked').prop('disabled', true); } } else { wrapper.find('input').prop('disabled', false); } // conditional showing / hiding fields if(that.hasClass('isTrigger')){ var targetClass = that.attr('data-toggle'); if(that.is(':checked')){ $('.' + targetClass).slideDown(200); } else { $('.' + targetClass).slideUp(200); } } }) $('body').on('change', 'select', function(){ var that = $(this), wrapper = that.parent(), triggers = wrapper.find('.isTrigger'), options = wrapper.find('option'); if(triggers.length > 0){ options.each(function(){ if($(this).is(':selected')){ if($(this).hasClass('isTrigger')){ $('.' + $(this).attr('data-toggle')).slideDown(200); } } else { if($(this).hasClass('isTrigger')){ $('.' + $(this).attr('data-toggle')).slideUp(200); } } }) } }) 

CSS

Вставьте код ниже в основной файл css вашей темы.

 form>div, form>p{ margin-top: 0; margin-bottom: 1em; } form fieldset { margin: 0; border: none; padding: 0; } form label, form legend{ display: block; margin-bottom: .25em; } form label span, form legend span{ font-size: .8em; font-style: italic; } form label span::before, form legend span::before{ content: ''; display: block; } input[type="checkbox"]+label, input[type="radio"]+label, input[type="number"]+label{ display: inline-block; } form .showOnTrigger{ display: none; } .secureforms-error-msg{ display: none; color: red; } .secureforms-error-msg.active{ display: block; } .secureforms-hidden-wrapper{ display: none; } .secureforms-message-wrap.error{ border: 2px solid red; } .secureforms-message-wrap.success{ border: 2px solid green; }