Как создать страницу Options Page в ACF PRO для сайта

Обзор

Страницы опций — это страницы настроек в админке WordPress, содержащие поля, с помощью которых можно управлять глобальными параметрами. Это позволяет разработчикам или клиентам внести одно изменение и обновить контент, который отображается в разных местах сайта: контактную информацию, призывы к действию или уведомления о распродажах и специальных мероприятиях.

Более продвинутая страница опций может даже позволить клиентам переключаться между совершенно разными дизайнами сайта всего за несколько кликов. Главная сложность страниц опций — их разработка, поскольку это часто занимает много времени и требует много ручной работы.

функция Options Page, выпущенная в ACF PRO 6.2, даёт вам возможность регистрировать новые страницы опций в админке WordPress, не нарушая рабочий процесс и не написав ни одной строки кода. Это чрезвычайно мощный инструмент с почти безграничными возможностями, но сначала важно понять основы. В этом руководстве мы покажем, как использовать ACF PRO для создания страницы опций, которая работает как уведомляющая панель по всему сайту.

Панель уведомления будет отображаться в верхней части всего сайта, поэтому это идеальный пример того, что удобно управлять с отдельной страницы «Site Settings». Мы добавим функции, которые позволят редакторам включать и выключать панель, а также добавлять собственное сообщение.

Ниже приведён список шагов для настройки нашей уведомляющей панели по всему сайту:

Создать новую страницу опций
Создать новую группу полей
Проверить, что группа полей назначена на страницу опций
Добавить код для обработки логики отображения (показывать, если включено, и скрывать, если выключено)

Видео ниже покажет шаги, которые мы выполним, и итоговый результат.

Создайте новую страницу опций

Сначала нам нужно создать новую страницу опций с названием «Site Settings». В меню ACF выберите Options Pages, а затем нажмите Add New, чтобы создать новую страницу опций. Нажмите в поле Page Title и оставьте значение по умолчанию «Настройки сайта». Затем нажмите в поле Menu Slug и снова оставьте значение по умолчанию «site-settings».

Пока оставьте значение «Parent Page» как «No Parent». Позже мы рассмотрим, как создать дочернюю страницу опций. Не забудьте сохранить изменения.

Оставайтесь в потоке! При первом сохранении новой страницы опций вверху появится уведомление с предложением либо «Добавить поля», либо «Привязать существующие группы полей». Это помогает не выпадать из рабочего процесса при создании новых страниц опций, групп полей, типов записей и таксономий.

Создайте новую группу полей

Теперь, когда у нас есть страница опций Site Settings, нужно назначить ей поля. Мы начнём с поля Group, а затем добавим поле True/False и поле Text Area в разделе «Sub Fields» у поля Group. Вот как будет выглядеть настройка нашей группы полей для панели уведомления:

Поле Group для организации остальных полей.
- Метка поля: Панель уведомлений
- Имя поля: notification_bar
- Параметр «Layout» (внизу) управляет тем, как поле Group отображает поля внутри себя. В этом случае мы выберем Строка.
Поле True/False для включения и выключения панели уведомления.
- Метка поля: Уведомление вкл./выкл.
- Имя поля: notification_onoff
- На вкладке «Presentation» включите Stylized UI, а затем задайте текст «Вкл.» и «Выкл.».
Поле Text Area для того, чтобы редакторы могли добавить собственное сообщение, когда панель уведомления отображается.
- Метка поля: Сообщение уведомления
- Имя поля: notification_message
- Нажмите вкладку Conditional Logic и включите её. Задайте значения для «Show this field if» как Notification On/Off, Value is equal to и Checked. Это сделает поле Text Area видимым для редакторов только тогда, когда панель уведомления включена.

Сохраните изменения и переходите к следующему шагу.

Задайте правила размещения для страницы опций

Любую группу полей можно связать со страницей опций на вкладке «Location Rules», которая находится в разделе «Settings» внизу редактора группы полей. В блоке «Show this field group if» выберите Options Page, is equal to, а затем страницу, с которой нужно связать группу полей.

К счастью, мы использовали бесшовный рабочий процесс ACF, чтобы автоматически связать нашу группу полей при создании, сразу после инициализации новой страницы опций Site Settings. Это автоматически создаёт правило, которое показывает группу полей только на странице Site Settings. Вы можете добавить дополнительные правила с помощью кнопок «и» и «или», чтобы точнее настроить условия отображения группы полей.

Не забудьте сохранить изменения. Теперь, когда вы откроете новую страницу Site Settings в админке WordPress, вы должны увидеть группу полей панели уведомления.

Добавьте код логики отображения

Мы воспользуемся удобным действием WordPress wp_body_open, чтобы подключить и вывести нашу панель уведомлений в верхней части страницы. Вот несколько строк кода, которые нам нужны:

<?php
/**
 * Получить сообщение уведомления сайта и вывести его.
 *
 * @return void
 */
function demo_acf_output_notification() {
    $has_notice = get_field( 'notification_bar', 'options' );

    if ( ! $has_notice || ! $has_notice['notification_onoff'] ) {
        return;
    }
    ?>

    <div class="notification-bar">
        <div class="notification-bar__wrapper">
            <p class="notification-bar__text"><?php echo wp_kses_post( $has_notice['notification_message'] ); ?></p>
        </div>
    </div>
    <?php
}
// Уведомление нужно вывести сразу после открывающего тега body.
add_action( 'wp_body_open', 'demo_acf_output_notification' );

После того как вы добавите код логики отображения, вы должны увидеть панель уведомлений на внешней части сайта, если она включена. Разумеется, вы можете применить собственные стили CSS, чтобы добиться нужного внешнего вида.

Создание дочерней страницы опций

На этом можно не останавливаться. Вы можете создавать дополнительные страницы опций и даже вкладывать дочерние страницы в родительские. Страницы опций можно назначить дочерними как во время создания, так и позже — на экранах «Add New Options Page» или «Edit Options Page» в области «Parent Page». Это позволяет сделать страницу опций дочерней по отношению к любой части админки WordPress. Это включает и любые страницы опций, которые вы уже создали, оставив для «Parent Page» значение No Parent.

Пока мы рассмотрели всё, что нужно для создания новых страниц опций в интерфейсе ACF PRO, но на этом доступные возможности не заканчиваются. Включение Advanced Configuration открывает доступ к мощным настройкам, влияющим на видимость, метки и разрешения страницы опций.

Изменение положения меню страницы опций

Например, вы можете пойти ещё дальше и задать приоритет положения пункта меню вашей страницы опций в админке WordPress, а также назначить собственную иконку с помощью Dashicons. Оба этих параметра находятся на вкладке «Visibility».

Чтобы изменить положение пункта меню, введите числовое значение, соответствующее структуре меню, используемой WordPress.

Заключение

Функция Options Pages в ACF PRO позволяет дать редакторам централизованную область для управления функциями по всему сайту. Это простая концепция с очень широким спектром применения. Обязательно напишите нам в Twitter и расскажите, как вы использовали функцию Options Page в ACF PRO. Мы уверены, что вы нас удивите.

Добивайтесь лучших результатов с полями и возможностями ACF PRO с помощью наших руководств о том, как создать свой первый ACF Block, как использовать поле Repeater, как создавать макеты с помощью поля Flexible Content и как использовать поле Gallery.

Обновлено: 01.06.2026

Как создать страницу Options Page