Как создать шорткод wordpress

Шорткоды

Шорткоды – могут содержать в себе какой-то PHP-код и функции, которые можно задействовать прямо в контенте записей и страниц. Появились в версии WordPress 2.5.

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

[gallery]

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

Даже с приходом Gutenberg, вряд ли шорткоды в скором времени будут вытеснены блоками.

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

Так же, как у функции могут быть аргументы, так и шорткод может иметь собственные параметры. Ещё один пример с шорткодом:

[gallery size="large" ids="14243,14242,14241"]

В параметре ids перечислены ID изображений, входящих в галерею, параметр size — размер вставляемых изображений.

Стандартные шорткоды WordPress

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

Другие стандартные шорткоды это:

Экранирование шорткодов

А точнее, как сделать так, чтобы шорткод присутствовал в контенте вашего поста, но не выполнялся? Или другими словами, как я вывел шорткоды в предыдущей главе поста, не выполняя их?

Всё, что нужно сделать, это обернуть его ещё в одни квадратные скобки, вот так:

[[gallery]]

Если же у вашего шорткода есть открывающий и закрывающий тег, то он будет выглядеть следующим образом:

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

[[шорткод] . [/шорткод]]

Ну и про HTML-сущности тоже помним, да? [шорткод]

На самом деле именно в этом моменте можно кекнуть, потому что часто встречаю уроки по WordPress, где их отображают с пробелом, типо [ gallery] и при этом уточняют, что пробел нужно удалить ��

Как создать шорткод WordPress?

1. Простой пример

Создать свой шорткод не труднее, чем написать собственную функцию PHP. Например я решил создать шорткод [misha] , который при вставке в пост будет выводить URL главной страницы сайта.

function true_misha_func( $atts ){ return site_url(); // никаких echo, только return } add_shortcode( 'misha', 'true_misha_func' );

• Код можете вставить в файл functions.php (я имею ввиду тот, который находится в директории вашей текущей темы). Больше информации о вставке кода.
• Имя шорткода должно быть обязательно в нижнем регистре и содержать только буквы латинского алфавита, цифры и символ подчеркивания.
• Мы использовали функцию site_url() для вывода текущего адреса сайта.

2. Шорткод с параметрами (атрибутами)

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

В качестве примера я написал шорткод, который просто вставляет ссылку в пост, которая открывается в новой вкладке браузера target=»_blank» . Не думаю, что на деле он может быть полезен, но для нас сейчас главное — понять сам принцип работы шорткодов.

Параметров будет два: anchor и url — анкор (текст ссылки) и URL соответственно. Как будет выглядеть сам шорткод: [trueurl anchor=»Мой блог» url=»https://misha.agency/blog»] . Если параметр не будет указан в самом шорткоде, то будет использоваться его значение по умолчанию, заданное в функции.

function true_url_external( $atts ) { $params = shortcode_atts( array( // в массиве укажите значения параметров по умолчанию 'anchor' => 'Миша Рудрастых', // параметр 1 'url' => 'https://misha.agency', // параметр 2 ), $atts ); return ' . $params[ 'url' ] . '" target="_blank">' . $params[ 'anchor' ] . ''; } add_shortcode( 'trueurl', 'true_url_external' );

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

3. Закрывающиеся шорткоды и шорткод внутри шорткода

Давайте возьмём шорткод из предыдущего примера и немного переколдуем его. Напомню, что шорткод выглядел так: [trueurl anchor=»текст ссылки» url=»URL ссылки»] .

Что, если мы переделаем его следующим образом: [trueurl anchor=»текст ссылки»]URL ссылки[/trueurl] .

Кроме того, вовнутрь закрывающихся шорткодов можно вставлять и другие шорткоды (благодаря функции do_shortcode()).

В соответствии с этим давайте переделаем наш код из предыдущего примера:

function true_url_external( $atts, $shortcode_content = null ) { $params = shortcode_atts( array( 'anchor' => 'Миша Рудрастых' ), $atts ); return ' . do_shortcode( $shortcode_content ) . '" target="_blank">' . $params[ 'anchor' ] . ''; } add_shortcode( 'trueurl', 'true_url_external' );

Теперь шорткод следующего вида [trueurl anchor=»главная»][misha][/trueurl] выведет ссылку на главную страницу вашего сайта (про шорткод [misha] я писал выше).

4. Используем буферизацию для вывода прямо в шорткоде

Иногда бывает, что никак не получается внутри шорткода возвратить результат, например мы используем функцию get_template_part() внутри. Что делать в таких ситуациях?

Решается это довольно легко – при помощи буферизации.

function truemisha_shortcode_callback() { ob_start(); // тут можно сразу выводить при помощи echo() // или get_template_part( 'entry' ); // или закрывать тег ?> и выводить сразу HTML $output = ob_get_contents(); // всё, что вывели, окажется внутри $output ob_end_clean(); return $output; }

Добавляем кнопку вставки шорткода в визуальный редактор поста TinyMCE

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

PHP-код

Вне зависимости от того, будет ли ваша кнопка текстовая, либо с иконкой, будет ли она содержать дополнительные поля ввода (параметры шорткода) или нет — во всех случаях PHP-код регистрации кнопки будет одинаков.

// Хуки function true_add_mce_button() { // проверяем права пользователя - может ли он редактировать посты и страницы if ( !current_user_can( 'edit_posts' ) && !current_user_can( 'edit_pages' ) ) { return; // если не может, то и кнопка ему не понадобится, в этом случае выходим из функции } // проверяем, включен ли визуальный редактор у пользователя в настройках (если нет, то и кнопку подключать незачем) if ( 'true' == get_user_option( 'rich_editing' ) ) { add_filter( 'mce_external_plugins', 'true_add_tinymce_script' ); add_filter( 'mce_buttons', 'true_register_mce_button' ); } } add_action('admin_head', 'true_add_mce_button'); // В этом функции указываем ссылку на JavaScript-файл кнопки function true_add_tinymce_script( $plugin_array ) { $plugin_array['true_mce_button'] = get_stylesheet_directory_uri() .'/true_button.js'; // true_mce_button - идентификатор кнопки return $plugin_array; } // Регистрируем кнопку в редакторе function true_register_mce_button( $buttons ) { array_push( $buttons, 'true_mce_button' ); // true_mce_button - идентификатор кнопки return $buttons; }

В этом примере для получения URL папки с текущей темой я использовал функцию get_stylesheet_directory_uri(). true_button.js — собственно сама кнопка, создайте этот файл в директории с темой (или там, где вам удобно, но не забудьте в этом случае поменять путь к нему).

JavaScript. Пример простой кнопки

Займёмся содержимым файла true_button.js . Итак, создадим для начала простую кнопку, которая будет вставлять шорткод [misha] .

(function() { tinymce.PluginManager.add('true_mce_button', function( editor, url ) { // true_mce_button - ID кнопки editor.addButton('true_mce_button', { // true_mce_button - ID кнопки, везде должен быть одинаковым text: '[misha]', // текст кнопки, если вы хотите, чтобы ваша кнопка содержала только иконку, удалите эту строку title: 'Вставить шорткод [misha]', // всплывающая подсказка icon: false, // тут можно указать любую из существующих векторных иконок в TinyMCE либо собственный CSS-класс onclick: function() { editor.insertContent('[misha]'); // вставляем шорткод [misha] в редактор, также можно задать любое действие jQuery } }); }); })();

Текстовый вариант кнопки вставки шорткода в визуальном редакторе TinyMCE.

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

Начну с того, что вставлю (а точнее заменю) код в файл true_button.js :

(function() { tinymce.PluginManager.add('true_mce_button', function( editor, url ) { // id кнопки true_mce_button должен быть везде один и тот же editor.addButton( 'true_mce_button', { // id кнопки true_mce_button icon: 'perec', // мой собственный CSS класс, благодаря которому я задам иконку кнопки type: 'menubutton', title: 'Вставить элемент', // всплывающая подсказка при наведении menu: [ // тут начинается первый выпадающий список { text: 'Элементы форм', menu: [ // тут начинается второй выпадающий список внутри первого { text: 'Текстовое поле', onclick: function() { editor.windowManager.open( { title: 'Задайте параметры поля', body: [ { type: 'textbox', // тип textbox = текстовое поле name: 'textboxName', // ID, будет использоваться ниже label: 'ID и name текстового поля', // лейбл value: 'comment' // значение по умолчанию }, { type: 'textbox', // тип textbox = текстовое поле name: 'multilineName', label: 'Значение текстового поля по умолчанию', value: 'Привет', multiline: true, // большое текстовое поле - textarea minWidth: 300, // минимальная ширина в пикселях minHeight: 100 // минимальная высота в пикселях }, { type: 'listbox', // тип listbox = выпадающий список select name: 'listboxName', label: 'Заполнение', 'values': [ // значения выпадающего списка {text: 'Обязательное', value: '1'}, // лейбл, значение {text: 'Необязательное', value: '2'} ] } ], onsubmit: function( e ) { // это будет происходить после заполнения полей и нажатии кнопки отправки editor.insertContent( '[textarea + e.data.textboxName + '" value="' + e.data.multilineName + '" required="' + e.data.listboxName + '"]'); } }); } }, { // второй элемент вложенного выпадающего списка, прост вставляет шорткод [button] text: 'Кнопка отправки', onclick: function() { editor.insertContent('[button]'); } } ] }, { // второй элемент первого выпадающего списка, просто вставляет [misha] text: 'Шорткод [misha]', onclick: function() { editor.insertContent('[misha]'); } } ] }); }); })();

После вставки кода моя кнопка уже появилась и работает. Единственное только — у неё нет никакой иконки (ну кроме стрелочки вниз).

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

• Встроенные иконки TinyMCE.
• Другие иконочные шрифты, в том числе и dashicons.
• Любую картинку через background-image .
• Изображение, закодированное в base64.

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

i.mce-i-perec { background-image: url('perec.png'); }

Если использовали этот же способ и иконка не появилась — попробуйте прописать к ней абсолютный URL.

Для подключения CSS используйте функцию wp_enqueue_style() либо хук admin_head .

Всплывающее окно, в котором можно задать параметры шорткода, появляющееся при нажатии на кнопку в визуальном редакторе.

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

i.mce-i-perec { content: "\f511"; /* выбираем иконку и узнаем ее код тут https://developer.wordpress.org/resource/dashicons/ */ font-family:'dashicons'; font-size:20px; /* можно подкорректировать размер шрифта, если не устраивает*/ }

Применение шорткодов в коде PHP

Тут всё сводится к использованию одной функции — do_shortcode().

do_shortcode()

Функция в качестве параметра может содержать лишь один шорткод:

echo do_shortcode( '[misha]' );

Или шорткод и какой-то контент:

echo do_shortcode( '[trueurl anchor="Главная"]' . site_url() . '[/trueurl]' );

Популярный пример, позволяет получить или вывести содержимое поста с применением шорткодов при помощи функции get_the_content():

$content_shortcoded = do_shortcode( get_the_content() );

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

Ещё пара интересных примеров шорткодов

• Как скрыть часть контента от незарегистрированных пользователей в WordPress при помощи шорткодов
• antispambot — функция для защиты email адресов на блоге от спам-ботов

Миша

Впервые познакомился с WordPress в 2009 году. Организатор и спикер на конференциях WordCamp. Преподаватель в школе Нетология.

Пишите, если нужна помощь с сайтом или разработка с нуля.

Создание шорткодов в WordPress CMS

Начиная с версии 2.5, разработчики WordPress ввели понятие «Shortcodes API». Этот функционал позволяет создавать и использовать макрокоды в страницах сайта или в записях блога. Например, простая и короткая запись добавит на странице целую фотогалерею.

Более подробно прочитать о шорткодах и узнать, как создавать простые шорткоды, вы можете из документации WordPress.

1. Подключение сторонних скриптов и запуск только при наличии шорткода на странице.
2. Многоуровневый шорткод.
   • Составной шорткод.
   • Вложенность шорткодов.

Подготовка почвы

Прежде чем начать создавать что-либо, предлагаю свой вариант размещения файлов:

/
/Includes/
shortcodes.php
…
functions.php

Практически в каждом руководстве предлагают создавать шорткоды прямо в файле functions.php. Скажу сразу: я — противник такого подхода. Вместо этого настоятельно рекомендую вынести все шорткоды в отдельный файл (includes/shortcodes.php) и подключить его в functions.php одной строкой. Это значительно разгрузит functions.php и сделает код более читабельным.

Заметка: WordPress, конечно, поддерживает подключение файлов через require, но очень не рекомендует делать этого. Вместо этого предлагается использовать get_template_part().

Подключение скриптов

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

Пример такой реализации:

function foobar_func( $atts ) < return "foo and bar"; >add_shortcode( 'foobar', 'foobar_func' ); function foo_script () < wp_register_script( 'foo-js', get_template_directory_uri() . '/includes/js/foo.js'); wp_enqueue_script( 'foo-js' ); >add_action( 'wp_enqueue_scripts', 'foo_script'); 

Это полностью рабочий вариант, но скрипт будет загружаться на каждой странице, даже если он там не нужен (т. е. нет шорткода).

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

1. Определить шорткод как отдельный класс.
2. Добавить флаг, который определит есть ли данный шорткод на странице.
3. Загружать скрипт только по флагу присутствия шорткода.

Пример такой реализации:

class foobar_shortcode < static $add_script; static function init () < add_shortcode('foobar', array(__CLASS__, 'foobar_func')); add_action('init', array(__CLASS__, 'register_script')); add_action('wp_footer', array(__CLASS__, 'print_script')); >static function foobar_func( $atts ) < self::$add_script = true; return "foo and bar"; >static function register_script() < wp_register_script( 'foo-js', get_template_directory_uri() . '/includes/js/foo.js'); >static function print_script () < if ( !self::$add_script ) return; wp_print_scripts('foo-js'); >> foobar_shortcode::init(); 

В отличие от предыдущего варианта реализации, этот шорткод инициализируется, но все скрипты подгружаются только при наличии шорткода на странице.

Вложенные шорткоды

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

• Создание многоуровневого шорткода (состоящий из нескольких).
• Использование шорткода внутри такого же шорткода.

Теперь — более детально.

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

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

[price]
— [plan title=’Plan 1’ price=’99’]
— [option] Option 1 [/option]
— [option] Option 2 [/option]
— [option] … [/option]
— [/plan]
— [plan title=’Plan 2’ price=’499’]
— [option] Option 1 [/option]
— [option] Option 2 [/option]
— [option] … [/option]
— [/plan]
…
[/price]

В данном примере используется три шорткода: [price] [plan] [option].

add_shortcode( ‘price’, ‘price_code’ );
add_shortcode( ‘plan’, ‘plan_code’ );
add_shortcode( ‘option’, ‘option_code’ );

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

Price -> вывод кода на страницу
Plan -> получение данных
Option -> получение данных

Т. е. вывод кода на страницу происходит только во внешнем шорткоде, внутренние же просто возвращают полученные данные. Пример такой реализации приведен ниже.
Описание функции внешнего шорткода:

 function price_code ($atts, $content) < // инициализация глобальных переменных для прайс планов $GLOBALS['plan-count'] = 0; $GLOBALS['plans'] = array(); // чтение контента и выполнение внутренних шорткодов do_shortcode($content); // подготовка HTML кода $output = '
'; if(is_array($GLOBALS['plans'])) < foreach ($GLOBALS['plans'] as $plan) < $planContent = '
'; $planContent .= $plan; $planContent .= '
'; $output .= $planContent; > > $output .= '
'; // вывод HTML кода return $output; > 

Описание функций внутренних шорткодов:

function plan_code ($atts, $content) < // получаем параметры шорткода extract(shortcode_atts(array( 'title' =>'', // Plan title name 'price' => '0', // Plan price ), $atts)); // Подоготавливаем HTML: заголовок плана $plan_title = '
'; $plan_title .= ' 
'.$title.'
'; $plan_title .= '
'; // Подоготавливаем HTML: стоимость $f_price = round(floatval($price), 2); $f_price = ($f_Price > 0) ? $f_Price : 0; $s_price = '$'.$f_Price; $price_plan = '
'; $price_plan .= ' 
'.$s_price.'
'; $price_plan .= ' '.$text.''; $price_plan .= '
'; // инициализация глобальных переменных для опций $GLOBALS['plan-options-count'] = 0; $GLOBALS['plan-options'] = array(); // читаем контент и выполняем внутренние шорткоды do_shortcode($content); // Подоготавливаем HTML: опции $plan_options = '
'; if (is_array($GLOBALS['plan-options'])) < foreach ($GLOBALS['plan-options'] as $option) < $plan_options .= $option; >> $s_OptionsDiv.= '
'; // Подоготавливаем HTML: компонуем контент $plan_div = $plan_title; $plan_div .= $price_plan; $plan_div .= $plan_options; // сохраняем полученные данные $i = $GLOBALS['plan-count'] + 1; $GLOBALS['plans'][$i] = $plan_div; $GLOBALS['plan-count'] = $i; // ничего не выводим return true; > function option_code ($atts, $content) < // Подоготавливаем HTML $plan_option = '
'; $plan_option .= ' 
'.do_shortcode($content).'
'; $plan_option .= '
'; // сохраняем полученные данные $i = $GLOBALS['plan-options-count'] + 1; $GLOBALS['plan-options'][$i] = $plan_option; $GLOBALS['plan-options-count'] = $i; // ничего не выводим return true; > 

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

Конечно же, вы можете еще оптимизировать и усовершенствовать этот шорткод, но все же, думаю, основную идею продемонстрировать мне удалось.

Повторяющиеся шорткоды

Проблема заключается в следующем: нужно внутри шорткода использовать такой же шорткод. Наиболее частым примером в моей практике был шорткод для создания колонки. Т.е., к примеру, нужно реализовать разделение страницы на 2 части с помощью колонок и в первую колонку разделить еще на 2 колонки.

[column_half]
[column_half] Content [/column_half]
[column_half] Content [/column_half]
[/column_half]
[column_half] Content [/column_half]

К сожалению, для WordPress уже такая вложенность “не по зубам”. Верстка разлетится уже на втором контенте. Происходит это потому что при открытии шорткода WordPress сразу же ищет вторую (закрывающую) часть этого шорткода, т.е. в данном примере первая колонка будет закрыта на первом же вложенном шорткоде.

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

add_shortcode( 'column_half', 'column_half_code' ); add_shortcode( 'column_half_inner', 'column_half_code' ); function column_half_code ( $atts, $content ) < return " 

add_shortcode( $tag , $func );

add_shortcode( 'footag', 'footag_func' ); function footag_func( $atts ) < return "foo = ". $atts['foo']; >// результат: // шоткод [footag foo="bar"] в тексте будет заменен на "foo = bar"

add_shortcode( 'baztag', [ 'MyPlugin', 'baztag_func' ] ); class MyPlugin < static function baztag_func( $atts, $content ) < return "content = $content"; >>

add_shortcode( 'baz-up', 'baz_func' ); add_shortcode( 'baz-down', 'baz_func' ); function baz_func( $atts, $content, $tag ) < // какая-то общая логика, например обработка переменных $atts $atts = shortcode_atts( array( 'foo' =>'no foo', 'baz' => 'default baz' ), $atts ); if( 'baz-up' === $tag ) < $content = 'Конетнт шорткода [baz-up] - ' . $atts['foo']; >elseif( 'baz-down' === $tag ) < $content = 'Конетнт шорткода [baz-down] - ' . $atts['foo']; >return $content; >

add_shortcode( 'baztag', 'baztag_func' ); function baztag_func( $atts, $content ) < return "content = $content"; >// результат: // конструкция шоткода будет заменена на "content = здесь текст"

add_shortcode( 'iframe', 'Generate_iframe' ); function Generate_iframe( $atts ) < $atts = shortcode_atts( array( 'href' =>'http://example.com', 'height' => '550px', 'width' => '600px', ), $atts ); return ' '; > // использование: // [iframe href="http://www.exmaple.com" height="480" width="640"]

add_shortcode( 'bartag', 'bartag_func' ); function bartag_func( $atts ) < // белый список параметров и значения по умолчанию $atts = shortcode_atts( array( 'foo' =>'no foo', 'baz' => 'default baz' ), $atts ); return "foo = "; >

add_shortcode( 'testimonials', 'testimonials_shortcode_handler' ); function testimonials_shortcode_handler( $atts ) < global $post; $rg = (object) shortcode_atts( [ 'id' =>null ], $atts ); if( ! $post = get_post( $rg->id ) ) return ''; $url = wp_get_attachment_url( get_post_thumbnail_id( $post->ID ) ); $out = ' 
 
 
 
 
'. get_the_content() .'
 
  
'. esc_html( $post->author_name ) .' '. esc_html( $post->author_designation ) .' 
 
 
 
 '; wp_reset_postdata(); return $out; >

add_shortcode( '4cards', 'shortcode_4cards' ); function shortcode_4cards() < ob_start(); /** * Подключает файл по пути: * мой_домен/wp-content/themes/моя_тема/templates/shortcodes/4_cards.php */ get_template_part( 'templates/shortcodes/4_cards' ); return ob_get_clean(); >// Пример вызова шорткода: ``[4cards]``

add_shortcode( 'cards', 'shortcode_cards' ); function shortcode_cards( $atts ) < ob_start(); // белый список параметров $atts = shortcode_atts( [ 'template' =>'', ], $atts ); /** * Подключает файл по пути: * мой_домен/wp-content/themes/моя_тема/templates/shortcodes/переданное_имя_файла.php */ get_template_part( "templates/shortcodes/" ); return ob_get_clean(); >

# /тема/templates/shortcodes/card-1.php [cards template="card-1"] # /тема/templates/shortcodes/card-2.php [cards template="card-2"] # /тема/templates/shortcodes/cart-1/block-1.php [cards template="cart-1/block-1"]

function add_shortcode( $tag, $callback ) < global $shortcode_tags; if ( '' === trim( $tag ) ) < _doing_it_wrong( __FUNCTION__, __( 'Invalid shortcode name: Empty name given.' ), '4.4.0' ); return; >if ( 0 !== preg_match( '@[<>&/\[\]\x00-\x20=]@', $tag ) ) < _doing_it_wrong( __FUNCTION__, sprintf( /* translators: 1: Shortcode name, 2: Space-separated list of reserved characters. */ __( 'Invalid shortcode name: %1$s. Do not use spaces or reserved characters: %2$s' ), $tag, '& / < >[ ] =' ), '4.4.0' ); return; > $shortcode_tags[ $tag ] = $callback; >

function wpschool_text_shortcode() < return 'Привет, WPSchool!'; >add_shortcode('textshortcode', 'wpschool_text_shortcode');

[textshortcode]

function wpschool_picture_shortcode( $atts ) < extract( shortcode_atts( array( 'width' =>100, 'height' => 100, ), $atts ) ); return ' '; > add_shortcode( 'picture', 'wpschool_picture_shortcode' );

[picture width="150" height="100"]