Создать тему WordPress: краткий обзор наиболее важных функций

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

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

Создать тему WordPress: Основные функции, которые должны быть в каждой теме

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

Функции wp_head() и wp_footer()

Функция wp_head() размещается непосредственно над закрывающим </head> в заголовке веб-сайта, функция wp_footer() над закрывающим тегом </body>. Обе функции интегрируют важные сценарии WordPress, и дают плагинам возможность подключать свои собственные скрипты и стили именно в эти места.  Если не использовать эти две функции, wp_head и wp_footer, проблемы возникнут не только в WordPress. Плагины которыми вы начнёте в будущем пользоваться, также не будут работать. Без wp_footer(),  черная панель администратора в верхней части экрана тоже не появится.

Функция body_class()

При создании темы, функция body_class() не является абсолютно необходимой, но для WordPress она чрезвычайно полезна или даже «почти незаменима». Встраивается эта функция в теге body, и автоматически добавляет свои собственные классы в том же теге body.  Каждая страница, пост, категории или что-то еще, получает индивидуальную коллекцию классов. Лично для меня, я думаю и для многих кто знает как создать свою тему и плотно работает с WordPress, это помощь при добавлении нужных стилей CSS. Для примера, можно посмотреть, как сейчас, выглядит тег <body> этого поста:

Как видно добавляются разные классы:

  • Post-template-default — сообщает что это стандартный шаблон.
  • Single — поскольку это шаблон для одиночной записи, добавляется этот класс.
  • Single-post — поскольку это еще более конкретно о публикации, также устанавливается данный класс (через него вы можете влиять на шаблон для постов через CSS стили).
  • Поскольку пост имеет ID 33144, также устанавливается класс postid-33144.
  • WordPress позволяет использовать различные так называемые «форматы постов». В нашем случае мы используем стандартный формат, поэтому добавлен класс single-format-standard.
  • Так как в данный момент я вошел в систему WordPress, добавляется ещё один класс, logged-in, это класс авторизированного. Ну и логично, если выйти из системы этого класса не будет.
  • Admin-bar — этот класс панели администратора, он добавляется, когда она действительно видна.
  • Класс no-customize-support установлен WordPress, так как наша тема в настоящее время не предлагает никакой поддержки настройщика.
  • Класс моей темы, классы которые я установил напрямую в body, в том числе и тот что отображает ярлык этого поста, его я установил через функцию в файле functions.php

Как добавить функцию body_class () в тег body?

Для этого нужно найти часть темы, в которой есть закрытый тег </head> и открывающий тег <body>. Обычно это файл header.php, иногда также может быть и index.php. Нашли это место? Вставьте следующий короткий код:

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

Так же с помощью массива можно вставить несколько классов:

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

Но что если вам нужно добавить класс к одной определённой статье, чтобы стилизовать что-то там через CSS.

Для этого можно использовать другой подход, а именно отдельную функцию, которая обращается к хуку выше. Конечно, можно реализовать это с помощью простого условия IF в шаблоне header.php, но это не лучший способ, если вы хотите правильно создать тему WordPress.

Добавить классы в теге body через функцию

Самый лучший способ расширить тему, не касаясь основных файлов шаблона (например, header.php), это открыть functions.php и добавить следующий код:

Иногда создавая тему на CMS WordPress, разработчику требуется на разных шаблонах задать определённый класс. Например, на главной странице один, на страннице с постами или категориями, другой класс.

Тогда, в выше написанную функцию ssh_body_classes вставляются условия:

Добавить в body класс с названием поста

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

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

Теперь в CSS я могу создать класс .ярлык-вашего-поста и, таким образом, управлять всеми элементами в body этого шаблона, делать с ними всё что угодно. Например, это может быть другая ширина контейнера для контента, более крупные заголовки h2 или какая-то анимация. Никаких ограничений, всё зависит от вашей фантазии.

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

Добавить несколько классов в body

Чтобы вставить больше классов в body, нужно просто добавить в свой код нужное количество строк в следующем формате:

Условия для работы с body

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

Удалить классы с тега body

Так же как добавить, можно и удалить классы из тега body. Сделать это можно так:

Если вы хотите научиться качественно создавать темы на Cms WordPress, вам нужно будет уметь обращаться к определенным элементам с помощью вышестоящего класса. Класс в body это то что нужно, если вы хотите какую то определённую страницу сделать не такой, как все.

Основные функция цикла WordPress

Цикл WordPress (The Loop), без которого не обойтись при создании динамической темы. Через этот цикл обрабатывается огромное количество информации, оценивается, «вырывается» из базы данных и подается. Наиболее важные функции цикла, которые являются неотъемлемой частью повседневной жизни разработчиков тем: the_post().

Функция the_post() в основном выполняется очень незаметно сразу после начала цикла while внутри цикла WordPress, а затем больше не наблюдается.

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

Только благодаря этим функциям многие другие функции могут выполнять свою работу. Функция гарантирует, что, с одной стороны, цикл может функционировать и «зацикливаться» правильно, а с другой стороны, так называемый «WP Query» может выполняться внутри этой функции, чтобы собрать всю информацию и сделать ее доступный внутри цикла. Итак, в общем, необходимо.

Функции «the_» и «get_the_»

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

Все эти функции сразу выводят контент на странице. Но иногда это может быть не всегда нужно. Часто бывает так, что необходимо обрабатывать информацию с помощью PHP, а не выводить ее. В таком случае перед функциями the_ достаточно поставить префикс get_. Тогда значение не будет сразу выводится, а может быть «присвоено» в переменную для дальнейшей обработки:

Создание темы WordPress: важная функция bloginfo() 

Чтобы сделать тему и вывести на ней всю необходимую информацию, не обойтись без функции WordPress bloginfo(), которая выводит общую информацию о странице. Такая функция является кросс-страничной и применяется ко всему веб-сайту:

Функции для объединения контента

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

get_header (), get_sidebar () и get_footer ()

Две функции используются в шаблонах, либо вверху — get_header(), либо внизу — get_footer(). Вы переносите весь html код для header и footer в соответствующие шаблоны, в файлы header.php и footer.php.

Практичность: общая информация в шапке и подвале сайта хранится отдельно и доступна для быстрого обновления или поправки. Аналогично работает функция get_sidebar(). Она вставляет содержимое sidebar.php в тему.

Функции get_header () и get_footer (), как и функция get_sidebar (), могут быть расширены с помощью терминов в скобках. Например, если вы напишете get_header(«alternativ»), функция в теме будет искать файл header-alternativ.php. Так обычно делают какие-то изменения. Например, в каком то шаблоне вам нужно в шапке другой цвет, добавить подзаголовки, вывести какие-то ссылки, социальные иконки и т.д. То есть где нужно сделать шапку сайта или подвал другим.

get_template_part () — Подключить части шаблона

Функция get_template_part() очень мощная. Она позволяет перенести часть кода темы в отдельный файл и хранить его там. Это правильная практика, а также рекомендованная WordPress. Для этого создаётся папка в теме с названием template-parts / под папки, а в ней уже создаются файлы, например, content-excerpt.php, excerpt-aside.php, content-single.php. В этом примере WordPress сначала пытается выполнить управляемый файл content-post.php в папке / template-parts /.

Чем так удобная эта функция get_template_part () ? Если файл content-post.php не найден, файл content.php автоматически загружается в качестве резервной копии. Таким образом, вы можете без особых усилий управлять запасными частями шаблона. Функцию можно даже сделать динамической, что сделает ее еще более мощной: С помощью этой функции вы теперь можете создать резервный файл navigation.php в template-parts / и создать более конкретный файл шаблона для каждого типа сообщения: navigation-page.php, navigation-post.php и т.д.

Проверка благодаря условным тегам

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

Экранирование и защита от спама

В WordPress есть различные функции, готовые для очистки контента перед его выводом через браузер. На техническом жаргоне это называется «экранирование» и очищает, возможно, «плохо» отформатированные данные.

WordPress даже имеет функцию защиты от спама. Функция antispambot() не используется, чтобы перехитрить особо умных ботов. Эта функция «шифрует» адреса электронной почты как «объекты HTML», чтобы их нельзя было прочитать в исходном коде. Браузеры знают, как это интерпретировать и правильно отображать. Посетитель ничего не замечает, спам — боты ничего не могут сделать с загадочными символами в исходном коде.

add_theme_options () — Активирует специальные функции темы

Функция add_theme_options() выполняется в файле functions.php и позволяет активировать различные дополнительные функции:

При создании темы, WordPress имеет различные интересные функции вывода

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

Создание темы WordPress — заключение и дальнейшие ссылки

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

Если ты, дорогой гость пытаешься создать тему и WordPress для тебя это только начало пути, я всегда буду рад твоему посещению этого поста. Я надеюсь что каждый сможет подчеркнуть для себя что-то важное и интересное.

Сайты, с которых я черпаю всю нужную информацию когда делаю темы на WordPress:

Категории: WordPress, Мой Блокнот Валерий 06.01.2022

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

Ваш адрес email не будет опубликован.

11 − 1 =