WordPress Shortcode API был введен в WordPress в версии 2.5. С тех пор он стал широко используемым методом, позволяющим быстро настраивать макет и вставлять определенные фрагменты форматирования. Но шорткоды могут быть одинаково полезны при создании тем WordPress — вот как вы можете в полной мере использовать их!
Вступление
У шорткодов есть много преимуществ, если они правильно используются в файлах тем. Если вы знакомы с макросами препроцессора в C / C ++, то шорткоды могут выполнять несколько похожую функцию в WordPress. Основная цель использования шорткода — заменить заполнитель вашим собственным фрагментом HTML-кода, когда сервер отправляет страницу на клиентскую сторону. Шаги, вовлеченные в создание и реализацию коротких кодов, следующие.
- Создайте пользовательскую функцию для шорткода. Эта функция возвращает HTML, который будет заменять шорткод в файле темы.
- Добавьте шорткод в систему, чтобы WordPress мог распознавать ваши шорткоды, вставленные в файлы темы.
- Используйте шорткоды в файле темы по мере необходимости.
В этом кратком совете мы собираемся использовать шорткоды для отображения пользовательских сообщений. Я дал подробное объяснение о том, как создавать собственные типы сообщений и использовать пустые темы в Nettuts +, но для этого примера мы будем изменять стандартную тему TwentyTen, предоставляемую WordPress.
Шаг 1. Написание функции шорткода
Функция, которую вы создаете для своего шорткода, фактически определяет назначение шорткода. Базовая функция может быть определена следующим образом (вы можете добавить весь код внизу вашего файла functions.php):
|
01
02
03
04
05
06
07
08
09
10
11
12
13
|
// Defining the function used for displaying the Custom Project Post.
function project_shortcode( $atts ) {
// Extracting the arguments for the shortcode.
extract( shortcode_atts( array(
‘limit’ => ’10’,
‘orderby’ => ‘date’,
), $atts ) );
/* This is were we will write the code for fetching data
* and build the HTML structure to be returned in the $output variable
*/
$output = ‘This will contain the final HTML output for your custom project loop.’;
return $output;
}
|
Только не оставляйте пробелы в конце файла functions.php, так как это может вызвать проблемы. Теперь давайте добавим некоторый код для извлечения пользовательского поста ‘project’ и создадим структуру HTML, которая заменит наш шорткод.
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
|
function project_shortcode( $atts ) {
extract( shortcode_atts( array(
‘limit’ => ’10’,
‘orderby’ => ‘date’,
), $atts ) );
// Creating custom query to fetch the project type custom post.
$loop = new WP_Query(array(‘post_type’ => ‘project’, ‘posts_per_page’ => $limit, ‘orderby’ => $orderby));
// Looping through the posts and building the HTML structure.
if($loop){
while ($loop->have_posts()){
$loop->the_post();
$output .= ‘<div class=»type-post hentry»><h2 class=»entry-title»><a href=»‘.get_permalink().'»>’.get_the_title().'</a></h2>’;
$output .= ‘<div class=»entry-content»>’.get_the_excerpt().'</div></div>’;
}
}
else
$output = ‘Sorry, No projects yet.
// Now we are returning the HTML code back to the place from where the shortcode was called.
return $output;
}
|
$ Atts — это атрибуты, предоставленные вместе с шорткодом. Метод извлечения в PHP используется для разделения элементов массива на переменные, чтобы их можно было использовать непосредственно внутри функции.
В этом примере мы используем атрибуты, переданные в функцию, чтобы создать собственный запрос для извлечения пользовательских данных «проекта». Затем мы перебираем все возвращенные посты проекта.
Внутри цикла мы выбираем и добавляем данные в выходную переменную с соответствующими тегами HTML. По завершении цикла выходная переменная содержит полный HTML-код для нашего списка проектов. Этот HTML-код возвращается и шорткод, используемый в теме, заменяется этим при загрузке страницы.
Шаг 2. Добавление шорткода в базу данных
Теперь, когда мы создали функцию, мы должны зарегистрировать ее в базе данных вместе с коротким кодом, который будет использоваться для нее. Мы можем сделать это с
метод register_shortcode, предоставляемый WordPress.
|
1
|
add_shortcode(‘projects’,’project_shortcode’);
|
Первый аргумент в этом методе — это имя шорткода, который мы будем использовать в теме, а второй аргумент — это имя функции (которую мы определили выше), относящейся к этому шорткоду. Вот как WordPress будет знать, что делать, когда этот шорткод анализируется или встречается.
Шаг 3. Использование зарегистрированного шорткода в теме
WordPress предоставляет метод синтаксического анализа шорткода, который очень немногие разработчики считают возможным использовать все это часто. Метод do_shortcode можно использовать для вставки шорткодов в сами файлы тем.
Синтаксис шорткода аналогичен синтаксису, добавленному в бэкэнд-редактор. В этом случае мы передаем атрибуты для ограничения количества отображаемых сообщений и порядка их заказа. Так как мы отображаем «посты» пользовательских постов, мы создадим новый выделенный шаблон страницы и используем в нем шорткод. Создайте шаблон с именем «page-project.php» и используйте следующее:
|
01
02
03
04
05
06
07
08
09
10
11
12
13
|
<?php
/*
Template Name: Project Page
*/
?>
<?php get_header();
<div id=»container»>
<div id=»content» role=»main»>
<?php echo do_shortcode(‘[projects limit=10 orderby=rand]’);
</div><!— #content —>
</div><!— #container —>
<?php get_sidebar();
<?php get_footer();
|
Теперь, чтобы просмотреть шаблон, который вы только что создали, создайте страницу под названием «Проект». Очевидно, создайте несколько демо-записей «Project»!
Вуаля! Краткий код успешно отображает пользовательские сообщения.
Вывод
Как вы можете видеть, описанный выше метод создания шорткода для пользовательских сообщений и их использования в нашей теме помогает нам сохранять файлы темы управляемыми и чистыми. Это также имеет дополнительное преимущество, заключающееся в том, что любой может вставить пользовательский цикл поста из бэкэнд-редактора WordPress.
Приведенный выше пример показывает, как мы можем эффективно использовать шорткоды при разработке темы. Есть много инновационных и продуктивных способов использовать шорткоды в темах WordPress — не стесняйтесь делиться своими собственными идеями в комментариях!