Меню

Плагин advanced custom fields настройка

Полное руководство по плагину Advanced Custom Fields

Плагин Advanced Custom Fields облегчает работу с произвольными полями WordPress. Этому плагину и посвящена данная статья.

Что такое произвольные поля в WordPress?

Произвольные поля WordPress позволяют добавлять и отображать дополнительную информацию. Например, хранить метаданные.

Произвольные поля обеспечивают большую часть функциональности плагинов и тем оформления. Например, WooCommerce использует произвольные поля для хранения дополнительной информации о продукте:

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

Когда использовать произвольные поля?

Произвольные поля обладают несколькими важными преимуществами:

WordPress предоставляет встроенный функционал произвольных полей

В классическом редакторе постов и страниц произвольные поля можно включить в «Настройках экрана». В новом блочном редакторе их можно активировать в разделе параметров:

Затем можно ввести значение и идентификатор произвольного поля.

Но это не самый удобный способ работы с произвольными полями. Поэтому многие используют плагин Advanced Custom Fields.

Advanced Custom Fields упрощает дело

Плагин Advanced Custom Fields упрощает интерфейс добавления и управления произвольными полями в административной панели и процесс их отображения на страницах сайта.

С помощью этого плагина вы сможете использовать календарь для выбора даты, чекбоксы и другие элементы управления:

Плагин предоставляет более 30 различных типов произвольных полей, которые можно добавить в посты, таксономии, комментарии и даже страницы параметров.

Бесплатная или платная версия плагина Advanced Custom Fields?

Бесплатная версия плагина доступ практически ко всем типам произвольных полей и функциям. Но версия Pro предоставляет более обширный функционал:

Как добавлять произвольные поля с помощью Advanced Custom Fields

Допустим, что есть блог о беге, в каждом посте которого автор делиться достигнутыми результатами:

Чтобы предоставить эту информацию, потребуется пять произвольных полей. Разделим это руководство на две основные части, в которых мы рассмотрим:

1. Создание новой группы произвольных полей

После установки и активации бесплатной версии плагина Advanced Custom Fields в левой боковой панели перейдите в раздел Произвольные поля > Добавить.

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

Дайте создаваемой группе полей имя, а затем выберите область ее отображения. В этом примере мы хотим вывести произвольные поля для обычных постов в блоге. Поэтому используем значение по умолчанию ( Post ).

Читайте также:  Настройка antergos после установки

Вы также можете настроить несколько правил для отображения создаваемых произвольных полей сразу в нескольких местах.

2. Добавьте произвольные поля

Нажмите кнопку «+Добавить поле», чтобы создать первое произвольное поле.

Это действие откроет перечень свойств. Два наиболее важных из них:

Далее введите варианты состояния переключателя

Рассмотрим другой пример: произвольное поле для отображения расстояния пробега. На этот раз используем тип данных «Число»:

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

Повторите этот процесс для всех других полей, которые вы хотите создать.

3. Настройте параметры и опубликуйте

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

В большинстве случаев подойдут значения по умолчанию. Но можно и поэкспериментировать с ними.

После этого опубликуйте свою группу произвольных полей, чтобы она отобразилась на сайте.

4. Добавьте дополнительную информацию в редакторе WordPress

После публикации группа произвольных полей появится при создании нового поста.

Информация, вводимая в них, будет храниться в базе данных WordPress.

Обзор условной логики

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

Допустим, автор блога захотел рассказать о своих путешествиях. Поэтому нет смысла отображать поля с информацией о беге.

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

Чтобы настроить условную логику, необходимо отредактировать ранее созданную группу полей и добавить новое поле « Да/Нет» для условия «Этот пост о беге?»:

Как отображать условные поля на сайте

Созданные произвольные поля пока не появляется на сайте.

Давайте исправим это. Существует несколько способов произвольных полей на страницах сайта:

Как добавить произвольные поля в файлы шаблона темы оформления

Это способ предполагает редактирование шаблонов используемой темы оформления. Но он гарантирует, что ваши произвольные поля всегда будут автоматически отображаться в одном и том же месте.

После этого нужно использовать функцию Advanced Custom Fields the_field() для отображения информации из произвольного поля. Например:

Например, чтобы отобразить произвольное поле «Цель», используйте приведенный ниже код:

Имя произвольного поля указано в разделе редактирования группы полей:

Скомбинировав HTML с PHP- кодом, можно получить код для отображения всех произвольных полей:

Читайте также:  Как восстановить заводские настройки на леново а536

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

Как отображать данные произвольных полей с помощью шорткода

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

После этого вы получите результат, аналогичный предыдущему.

Как отображать произвольные поля с помощью Elementor Pro

Elementor является одним из самых популярных конструкторов страниц WordPress. Он позволяет создавать страницы путем перетаскивания элементов.

Платный вариант плагина Elementor Pro позволяет создавать файлы шаблонов темы оформления и вставлять динамические данные из произвольных полей.

Для этого перейдите в раздел Templates > Theme Builder новый шаблон Elementor для поста.

После чего задайте произвольное поле, которое вы добавили с помощью Advanced Custom Fields.

Также можно использовать раскрывающийся список дополнительных опций ( Advanced ) для добавления дополнительной информации (подписи и единицы измерения).

Резюме

Используя Advanced Custom Fields, вы можете разнообразить страницы своего сайта большим количеством данных. А также собирать дополнительную информацию с помощью произвольных полей.

Источник

Как пользоваться Advanced Custom Fields

Название WordPress плагина Advanced Custom Fields переводится как – расширенные произвольные поля. Скажем по простому, что этот плагин существенно расширяет возможности уже встроенных в WordPress произвольных полей – Custom Fields. В дальнейшем я буду использовать сокращенное название плагина – ACF.

Кому будет полезен ACF?

Плагин ACF имеет один очень существенный недостаток, без базовых знаний по PHP, будет сложно править шаблоны темы, да и знания по HTML/CSS, так же окажутся не лишними. Получается, что пользоваться плагином новичку будет трудно.

ACF отлично подходит для профессиональной веб-разработки, зачастую запросы и пожелания клиентов выходят за рамки стандартного функционала WordPress-а.

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

Легенда

Заказчик ведет блог кинорецензий, в низу каждой записи с рецензией, он хочет выводить список с оценками фильма, например как здесь, не обращаем внимание на оформление.

Вы скажите: «Да не вопрос, я и без плагина справлюсь!» ОК, посмотрим.

Читайте также:  Мтс модем настройки на билайн

Вывод списка без плагина

Откроем запись со статьей в окне редактирования и пропишем теги маркированных списков с оценками.

А что не нравится, выглядит нормально, осталось только задать стили.

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

Вывод списка с плагином ACF

Сайт плагина: https://www.advancedcustomfields.com

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

Вывод произвольных полей в шаблоне

the_fields – базовая функция WordPress-а, которая выводит значение из текстового поля всех постов с аргументом text. У нас будут свои названия аргументов и HTML теги тоже другие.

Теперь надо определиться с шаблоном, куда вставлять код. Поскольку мы имеем дело с контентом, выводимом в цикле, то и вставлять следует в файл content.php, текущей темы. Я для примера использую дефолтную тему Twenty Seventeen. Вставьте код перед закрывающим тегом div с классом entry-content.

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

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

Комментарии ( 0 ):

Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.

Copyright © 2010-2021 Русаков Михаил Юрьевич. Все права защищены.

Источник

Adblock
detector