Как вставить шорткод в шаблон wordpress

Шорткоды (shortcode) WordPress

Шорткоды являются прекрасным решением при вставке кода на сайт и широко применяются вебмастерами во всем мире. С их помощью можно с легкостью вставить любой код на сайт WordPress, например, рекламный блок Google Adsense. При этом код вставки будет выглядеть примерно следующим образом.

где, shortcode_1 – идентификатор нужного нам шорткода.

После вставки на месте данного кода выведется содержимое соответствующего шорткода. Как видите, это очень удобно, особенно если вы очень часто любите менять код. Например, вы используете рекламные блоки Google Adsense в тексте статей и вдруг вам захотелось вместо них отображать рекламные блоки Яндекс Директ. Для этого вам не нужно будет править каждую статью отдельно. Достаточно просто заменить в шорткоде код Google Adsens на код Яндекс Директа.

Ну а теперь давайте сразу перейдем непосредственно к инструкции по созданию шорткодов в WordPress.

Как создать шорткод (shortcode) в WordPress

Для того чтобы создать шорткод в WordPress, первым делом открываем на редактирование файл function.php вашей темы оформления. Если его нет, то создаем данный файл вручную. Для этого создаем новый файл с расширением php и даем ему имя function. Внутри него открываем php-блок (<?php ?>) внутри которого (между <?php и ?> ) будет прописываться код шорткода. Если же файл function.php у вас есть, то код шорткода добавляем в конец файла перед закрывающим тегом «?>».

Синтаксис создания шорткодов в Wordrpess следующий.

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

Далее мы создаем сам шорткод. Для этого в качестве параметра функции add_shortcode() мы передаем имя шорткода и имя функции, которая будет вызываться в месте, где будет обнаружен код вызова шорткода. Для более полного понимания давайте рассмотрим пример шорткода для вывода рекламного блока Google Adsense.

В примере выше мы видим, что сначала создается функция adsense_468x60(), которая в качестве результата возвращает код рекламного блока Google Adsense (return ‘код рекламного блока’; ). Далее мы создаем сам шорткод и даем ему имя ads_1, а в качестве функции указываем функцию adsense_468x60. Теперь для вызова функции adsense_468x60, которая выводит код рекламного блока Google Adsense, достаточно в тексте статьи указать следующий код.

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

Теперь давайте перейдем ко второй части статьи и рассмотрим процесс добавления дополнительных кнопок в редактор WordPress. В качестве примера мы также рассмотрим процесс добавления кнопки созданного нами шорткода в HTML редактор WordPress.

Добавление новых кнопок в редактор WordPress

Для того чтобы добавить новые кнопки в редактор WordPress нам придется править специальный файл quicktags.js, который находится по адресу ваш сайт/wp-includes/js/quicktags.js. Для этого открываем данный файл на редактирование и ищем там следующий код.

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

где name – имя создаваемой кнопки.

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

Ну а теперь давайте перейдем непосредственно к рабочим примерам.

Код для добавления в редактор WordPress кнопки заголовков второго уровня H2

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

Теперь давайте рассмотрим код для вставки кнопки шорткода (см. пример выше), который будет выводить рекламные блоки Google Adsense в тексте статей.

После добавления соответствующих кнопок не забываем сохранить файл quicktags.js и перезаписать его на хостинге. В результате после обновления страницы у вас получится следующее.

Показываем на странице записи из определенной категории

Очень похожий пример, что и выше, только теперь мы укажем ограничение в количестве выводимых записей из определенной категории:

function category_shortcode( $atts )
{
extract(shortcode_atts(array(
	    'limit' => '5',
            'category' => '',
	), $atts));
	//The Query
	query_posts('category=' . $id . 'posts_per_page=' . $limit);
	//The Loop
	if ( have_posts() ) : while ( have_posts() ) : the_post();
		echo	'<h3><a href="'; echo the_permalink(); echo '">'; echo the_title(); echo '</a></h3>';
		echo the_excerpt();
	endwhile; else:
	endif;

	//Reset Query
	wp_reset_query();
}
add_shortcode('category', 'category_shortcode');

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

Использование функции WordPress do_shortcode

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

Например, предположим, что вы хотите вставить плагинWordPress-а Contact Form 7 где-нибудь в заголовочной части(хедере) вашей темы. Но проблема в том, что у вас нет никакого виджета в этой области.

Прежде всего, понадобится взять шорткод плагина, который вы хотите использовать. Как пример, мы будем использовать тот же шорткод Contact Form 7:

1. Перейдите в Консоль WordPress и нажмите на Contact Form 7 -> Контактные формы.
2. Справа, рядом с названием формы вы найдёте шорткод для вашей формы:
3. Нажмите на шорткод и скопируйте выделившийся код.

Так как в нашей теме нет виджета в заголовке страницы и мы не может просто скопировать и вставить шорткод туда, мы воспользуемся функцией WordPress do_shortcode. Она выглядит так:

<?php echo do_shortcode( '' ); ?>

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

В следующих шагах показано как редактировать файлы WordPress через Файловый Менеджер Hostinger, однако, можно также воспользоваться FTP клиентом (руководство по этой теме):

1. Зайдите в Панель Управления Hostinger и нажмите на Файловый Менеджер.
2. Далее, перейдите в установочный каталог WordPress (обычно это public_html) и перейдите в каталог wp-contents -> themes.
3. Найдите каталог вашей текущей темы и откройте его.
4. Так как мы собираемся добавить форму контактов в хедер, открываем файл header.php.
5. Прокрутите страницу и найдите точное место и div, где именно вы хотите добавить форму. Наш шорткод WordPress с функцией do_shortcode будет выглядеть так:

   <?php echo do_shortcode(“”);?>

6. Сохраните файл и проверьте теперь вид вашего сайта.

Примечание: В большинстве случаем, редактирования основных файлов темы ломают шаблон WordPress. Скорее всего нужно будет внести изменения в CSS, чтобы сделать более привлекательный вид для WordPress. Обязательно ознакомьтесь с нашими руководством о том, как проверить стили CSS при помощи браузера (англ.) и download CSS cheatsheet (англ.).

Shortcodes Ultimate на русском языке

Продвинутый плагин Shortcodes Ultimate вобрал самые лучшие возможности у конкурентов, а русская версия добавляет удобства, плюс для пользователей. Вот примерный список достоинств:

• Около 50 видов активных шорткодов
• Быстрая вставка
• Адаптивность
• Заявлена совместимость со всеми темами и плагинами wordpress
• Лёгкий код для доработки
• Поддержка guttenberg
• Имеет собственный виджет

Обзор настроек

Разберём как пользоваться данным wordpress плагином. Устанавливаем стандартно через поиск из панели, или скачиваем с этой страницы. Активируем и переходим в новый раздел “Шорткоды”. В пункте настроек, есть два важных момента:

Shortcodes Ultimate обзор настроек

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

Доступные shortcod

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

доступные варианты шорткодов к использованию

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

Работа в записях и страницах wordpress

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

Вставка в виджетах

Данный плагин wordpress умеет работать с виджетами, создавая собственный в панели “внешний вид”. Заходим и спускаемся вниз, находим одноимённый виджет и перетаскиваем к активным. Таким же методом настраиваем и сохраняем.

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

Если рассказал не понятно то прошу просмотреть видео.

Создание информационного блока

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

function box_shortcode( $atts, $content = null )
{
    extract( shortcode_atts( array(
      'color' => 'yellow',
      'size' => 'medium',
      ), $atts ) );

      return '
		<style type="text/css">
		.shortcode_box {
			padding: 2px 4px;
			border: 1px solid #ccc;
		}
		.yellow {
			background: #ffd149;
			color: #666;
		}
		.blue {
			background: #a0c5ef;
			color: #333;
		}
		.gray {
			background: #f0f0f0;
			color: #333;
		}
		</style>

      <div class="shortcode_box ' . $size . ' ' .  $color . '">' . $content . '</div>';

}
add_shortcode('box', 'box_shortcode');

В результате получим небольшой блок, наподобие этого:

вставляете шорткод в вашу запись:

Это блок с важной информацией, которую вам следует прочитать.

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

Добавлением соответствующих свойств CSS можно еще изменить размер блока, но это вы уже можете сделать сами на свое усмотрение.

Что делать если не работает шорткод в шаблоне WordPress?

1. Попробуйте вывести этот шорткод в запись и убедитесь что он рабочий. Возможно проблема не в выводе шорткода, а в самом плагине.
2. Убедитесь что у вас правильно записана функция <?php echo do_shortcode(«»); ?> и вставлен правильных шорткод.
3. Если в коде есть ковычки, то проверьте чтобы они не совпадали с ковычками в функции (если в функции стоят двойные ковычки, то в шорткоде вместо двойных должны стоять одинарные и наоборот).
4. Проверьте чтобы функция <?php echo do_shortcode(» «); ?> не стояла внутри фрагмента PHP кода.

Например:

Получается, что в этом случае php-код открывается и закрывается внутри уже существующего php-кода. Возникает путаница с открывающимися и закрывающимися тегами.
В данном случае нужно либо писать данную функцию без <?php … ?>

Либо закрыть php-код внутри которого вы хотите разместить шорткод а потом уже писать данную функцию.

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

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

Создаем кнопку загрузки

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

function button_shortcode( $atts, $content = null )
{
    extract( shortcode_atts( array(
      'color' => 'blue',
      'size' => 'medium',
      ), $atts ) );

      return '
		<style type="text/css">
		.shortcode_button {
			padding: 2px 8px;
			border: 1px solid #ccc;
			border-radius: 10px;
			-webkit-border-radius: 10px;
			-moz-border-radius: 10px;
		}
		.black {
			background: #ffd149;
			background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#636363), to(#332F2F));
			background: -moz-linear-gradient(19% 75% 90deg,#332F2F, #636363);
			color: #f0f0f0;
			border-top-color: #1c1c1c;
			border-left-color: #1c1c1c;
			border-right-color: #525252;
			border-bottom-color: #525252;
		}
		.blue {
			background: #a0c5ef;
			background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#508BC7), to(#203F75));
			background: -moz-linear-gradient(19% 75% 90deg,#203F75, #508BC7);
			color: #f0f0f0;
			border-top-color: #023778;
			border-left-color: #023778;
			border-right-color: #26609e;
			border-bottom-color: #26609e;
		}

		.large	{
			width: 200px;
		}
		.medium	{
			width: 120px;
		}
		.small	{
			width: 80px;
		}
		</style>

      <div class="shortcode_button ' . $size . ' ' .  $color . '">' . $content . '</div>';

}
add_shortcode('button', 'button_shortcode');

а затем прописываем сам шорткод в записи:

<a href="#">Загрузить</a>

в результате получим вот такую вот кнопку с ссылкой на скачивание:

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

Что делать если шорткод не работает в сайдбаре?

Может так получиться, что ваша тема для сайта не поддерживает отображение шорткодов в сайдбаре.

В этом случае нам нужно:

1.Зайти в пункт меню «Внешний вид» => «Редактор»

2.В редакторе, с правой стороны страницы находится список доступных для редактирования файлов

Нам нужно выбрать файл «Функции темы» (functions.php).

2.В самом низу файла вставляем следующую строку:

PHP

add_filter(‘widget_text’, ‘do_shortcode’);

1

add_filter(‘widget_text’, ‘do_shortcode’);

Как показано на скриншоте:

Обратите внимание! В конце файла не должно оставаться пустых строк, т. е. наша вставленная строка должна быть последней

Иначе, могут появиться ошибки.

2.Нажимаем «Сохранить» и теперь у нас все будет работать.

Так же, этот шорткод, при помощи php-функции можно прописать в файле page.php:

PHP

<?php echo do_shortcode(» «); ?>

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

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

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

Изначально у меня стояла задача добавить посреди страницы «псевдораспорку» clearfix. Теоретически, существует сразу несколько вариантов ее решения:

• Можно было переключиться в HTML режим, но это бы мешало дальнейшему комфортному редактированию.
• Установить плагин добавления виджета на страницу Amr Shortcode Any Widget? – ради 1-2 строк кода решение слишком громоздкое.
• Новый редактор Gutenberg, кстати, содержит нужный мне элемент, но для того конкретного сайта пришлось его отключить.

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

function clearfix_block( $atts ) {
	 return '';
}
add_shortcode('clearfix', 'clearfix_block');

‘;
}
add_shortcode(‘clearfix’, ‘clearfix_block’);

Здесь в последней строке вы присваиваете конкретному имени шорткода специальную функцию, определенную ранее. Теперь при вставке конструкции система будет вызывать функцию clearfix_block(), которая через return возвращает обычный HTML код (в моем случае).

Если вам требуется передавать параметры, дополнительно используем shortcode_atts() – она позволяет не просто задать ряд допустимых переменных, но и указать для них значения по умолчанию. Например:

function mynew_shortcode( $atts ) {
	$myparams = shortcode_atts( array( 
		'class' => 'first', 
		'id' => 'second', 
	), $atts );
	return "' id='{$myparams}'>";
}
add_shortcode( 'add-mydiv', 'mynew_shortcode' );

«;
}
add_shortcode( ‘add-mydiv’, ‘mynew_shortcode’ );

После добавления в текст страницы шорткодов:

Получим следующий результат:

Надеюсь, логику работы вы уловили. Если будут какие-то вопросы по теме – пишем, добавлю ответы в пост.

Установка и настройка плагина Add Posts to Pages

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

Для начала работы с этим плагином вам нужно:

1. 1.Через административную панель сайта WordPress перейти к пункту меню Плагины => Добавить новый.
2. 2.Далее, в поле поиска вводим «Add Posts to Pages» нажимаем «Enter».
3. 3.После чего выполняем установку и активацию плагина. После активации вы можете сразу приступать к работе, ни каких дополнительных настроек выполнять не нужно.

Теперь вы можете, в нужном месте на странице своего блога вставить этот шорткод:

XHTML

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

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

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

XHTML

Давайте подробнее рассмотрим каждый из параметров:

• category= «ЯРЛЫК_РУБРИКИ» — тут я думаю все понятно, указываете рубрику, или рубрики, через запятую, записи из которые вы хотите выводить.Ярлык нужной вам рубрики можно посмотреть перейдя в «Записи» => «Рубрики».Оно находится в столбце «Ярлык» напротив названия нужной вам категории.
• tag= «МЕТКА» — так же можно выводить посты указывая метку, присвоенную ему при созданий. Перечень меток можно просмотреть перейдя в «Записи» => «Метки».
• Show= «5» — данный параметр позволяет указать количество выводимых постов на странице.
• H= «2» — можно указать размер заголовка, но не забывайте, что по требованиям SEO-оптимизации второстепенные заголовки должны быть не выше H2.
• full= «false» — нужно задать true, если вы хотите вывести статью в полном объеме. Нельзя использовать совместно с параметром readmore.
• readmore=»Read more link text» — если отображается сокращенная запись, можно задать текст ссылки для продолжения чтения. Обычно используют «Подробнее» или «Читать далее».Для правильной работы необходимо, при редактировании статьи, задать тег «Далее».
• img= «true» — при заданном значении true показывает миниатюру. False (заданно по умолчанию) — миниатюра не отображается.
• Size= «350» — можно задать размер миниатюры. Задается сразу ширина и высоты, одним значением.

ShortCoder

Если вы хотите создавать свои собственные шорткоды при помощи плагина на WordPress, не выбирать из списка готовых, а именно создавать свои. Тогда вам подойдёт плагин ShortCoder, который позволяет легко это сделать, а потом использовать созданные шорткоды на страницах и в записях.
Создавать собственные шорткоды – это очень практично, особенно, если вы часто размещаете рекламу на сайте.

ShortCoder – это очень удобный в использовании плагин с простым интерфейсом и функционалом, который решает все самые распространённые проблемы пользователей.Для создания шорткода нам нужно:

1. 1.После установки плагина заходим «Настройки» => «ShortCoder».
2. 2.Ввести имя шорткода
3. 3.Добавляем фрагмент кода, который будет выводится на страницы при использовании данного шорткода.
4. 4.Нажимаем кнопку “Create Shortcode”
5. 5.Сам шорткод можно увидеть в верхней правой части панели создания шорткода.

Divi Builder

Divi Builder — это высококачественный конструктор страниц, который высоко ценится в Elegant Themes. Хотя он обычно используется как часть темы WordPress Divi, Divi Builder также является отдельным плагином, который можно использовать в других темах WordPress.

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

По сути, вместо боковых панелей все находится во всплывающих окнах и плавающих кнопках. Он предоставляет вам доступ к предопределенным шаблонам 316, распространяемым по различным пакетам презентаций 40, а также позволяет сохранять собственные дизайны в качестве шаблонов.

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

Вы даже можете добавить пользовательский CSS, потому что его редактор CSS объединяет базовую проверку и автозаполнение. Одним из критиков Divi Builder всегда было то, что он основан на шорткодах. Это означает, что если вы отключите его однажды, в вашем контенте останется куча шорткодов. Хотя это немного удручает, но теперь существует меньше проблем с такими плагинами, как Shortcode Cleaner.

WordPress Shortcodes

Этот плагин включает в себя более 20 шорткодов WordPress и простой редактор шорткодов.

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

• SEO-ready вкладки, кнопки;
• Карточки авторов;
• Окна сообщений;
• Смарт-ссылки;
• Разделы;
• Списки и т.д.

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

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

Что такое шорткод в WordPress?

Он похож на HTML-тег, но заключен в квадратные скобки вместо угловых скобок. Кратко говоря, шорткод – это специальный тег, который содержит «краткую ссылку», заменяющуюся другим контентом при просмотре страницы в браузере. Яркий пример – использование шорткода фотогалереи: вы вставляете при редактировании поста небольшой код [], а при просмотре страницы в браузере, этот небольшой шорткод превратится в большой по объему контент с фотогалереей. В этом и заключается прелесть шорткода: вы один раз подготавливаете большой контент, «упаковываете» его в шорткод, а потом при написании записи в блоге не пишете весь этот контент, а вызываете его с помощью небольшого шорткода! WordPress позволяет создавать любое множество своих собственных шорткодов, с помощью которых вы можете отображать практически любой контент!

Практический пример. Давайте представим, что перед нами стоит задача добавлять в каждый пост блок с рекламой. Самое простое решение – это копировать и вставлять рекламные блоки, каждый раз, когда это необходимо. Но, это очень утомительно. А если представить, что код рекламы поменялся? Тогда нам придется переписывать все свои посты с такими рекламными объявлениями! Намного проще использовать для такой задачи шорткод: вы создаете код рекламы только один раз, а если поменяется код, вам нужно будет обновить его только в одном месте.

Итак, создадим шорткод [], с помощью которого мы будем добавлять рекламу в свои посты.

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

Первое, что нужно сделать, это определить функцию, которая будет возвращать фактический код рекламы, например, от Google AdSense. Т.е., каждый раз при вызове этой функции, она должна будет просто возвращать нужный нам текст.

Добавьте для этого следующий код в файл в вашей действующей теме:

function sebweo_google_adsense($atts) {
    return '';
}
add_shortcode('reklama', 'sebweo_google_adsense');

Это очень простая функция – она всего лишь возвращает код рекламы Google Adsense в виде строки. Потом, после определения функции, мы регистрируем ее в качестве шорткода инструкцией:

add_shortcode('тут название шорткода', 'а здесь вызываемая функция шорткода');

ВНИМАНИЕ: замените код рекламы на свой код. Вы также можете использовать любое другое допустимое название функции, а также шорткода

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

Как использовать созданный шорткод?

Так, мы создали шорткод, но он не появился на страницах сайта магическим образом. Чтобы он появился на страницах, его нужно туда добавить. Самый простой способ: при редактировании поста добавить в нужное место созданный ранее шорткод. Просто напишите [] в нужном месте (в режиме Визуального редактора или же в режиме Текст) и сохраните пост. Обновите страницу поста во фронт-энде сайта и вы увидите, как только что создали свой первый шорткод! С чем вас и поздравляем!

Журнал изменений

5.2.1

• Fix: Custom parameters being not replaced in some scenarios.
• Fix: Minor enhancement to insert custom parameter form.

5.2

• New: Default values can now be provided to custom parameters.
• Fix: Script tags, custom field placeholder and backslash being stripped after saving the shortcode sometimes.
• Fix: Rel attribute being modified for links.
• New: Added «Manage shortcodes» link to plugin list page for easy access after activation.

5.1

• New: Import/Export link added to the shortcoder list page.
• Fix: was throwing error at some places for users using PHP 5.5 below as function return value was passed to it.
• Fix: Shortcoder QTTags button was loading in frontends.
• Fix: «Insert shortcode» popup was hidden behind in theme customizer page.
• Fix: array but bool given warning.
• Fix: Hide comments metabox in shortcode edit page as it was shown in certain conditions.

Fix: script and style tags stripped after 4.x upgrade. New migration will run in this version and shortcode content will now be fixed.

Fix: Shortcode content is not escaped when code editor is used. This is requirement because post_content behaves strangely when user has rich editing enabled.

• Fix: Shortcodes inside shortcode content not getting executed.
• Fix: Disable Gutenberg block for older not supported WordPress versions.

• Fix: Code editor escaping HTML characters.
• Fix: undefined.
• Fix: Code editor breaks if there is any other plugin which loads codemirror.
• Fix: is not found.

4.4

• New: Insert shortcode automatically adds «closing tag» if the shortcode has enclosed content parameter.
• Fix: Codemirror has been updated to latest version.

4.3

• New: Edit shortcode name after creating.
• New: Post modified date parameter added.
• Fix: Date parameters now display in site language.

4.2

• Fix: Some plugins fail to fire onload JS event since it was overwritten by shortcoder.
• Fix: Javascript in insert shortcode popup not working in IE 11.
• Fix: Missing parenthesis while calling .
• Fix: Widgets page not loading insert shortcode popup.
• Fix: Removed settings emoji icon from plugin actions list.
• Fix: Load latest version 5.42.0 of codemirror.
• Fix: Updated minimum required WordPress version.

4.1.7

• New: Categorize, search and filter shortcodes using «tags».
• New: Last used shortcode editor will be saved along with shortcode.
• New: Enclosed shortcode content can now be used as shortcode parameter.
• New: Active line highlight has been enabled for code editor.
• Fix: Codemirror has been updated to latest version.
• Fix: Minor admin interface enhancements.

4.1.6

• New: Date variables can noe be added into shortcode content.
• Fix: Error «trying to get property of non-object» is handled.

4.1.3

• Fix: Shortcode names with not-allowed characters cannot be edited/deleted.
• New: Shortcode imports made can now be fresh or overwritten.
• New: Only users with capability will see «edit shortcode» option in insert window.
• Fix: Import failure with UTF-8 characters.
• Fix: Case sensitive search in admin pages.
• Fix: Minor admin interface changes.

4.1

• New: Import/export feature for shortcodes.
• Fix: Visual editor is now disabled by default.
• Fix: Added instructions in admin page.

4.0

• New: Plugin rewritten from scratch.
• New: Brand new administration page
• New: Shortcode vissibility settings, show/hide in desktop/mobile devices
• New: Insert WordPress information into shortcode content.
• Fix: Insert shortcode window is not loading.
• Fix: Unable to delete the shortcodes

(Older changelogs are removed from this list)

Shortcodes Ultimate

Если вы ищите плагин для работы с шорткодами на WordPress на русском, тогда этот вариант станет для вас идеальным. Shortcodes Ultimate – это самый популярный плагин в репозитории WordPress. Его скачали более 780 тысяч раз. В наличии более 50 шорткодов, здесь есть много интересного, начиная от кнопок и заканчивая каруселями изображений.
Более того, работать с плагином очень удобно, все лаконично структурировано и красиво оформлено. Вся документация программы есть и на русском языке, что не может не радовать. Добавляются шорткоды при помощи простой кнопки «Вставить шорткод», которая появляется на странице редактирования записей и страниц после установки плагина.

Основные возможности плагина:

1. 1.Установка аудио в самовоспроизводящемся режиме.
2. 2.Наличие слайдеров и каруселей.
3. 3.Возможность установки формы подписки.
4. 4.Возможность выделения текста разными цветами и выделение заголовка.
5. 5.Создание галереи изображений.
6. 6.Возможность установки кнопок в любом месте страницы.

Создаем собственный php-код для шорткода WordPress

Некоторые разработчики плагинов не хотят предоставлять пользователям готовые php-коды. По всей видимости, они хотят, чтобы мы с Вами читали подобные уроки. Указывая только шорткод. К примеру, как в расширении слайдера ниже:

Slider CC

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

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

Шорткоды

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

Для каждого шорткода мы предоставим вам:

• Тело шорткода — длинный кусок кода, который должен быть вставлен в файл функций темы (functions.php) вашего блога, вставка осуществляется через «Редактор», доступный в панели инструментов WordPress (Дизайн > Редактор);
• Шорткод, который может быть размещен в любом месте вашей записи или страницы, через него подключается функционал.

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

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

Insert AdSense Ads

Вставляет блок объявления Google AdSense в том месте вашего контента, где вам нужно.

Шорткод:

Код:

function adsense_shortcode( $atts ) {  
	        extract(shortcode_atts(array(  
	            'format' => '1',  
	        ), $atts));  
	          
	        switch ($format) {  
	                case 1 :  
	                    $ad = ' 
	                        ';  
	                break;  
	        }  
	        return $ad;  
	}  
	add_shortcode('adsense', 'adsense_shortcode');

Выводит список похожих записей выше или ниже контента страницы.

Шорткод:

Код:

Insert PayPal Donation Link

Добавляет кнопку PayPal, с помощью которой пользователи могут удобно для себя сделать пожертвование.

Шорткод:

Код:

function donate_shortcode( $atts, $content = null) {  
	    global $post;extract(shortcode_atts(array(  
	        'account' => 'your-paypal-email-address',  
	        'for' => $post->post_title,  
	        'onHover' => '',  
	    ), $atts));  
	    if(emptyempty($content)) $content='Make A Donation';  
	            return ''.$content.''; 
	} 
	add_shortcode('donate', 'donate_shortcode');

Display A Google Map

Добавляет Google Map в любом месте вашей записи.

Шорткод:

Код:

function rockable_googlemap($atts, $content = null) {  
	   extract(shortcode_atts(array(  
	               "width" => '940',  
	               "height" => '300',  
	               "src" => ''  
	   ), $atts));  
	  
	return ' 
	             
	         
	        ';  
	}  
	  
	add_shortcode("googlemap", "rockable_googlemap");

Display External Files

Вставляет дополнительные файлы, такие как текст и изображения, в ваши сообщения.

Шорткод: [show_file file=»http://www.test.com/test.html»]

Код:

function show_file_func( $atts ) {  
	  extract( shortcode_atts( array(  
	    'file' => ''  
	  ), $atts ) );  
	  
	  if ($file!='')  
	    return @file_get_contents($file);  
	}  
	  
	add_shortcode( 'show_file', 'show_file_func' );

Add A Login Form

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

Шорткод:

Код:

function devpress_login_form_shortcode() {  
	    if ( is_user_logged_in() )  
	        return '';  
	  
	    return wp_login_form( array( 'echo' => true ) );  
	}  
	  
	function devpress_add_shortcodes() {  
	    add_shortcode( 'devpress-login-form', 'devpress_login_form_shortcode' );  
	}  
	  
	add_action( 'init', 'devpress_add_shortcodes' );

Display Private Notes

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

Шорткод: Your Note Here

Код:

add_shortcode( 'note', 'sc_note' );  
	  
	function sc_note( $atts, $content = null ) {  
	        if ( current_user_can( 'publish_posts' ) )  
	                return ''.$content.'';  
	        return '';  
	}

Registered Users Only Content

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

Шорткод: For Registered Users Only

Код:

add_shortcode( 'member', 'member_check_shortcode' );  
	  
	function member_check_shortcode( $atts, $content = null ) {  
	        if ( is_user_logged_in() && !is_null( $content ) && !is_feed() )  
	                return $content;  
	        return '';  
	}

Embed YouTube Videos

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

Шорткод: Check out this video!

Код:

function wptuts_youtube($atts, $content=null){    
	  
	    extract(shortcode_atts( array('id' => ''), $atts));    
	  
	    $return = $content;    
	    if($content)  
	        $return .= "";   
	  
	     $return .= '

https://youtube.com/watch?v=%27%2520.%2520%2524id%2520.%2520%27

';   
	  
	     return $return;  
	}    
	add_shortcode('youtube', 'wptuts_youtube');

Obfuscate Email Address

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

Код:

function emailbot_ssc($attr) {  
	    extract( shortcode_atts( array(  
	        'address' => '',  
	    ), $attr ) );  
	  
	     $email = '';  
	     $email .= antispambot($attr);  
	     $email .= '';  
	  
	     return $email;  
	}  
	add_shortcode('email', 'emailbot_ssc');

Данная публикация представляет собой перевод статьи «20 WordPress Shortcodes And Plugins You Might Want To Try» , подготовленной дружной командой проекта Интернет-технологии.ру

Каким образом функционирует шорткод?

Все проще некуда. Предположим, у Вас сайт на основе движка WordPress. На сайте установлен простенький шаблон из числа бесплатных. Вам захотелось установить красивый слайдер, где бы можно было перелистывать собственные фото. Делается всё очень просто. Заходим в раздел «Плагины» (расширения) и скачиваем понравившийся слайдер. Разработчики предлагают большое разнообразие таких. И Вам будет предложено воспользоваться не огромным кодом ниже:

Шорткод

Разметив на странице WordPress подобный код: вы получите свой заветный слайдер на сайте WP. Не надо никаких больших кодов с кучей символов. Короткий шорткод способен выводить любые скрипты.