Представляю вашему вниманию инструкция как сделать форму для сайта WordPress, с помощью которой можно публиковать новый пост с фронт-енда, то есть прямо с сайта, не заходя в админ-панель.
Эта форма создается с помощью плагина Advanced Custom Fields Pro.
Вторая часть этой статьи посвящена Редактированию созданной статьи во фронт-енде.
Создать такие формы мне помогли статьи с сайта The Stiz Media.
Шаг1. Создать поля формы
У меня получилось три блока полей. Два для обязательных полей и один блок для дополнительных. Обязательные поля я разбила на две части, так как хотела, чтобы дополнительные размещались внутри обязательных.
Лучше всего скачать мои поля, которые я экспортировала, а после импортировать на ваш сайт с помощью Экспорта/импорта ACF Pro.
Обязательные поля включают в себя:
- Заголовок (текст)
- Категория (таксономия)
- Миниатюра (изображение)
- Содержание (Редактор WYSIWYG)
- Метки (таксономия) — часть 2
Дополнительные поля в моем примере создавались для формы добавления рецепта. Это два поля repeater. Вы можете использовать любые свои.
После того как вы создали или импортировали поля формы, нужно обязательно запомнить (записать) ID групп полей. Узнать ID можно так, навести мышку на изменить нужного поля, а внизу увидите ID в ссылке
В моем примере три группы полей с соответствующими ID. У вас они будут в любом случае другими даже если импортировался мой файл.
Шаг2. Создать шаблон
Далее нужно создать шаблон. Мой шаблон создан для темы Nirvana, но думаю его достаточно легко откорректировать для любой другой темы.
Скачанный шаблон нужно разместить в тему сайта, в моем случае это /wp-content/themes/nirvana/. Сделать это лучше всего с помощью FTP клиента.
Рассмотрим полный код шаблона:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
<?php /** * Template Name: Новый пост во фронт-енде * * @author Web First Step * @link https://stepfor.top/new_post_acf_pro/ * @uses Advanced Custom Fields Pro */ /** * Добавить обязательную функцию acf_form_head() в самый верх страницы */?> <?php acf_form_head();?> <?php get_header();?> <?php the_post();?> <section id="container" class="<?php echo nirvana_get_layout_class(); ?>"> <div id="content" role="main"> <?php cryout_before_content_hook();?> <h1>Добавить новый пост:</h1> <?php //если пользователь не вошел на сайт if ( !( is_user_logged_in() ) ) {?> <center><strong>Только зарегистрированные пользователи могут добавить свой рецепт </strong><br /><br /><br /> Пожалуйста, зарегистрируйтесь или войдите.<br /><br /></center> <?php } else { $new_post = array( 'post_id' => 'new', // Создать новый пост // ОБЯЗАТЕЛЬНО ПОМЕНЯЙТЕ ID ПОЛЕЙ НА СВОИ 'field_groups' => array(1210, 1215, 1208), // Группы полей для создания поста 'form' => true, 'return' => '%post_url%', // Переадресация на url созданного поста 'html_before_fields' => '', 'html_after_fields' => '', 'submit_value' => 'Добавить', 'updated_message' => 'Сохранено!!!' ); acf_form( $new_post ); } ?> </div><!-- #content --> <?php nirvana_get_sidebar(); ?> </section><!-- #container --> <?php get_footer(); ?> |
В нем обязательно нужно указать свои ID групп полей, то есть цифры 1210, 1215, 1208 заменить на свои.
Шаг3. Создать страницу на сайте с использованием созданного шаблона.
Шаблон создан, теперь нужно создать страницу на сайте, с использованием шаблона. Для этого создаете новую страницу как обычно, даете ей любой название, например «Добавить статью» и справа в Шаблонах выбираете добавленный шаблон — Новый пост во фронт-енде.
Сохраните страницу.
Страница с формой добавления нового поста с фронт-енда готова. Но она пока не работает))
Шаг4. Добавить функцию acf/pre_save_post
Для того чтобы форма заработала нужно добавить функцию acf/pre_save_post в файл function.php
В первую очередь убедитесь, что у вас в Редактировании группы полей поставлена галочка:
Вам нужно заменить ключи полей (Fields Key), если вы создавали поля самостоятельно.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 |
// Новый пост с фронтенда function my_pre_save_post( $post_id ) { // Проверить что пост новый if( $post_id != 'new' ) { return $post_id; } // Создание нового поста $post = array( 'post_type' => 'post', // Your post type ( post, page, custom post type ) 'post_status' => 'private', // (publish, draft, private, etc.) 'post_title' => wp_strip_all_tags($_POST['acf']['field_54dfc93e35ec4']), // Заголовок ACF field key 'post_content' => $_POST['acf']['field_5509d61f8541f'], // Содержание ACF field key ); // insert the post $post_id = wp_insert_post( $post ); // update $_POST['return'] $_POST['return'] = add_query_arg( array('post_id' => $post_id), $_POST['return'] ); return $post_id; } add_filter('acf/pre_save_post' , 'my_pre_save_post', 10, 1 ); /** * Сохранение изображения ACF field как миниатюры */ add_action( 'acf/save_post', 'tsm_save_image_field_to_featured_image', 10 ); function tsm_save_image_field_to_featured_image( $post_id ) { // Bail early if no ACF data if( empty($_POST['acf']) ) { return; } // Миниатюра ACF field key $image = $_POST['acf']['field_55003d1d76fc1']; // Bail if image field is empty if ( empty($image) ) { return; } // Add the value which is the image ID to the _thumbnail_id meta data for the current post add_post_meta( $post_id, '_thumbnail_id', $image ); } |
В этой функции нужно заменить все field keys (ключи полей) на свои собственные, но если вы импортировали мой файл, тогда этого делать не нужно так как ключи совпадают.
Теперь форма работает, но только для зарегистрированных пользователей.
При добавлении поста выдает белую страницу с ошибкой:
Warning: Cannot modify header information — headers already sent by (output started at /myhost/wp-content/themes/mytheme/header.php:3) in /myhost/wp-includes/pluggable.php on line 1179
Хотя в бекэнде wordpress запись появляется…
Update: С выводом ошибки- разобрался, уточните, что для корректного использования в подвал следует еще добавить:
Вопрос: Как при успешной отправке поста и вывода сообщения осуществить сброс всех полей? Просто они остаются заполненными…
Заранее спасибо!
Для того, чтобы поля очищались после сохранения, необходимо заменить:
‘post_id’ => ‘new’
на:
‘post_id’ => ‘new_post’
и в functions.php заменить:
if( $post_id != ‘new’ ) {
на:
if( $post_id != ‘new_post’ ) {
Не получилось. В меню страница Библиотека шаблон новый пост во фронт — енде. Открываю а там ничего нет
Сергей, давайте подробнее разберемся что именно вы сделали и на каком этапе не работает.