fbpx
Перейти к содержимому

Новый пост с фронт-енда с помощью Advanced Custom Fields Pro

Новый пост с фронт-енда с помощью Advanced Custom Fields ProПредставляю вашему вниманию инструкция как сделать форму для сайта WordPress, с помощью которой можно публиковать новый пост с фронт-енда, то есть прямо с сайта, не заходя в админ-панель.
Эта форма создается с помощью плагина Advanced Custom Fields Pro.

Вторая часть этой статьи посвящена Редактированию созданной статьи во фронт-енде.

Создать такие формы мне помогли статьи с сайта The Stiz Media.

Шаг1. Создать поля формы

У меня получилось три блока полей. Два для обязательных полей и один блок для дополнительных. Обязательные поля я разбила на две части, так как хотела, чтобы дополнительные размещались внутри обязательных.

Лучше всего скачать мои поля, которые я экспортировала, а после импортировать на ваш сайт с помощью Экспорта/импорта ACF Pro.

Обязательные поля включают в себя:

  • Заголовок (текст)
  • Категория (таксономия)
  • Миниатюра (изображение)
  • Содержание (Редактор WYSIWYG)
  • Метки (таксономия) — часть 2

Дополнительные поля в моем примере создавались для формы добавления рецепта. Это два поля repeater. Вы можете использовать любые свои.

После того как вы создали или импортировали поля формы, нужно обязательно запомнить (записать) ID групп полей. Узнать ID можно так, навести мышку на изменить нужного поля, а внизу увидите ID в ссылке
front-end-acf

В моем примере три группы полей с соответствующими ID. У вас они будут в любом случае другими даже если импортировался мой файл.

Шаг2. Создать шаблон

Далее нужно создать шаблон. Мой шаблон создан для темы Nirvana, но думаю его достаточно легко откорректировать для любой другой темы.

Скачанный шаблон нужно разместить в тему сайта, в моем случае это /wp-content/themes/nirvana/. Сделать это лучше всего с помощью FTP клиента.

Рассмотрим полный код шаблона:

Больше статей:   Замена внутренних ссылок сайта на wordpress через phpMyAdmin. Меняем ссылки http на https быстро.

В нем обязательно нужно указать свои ID групп полей, то есть цифры 1210, 1215, 1208 заменить на свои.

Шаг3. Создать страницу на сайте с использованием созданного шаблона.

Шаблон создан, теперь нужно создать страницу на сайте, с использованием шаблона. Для этого создаете новую страницу как обычно, даете ей любой название, например «Добавить статью» и справа в Шаблонах выбираете добавленный шаблон — Новый пост во фронт-енде.
Новый пост с фронт-енда с помощью Advanced Custom Fields Pro

Сохраните страницу.
Страница с формой добавления нового поста с фронт-енда готова. Но она пока не работает))

Шаг4. Добавить функцию acf/pre_save_post

Для того чтобы форма заработала нужно добавить функцию acf/pre_save_post в файл function.php
В первую очередь убедитесь, что у вас в Редактировании группы полей поставлена галочка:

Новый пост с фронт-енда с помощью Advanced Custom Fields Pro
Вам нужно заменить ключи полей (Fields Key), если вы создавали поля самостоятельно.

В этой функции нужно заменить все field keys (ключи полей) на свои собственные, но если вы импортировали мой файл, тогда этого делать не нужно так как ключи совпадают.

Теперь форма работает, но только для зарегистрированных пользователей.

Демонстрация работы формы

4 комментария для “Новый пост с фронт-енда с помощью Advanced Custom Fields Pro”

  1. При добавлении поста выдает белую страницу с ошибкой:

    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: С выводом ошибки- разобрался, уточните, что для корректного использования в подвал следует еще добавить:

    Вопрос: Как при успешной отправке поста и вывода сообщения осуществить сброс всех полей? Просто они остаются заполненными…
    Заранее спасибо!

    1. Для того, чтобы поля очищались после сохранения, необходимо заменить:
      ‘post_id’ => ‘new’
      на:
      ‘post_id’ => ‘new_post’

      и в functions.php заменить:
      if( $post_id != ‘new’ ) {
      на:
      if( $post_id != ‘new_post’ ) {

  2. Не получилось. В меню страница Библиотека шаблон новый пост во фронт — енде. Открываю а там ничего нет

Добавить комментарий для Дмитрий Отменить ответ

Ваш адрес email не будет опубликован. Обязательные поля помечены *