Вывод глобальных acf-блоков в шаблоне страницы

five women and man standing near shipping containers during daytime

Данная заметка — логическое продолжение предыдущей, когда одного универсального блока становится недостаточно. Цель заметки — показать как с помощью кода вывести значения нескольких acf-полей, хранящихся на странице настроек в шаблоне обычной страницы.

Важное замечание, я исхожу из того, что вы знакомы с плагином и у вас уже есть страница настроек и соответствующая группа acf-полей.

Добавляем новые поля

Для начала идем в группу, отвечающую за страницу настроек и добавляем новые поля. В моем случае это альтернативный глобальный блок (wordpress-редактор) и поле, в котором будем хранить шорт-код формы (текст).

Обновленная группа полей
Содержание полей на странице Настройки сайта

Изучаем файл шаблона

Какой файл шаблона нужно создать или отредактировать — тема для отдельной заметки. В нашем случае мы будем редактировать файл page.php, который отвечает за любую страницу сайта с шаблоном по-умолчанию.

В данном примере код page.php довольно простой:

<?php get_header(); ?>

<?php while ( have_posts() ) : the_post(); ?>
	<div class="pageContent">
		<div class="container">
			<div class="row">
				<div class="col-sm-12">
					<h1 class="pageTitle"><?php the_title(); ?></h1>
				</div>
			</div><!-- row -->
			<div class="row">
				<div class="col-sm-8">				
						<?php the_content(); ?>				
				</div><!-- col-sm-8 -->
				<div class="col-sm-4">
						<?php get_sidebar(); ?>
				</div><!-- col-sm-4 -->			  
			</div><!-- row -->
		</div><!-- container -->
	</div><!-- pageContent -->
 <?php endwhile; // end of the loop. ?> 
  
<?php get_footer(); ?>

Мы видим довольно стандартную html-верстку с использованием классов Bootstrap 3 и небольшое количетство php-кода с нативными функциями WordPress. Для удобства я подсветил строки, где есть вставки кода.

Разберем что есть что:
get_header() — вывести шапку сайта
while ( have_posts() ): — начало стандартного цикла WordPress
the_title() — вывести заголовок страницы
the_content() — вывести содержание страницы
get_sidebar() — вывести сайдбар
endwhile — конец цикла
get_footer() — вывести подвал сайта

В зависимости от темы html-верстка будет сильно меняться, но основные функции и цикл WordPress скорее всего будут присутствовать в шаблоне page.php

Начинаем редактирование

Плагин Advanced Custom Fields сильно упрощает процесс разработки, делая “программирование” доступным даже для тех, кто не знаком с языком PHP и только делает первые шаги в его изучении.

Функция the_field() может вывести значение любого поля в шаблоне страницы, для этого нам нужно передать данной функции название нужно поля и id страницы, с которой мы хотим подгрузить данные.

Я продолжаю работать с демо-сайтом из предыдущей заметки, поэтому я знаю id страницы настроек, он равен 34. Чтобы понять принцип работы, давайте выведем глобальный блок 1 под основным контентом

Давайте добавим следующий код <?php the_field('global_block_1',34); ?> после строки 13. Т.е. выведем Глобальный блок 1 сразу после контента страницы:

Визуально результат аналогичен тому, что мы могли получить с помощью шорткода. Разница в том, что теперь Глобальный блок 1 будет отображаться на всех страницах с дефолтным шаблоном автоматически.

Так как в этом примере у нас 3 поля, давайте их тоже добавим в шаблон. Глобальный блок 2 разместим под блоком 1, а шорткод формы выведем в сайдбаре.

Для этого <?php the_field('global_block_2',34); ?> разместим на следующей строчке после предыдущей функции, а код формы <?php the_field('global_subscribe',34); ?> выведем на следующей строке под функцией get_sidebar().

Обратите внимание, что в сайдбаре мы видим строку с шорткодом вместо формы. Дело в том, что acf-поля типа text не обрабатываются фильтром, который применяется к контенту. Можно заменить тип поля на Редактор WordPress, чтобы это исправить, но есть способ лучше.

Давайте познакомимся с функцией get_field(). Она похожа на the_field() и принимает те же параметры, но в отличии от первой не выводит данные в шаблон, а позволяет сохранить их в переменную.

Заменим <?php the_field('global_subscribe',34); ?> на следующую конструкцию:
<?php $shortcode = get_field(‘global_subscribe’,34); ?>
<?php echo do_shortcode($shortcode); ?>

Нативная функция WordPress do_shortcode() выполняет любой переданный шорткод. Echo выводит результат выполнения шорткода в шаблон страницы.

Текущий код page.php:

<?php get_header(); ?>

<?php while ( have_posts() ) : the_post(); ?>
	<div class="pageContent">
		<div class="container">
			<div class="row">
				<div class="col-sm-12">
					<h1 class="pageTitle"><?php the_title(); ?></h1>
				</div>
			</div><!-- row -->
			<div class="row">
				<div class="col-sm-8">				
						<?php the_content(); ?>	
						<?php the_field('global_block_1',34); ?>
						<?php the_field('global_block_2',34); ?>
				</div><!-- col-sm-8 -->
				<div class="col-sm-4">
						<?php get_sidebar(); ?>
						<?php $shortcode = get_field('global_subscribe',34); ?>
						<?php echo do_shortcode($shortcode); ?>
				</div><!-- col-sm-4 -->			  
			</div><!-- row -->
		</div><!-- container -->
	</div><!-- pageContent -->
 <?php endwhile; // end of the loop. ?> 
  
<?php get_footer(); ?>
В результате на каждой странице выводятся данные 3-х acf-полей

Добавить комментарий

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