Шорткоды wordpress

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

// Массив с сохраненными сообщениями $alert_boxes = array();  /**  * Выводит на экран текст сообщения и запоминает его.  * Сохраненное сообщение выводится шоткодом [alert_r id="$id"]  *  * @param array $atts параметры шоткода (используется id)  * @param string $content контент шоткода  *  * @return string блок(html) сообщением  */ function alert_callback( $atts = false, $content = '' ){ 	global $alert_boxes;  	$tpl = '<div class="alert-message">%s</div>'; 	$id = ( empty($atts['id']) ) ? false : $atts['id'];  	if( $id && $content ){ 		$alert_boxes[$id] = $content; 	}elseif( ! empty($alert_boxes[$id]) ){ 		$content = $alert_boxes[$id]; 	}else{ 		$tpl = ''; 	}  	return sprintf($tpl, $content); } add_shortcode('alert', 'alert_callback');  /**  * Выводит на экран текст сохраненного сообщения.  * Сохранение происходит при использовании шоткода 
$text
  *  * @param array $atts параметры шоткода (используется id)  *  * @return string блок(html) сообщением  */ function alert_r_callback( $atts = false ){ 	global $alert_boxes;  	$tpl = '<div class="alert-message alert-message-repeat">%s</div>'; 	$id = ( empty($atts['id']) ) ? false : $atts['id'];  	if( ! $id || empty($alert_boxes[$id]) ){ 		return ''; 	}  	return sprintf($tpl, $alert_boxes[$id]); } add_shortcode('alert_r', 'alert_r_callback');

В тексте человек использует шоткоды, к примеру так:

На ноль делить нельзя!
  Всякий текст, формулы  [alert_r id='1']  Ещё текст, формулы  
Умножение любого числа на ноль даст ноль!
  Побольше умных слов и формул  [alert_r id='1']  Тут вообще жесть пошла, голова кипит от формул  [alert_r id='2']

И получает на выходе:

<div class="alert-message">На ноль делить нельзя!</div> <p>Всякий текст, формулы</p> <div class="alert-message alert-message-repeat">На ноль делить нельзя!</div> <p>Ещё текст, формулы</p> <div class="alert-message">Умножение любого числа на ноль даст ноль!</div> <p>Побольше умных слов и формул</p> <div class="alert-message alert-message-repeat">На ноль делить нельзя!</div> <p>Тут вообще жесть пошла, голова кипит от формул</p> <div class="alert-message alert-message-repeat">Умножение любого числа на ноль даст ноль!</div>

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

На ноль делить нельзя!
  Всякий текст, формулы  [alert_r id='деление на ноль']

Также хорошим тоном было бы использовать API кеширования WordPress, а не объявлять глобальную переменную, но это уже в версии 2.0

wp-kama.ru

Пример простого шорткода

Содержание

• 1 Пример простого шорткода
• 2 Как вставить шорткод в WordPress
• 3 Назначение
• 4 Создание шорткодов
• 5 Использование плагинов
• 6 WP Shortcode by MyThemeShop
• 7 Shortcodes Ultimate
• 8 Fruitful Shortcodes
• 9 Shortcoder
• 10 Easy Bootstrap Shortcode
• 11 WP Canvas – Shortcodes
• 12 Arconix Shortcodes
• 13 Simple Shortcodes
• 14 Шорткоды WordPress: настройка
• 15 Набор функций «подпишись на RSS»
• 16 Добавление Google AdSense
• 17 Добавление RSS-канала
• 18 Добавление постов из базы данных
• 19 Вызов картинки последней статьи
• 20 Добавление наборов функций в виджеты
  • 20.1 Самый простой пример использования shortcode
  • 20.2 Как с помощью shortcode предложить подписаться на rss
  • 20.3 Добавление атрибута nofollow к ссылкам в тексте
  • 20.4 Шорткоды с использованием стилей
  • 20.5 Ретвит с помощью shortcode
  • 20.6 Вывод категорий с помощью shortcode
  • 20.7 Как вставлять shortcode в виджеты WordPress
  • 20.8 Выполнение шорткода в комментариях
  • 20.9 Как вставить шорткод в файл шаблона
  • 20.10 Как правильно вставлять видео с YouTube
• 21 1. Shortcode
• 22 2. WordPress Shortcodes
• 23 3. Post Content Shortcodes
• 24 4. Shortcoder
• 25 5. Hide Broken Shortcodes
• 26 6. Column Shortcodes
• 27 7. Metaphor Shortcodes
• 28 8. ShortCodes UI
• 29 9. Last Updated Shortcode
• 30 10. Geoportail Shortcode
• 31 Шорткоды
  • 31.1 Insert AdSense Ads
  • 31.2 Show Related Posts
  • 31.3 Insert PayPal Donation Link
  • 31.4 Display A Google Map
  • 31.5 Display External Files
  • 31.6 Add A Login Form
  • 31.7 Display Private Notes
  • 31.8 Registered Users Only Content
  • 31.9 Embed YouTube Videos

Начинающему пользователю необходимо научиться создавать и использовать специальные команды, а также уметь применять готовые варианты. Для этого нужно понять, из чего состоят шорткоды WordPress. В качестве примера можно взять строку [my_shortcode id=1 color=white]Какое-то предложение[/my_shortcode]. В этой записи пользователь вызывает опцию, привязанную к шорткоду. Строка состоит из двух параметров.

Первая часть записи является массивом, состоящим из атрибутов id и color. Вместо этих значений в открывающем теге можно указать любые параметры с желаемыми именами. Вторая часть записи является текстом. Для того чтобы обработать его, необходимо перевести всю запись в PHP. Пользователь получит строку следующего содержания: my_shortcode(array(‘id’=>’1’, ‘color’=’white’), ‘Какое-то предложение’).

При желании можно использовать запись без указанного выше закрывающего тега. Строка будет выглядеть так: [my_shortcode id=1 color=white]. В этом случае в функцию передаются только атрибуты, перечисленные в открывающем теге. Указанный вариант записи используется при вызове опции, не нуждающейся в получении других сведений для обработки. Для того чтобы добавить галерею, достаточно указать в атрибутах ID.

Как вставить шорткод в WordPress

Использовать наборы функций очень просто. Блогеру нужно создать новый пост или открыть для редактирования уже имеющуюся запись. Затем необходимо переключить редактор текста на HTML-режим и указать код в квадратных скобках: [showcase]. Можно также использовать атрибуты. Запись будет выглядеть так: [showcase id=»1″].

В шорткоды можно встраивать любой контент: [url href=»ссылка на сайт»]текст[/url]. В WordPress 2.5 введен набор функций, называемый Shortcode API. После сохранения поста содержание записи обрабатывается. Параллельно Shortcode API преобразует шорткоды для исполнения возложенных на них функций.

Назначение

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

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

Если пользователь знает, как напечатать простую PHP-функцию, то он с легкостью достигнет поставленной цели. Для создания шорткода нужно найти и открыть один из файлов WordPress functions.php. Затем необходимо вставить строку function hello() {return ‘Привет, мир!’;}. Этим действием будет создана функция, отвечающая за вывод указанного текста. Чтобы трансформировать ее в шорткод, требуется вставить команду add_shortcode()» после опции «hello().

Строка будет выглядеть так: add_shortcode(‘hw’, ‘hello’);. После создания шорткода пользователь может использовать его в заметках и на страницах. Для этого необходимо переключиться в HTML-режим и ввести строку [hw]. Этот шорткод является наглядным примером того, насколько просто создавать подобные наборы функций.

Использование плагинов

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

WP Shortcode by MyThemeShop

Совсем недавно это бесплатное расширение распространялось в виде премиум-решения. Сейчас плагин шорткодов WordPress содержит 24 основных элемента: кнопки, географические карты, разделители, таблицы расценок и многое другое. Для начала работы блогеру нужно установить дополнение и открыть текстовый редактор. Чтобы добавить шорткод, необходимо кликнуть по иконке «+». Количество настроек в появляющемся всплывающем окне зависит от выбора пользователя.

Для кнопки можно указать ссылку и текст. После добавления шорткода в редакторе появится запись, содержащая тип элемента и параметры. Можно заметить, что пользоваться плагином достаточно просто.

Shortcodes Ultimate

Это одно из самых популярных расширений. Дополнение встречается в каждой подборке плагинов для настройки WordPress. Расширение доступно каждому пользователю. При необходимости загружаются платные дополнения к плагину. Блогер может работать с 50 элементами оформления страниц, генератором шорткодов и редактором стилей CSS.

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

Fruitful Shortcodes

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

Блогер может работать с горизонтальными и вертикальными табами, колонками, разделителями и т. д. Добавленные элементы мгновенно отображаются в графическом редакторе. Пользователь может выключить их для постов или веб-страниц с помощью раздела «Настройки».

Shortcoder

Этот плагин также часто встречается в разных подборках. Расширение обновляется очень редко. Пользователь может создавать наборы функций с применением HTML и JavaScript-кодов. Одним из самых простых примеров является размещение рекламного блока в тексте. Для этого нужно создать набор функций adsenseAd.

Затем необходимо добавить туда код рекламного блока. Далее следует вызвать его в посте командой [sc:adsenseAd]. Пользователь может передавать новые параметры в шорткод с помощью редактора контента.

Плагин Shortcoder – это очень гибкий инструмент. Здесь не удастся найти базовые шорткоды. Пользователь может создать необходимые элементы самостоятельно.

Easy Bootstrap Shortcode

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

Расширение было создано для работы с сеткой веб-ресурса, поэтому в нем есть множество настроек для колонок. Блогер может создавать несколько блоков, а также указывать размеры и отступы. Плагин поддерживает адаптивную верстку. Пользователь также может работать с базовыми шорткодами: табами, списками, кнопками, метками, слайдерами и т. д.

WP Canvas – Shortcodes

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

Плагин поддерживает пользовательские стили, HTML-код, шрифты с иконками. При желании блогер может включить отображение выборки постов сайта на странице. Разработчики предоставили пользователям только краткое описание программного продукта. При этом плагин отлично справляется со всеми возложенными на него функциями.

Arconix Shortcodes

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

Simple Shortcodes

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

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

Шорткоды WordPress: настройка

Как вывести ссылку для публикации поста в социальной сети «Твиттер»? Для этого требуется открыть файл functions.php и вставить рядом с другими шорткодами WordPress в PHP строку следующего содержания: function twitt(){return ‘<div id=»twitit»><a href=»страница входа на сайт =Currently reading ‘.get_permalink($post->ID).’»title=»поделись заметкой с друзьями!» >отправить</a></div>’;}add_shortcode(‘twitter’, ‘twitt’);.

Затем необходимо переключиться в HTML-режим. Далее следует ввести слово [twitter]. Ссылка будет добавлена туда, где пользователь оставил шорткод.

Набор функций «подпишись на RSS»

Одним из самых эффективных способов увеличения числа подписчиков является показ правильно оформленного сообщения. Блогеру не нужно менять весь код темы для WordPress. Пользователь должен решить самостоятельно, где будет выводиться набор функций. Код выглядит так: function subscribeRss() {return ‘<div class=»rss-box»><a href=»ссылка на сайт «>Подписка </a></div>’;} add_shortcode(‘subscribe’, ‘subscribeRss’);.

Добавление Google AdSense

Многие блогеры пользуются сервисом контекстной рекламы. Вставить код инструмента от Google в файл темы не составит труда. Но специалисты по маркетингу знают, что люди чаще переходят по ссылкам, встроенным в контент. Чтобы вставить рекламный блок в любое место на странице, нужно создать шорткод и вызвать его командой [adsense].

Добавление RSS-канала

Чтобы выполнить эту задачу, нужно преобразовать функцию в шорткод. Затем необходимо включить HTML-режим и вставить в поле редактора строку [rss feed=»ссылка » num=»3″]. Первый атрибут указывает на URL RSS-ленты, а второй – на количество заметок для вывода.

Добавление постов из базы данных

Чтобы вызвать перечень статей прямо в редакторе, нужно создать шорткод, переключиться на HTML-режим и вставить строку [liste num=»5″ cat=»2″]. Эта команда позволит вывести список пяти постов из категории с ID 2. Стоит обратить внимание на то, что плагины WordPress могут отображать связанные между собой записи. Однако с помощью шорткода блогер легко получит список любого количества публикаций из отдельной категории.

Вызов картинки последней статьи

Чтобы упростить работу с изображениями, можно использовать наборы функций. Для вызова картинки последнего поста нужно создать шорткод. Затем следует включить HTML-режим и вставить в поле для редактирования строку [postimage size=»» float=»center»].

Добавление наборов функций в виджеты

Стоит обратить внимание на то, что в боковых колонках сайта ни один шорткод WordPress не работает. Ограничение платформы можно обойти. Для этого необходимо открыть файл темы для WordPress functions.php и вставить строку add_filter(‘widget_text’, ‘do_shortcode’);. Шорткод будет добавлен в виджет.

fb.ru

Введённые начиная с версии WordPress 2.5, шорткоды — это мощная, но до сих пор малоизвестная функция WordPress. Представь, что ты можешь просто напечатать «adsense» что бы показывать рекламу AdSense или «post_count», что бы моментально узнать количество постов в твоём блоге.

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

Что такое шорткоды(shortcode)?

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

[showcase]

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

[showcase id="5"]

Шорткоды также позволяют встраивать контент:

[url href="http://www.smashingmagazine.com"]Smashing Magazine[/url]

Шорткоды управляются набором функций, введённых в WordPress 2.5 и называемых Shortcode API. Когда пост сохранён, его содержание парсится и Shortcode API автоматически трансформирует шорткоды для исполнения возложенной на них функции.

Создание простого шорткода

Шорткоды очень просто создать. Если ты знаешь, как написать простую Php-функцию, то ты уже знаешь, как создать WordPress шорткод. Для начала давай создадим известное сообщение «Привет, мир»

1. Открой файл functions.php твоей темы. Если его нет, то создай.
2. Первое, мы должны создать функцию для вывода строки «Привет, мир». Вставь следующий код в твой файл functions.php:

function hello() {  return 'Привет, мир!';  }

3. Теперь у нас есть функция, мы должны превратить её в шорткод. Это очень просто сделать, благодаря функции add_shortcode(). Вставь эту строку после нашей функции hello(), потом сохрани и закрой файл functions.php:

add_shortcode('hw', 'hello');

Первый параметр это имя шорткода, а второй это имя функции.

4. Теперь, когда шорткод создан, мы можем использовать его в постах и на страницах. Для этого просто переключись в HTML режим и введи следующее:

[hw]

Вот и всё! Конечно, это очень простой шорткод, но это хороший пример того, насколько просто их создавать.

Создание продвинутых шорткодов

Как упоминалось, шорткоды могут быть использованы с атрибутами, которые очень полезны. В этом примере мы покажем тебе, как создать шорткод для вывода URL, точно так же, как ты это делал с BBCode на форумах вроде VBulletin и PHPBB.

1. Открой твой файл functions.php. Вставь в него следующую функцию:

function myUrl($atts, $content = null) {  extract(shortcode_atts(array(  "href" => 'http://'  ), $atts));  return '<a href="'.$href.'">'.$content.'</a>';  }

2. Теперь преобразуем функцию в шорткод:

add_shortcode("url", "myUrl");

3. Шорткод создан. Ты можешь использовать его в постах и на страницах примерно так:

[url href="http://www.wp-info.ru"]WP-INFO.ru - настройка WordPress[/url]

Когда ты сохранишь пост, шорткод выведет ссылку озаглавленную «WP-INFO.ru — настройка WordPress» и ведущую на http://www.wp-info.ru.

Объяснение кода. Для правильной работы, функции нашего шорткода необходимо обращаться с двумя параметрами: $atts и $content. $atts(attribute(s)) это шорткод-атрибут. В этом примере атрибут называется href и содержит ссылку на URL. $content это содержание шорткода, встроенное между доменом и поддиректорией(т.е. между «www.example.com» и «/subdirectory»). Как ты можешь убедиться в коде мы дали $content и $atts значения по-умолчанию.

Теперь мы знаем, как создать и использовать шорткоды, давай заценим несколько готовых к использованию шорткодов!

1. Шорткод Отправить в твиттер

Цель. Выводить ссылку для отправки поста в твиттер.

Этот шорткод просто создать. Вставь следующий код в файл functions.php твоей темы:

function twitt() {  return '<div id="twitit"><a href="http://twitter.com/home?status=Currently reading '.get_permalink($post->ID).'" title="Кликни и отправь этот пост в твиттер!" >Отправить в твиттер</a></div>';  }    add_shortcode('twitter', 'twitt');

Чтобы его использовать, просто переключись в HTML-режим и введи:

[twitter]

И ссылка Отправить в твиттер появится там где ты оставил шорткод.

2. Создать шорткод «Подпишись на RSS»

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

Как и раньше мы создаём функцию, а потом переводим её в шорткод. Этот код должен быть в твоём файле functions.php. Не забудь изменить URL фида в примере на твой собственный!

function subscribeRss() {  return '<div class="rss-box"><a href="http://feeds.feedburner.com/vverxcom">Понравился пост? Подпишись на мой RSS фид!</a></div>';  }    add_shortcode('subscribe', 'subscribeRss');

Стилизация. Ты возможно заметил класс rss-box, который добавлен в div, содержащий ссылку. Он позволит тебе стилизовать сообщение по вкусу. Вот пример некоторого CSS стиля, который ты можешь применить на своём сообщении. Просто вставь его в файл style.css своей темы:

.rss-box{  background:#F2F8F2;  border:2px #D5E9D5 solid;  font-weight:bold;  padding:10px;  }

3. Вставляй Google AdSense везде где хочешь

Многие блоггеры пользуются Google AdSense. Очень просто вставить код AdSense в файл темы, такой как sidebar.php. Но успешные онлайн маркетологи знают, что люди кликают чаще на рекламу, которая встроена в контент.

Что бы встроить AdSense в любом месте твоего поста или страницы, создай шорткод:

1. Открой файл functions.php твоей темы и вставь следующий код. Не забудь заменить код JavaScript своим собственным кодом AdSense!

function showads() {  return '<div id="adsense"><script type="text/javascript"><!--  google_ad_client = "pub-XXXXXXXXXXXXXX";  google_ad_slot = "4668915978";  google_ad_width = 468;  google_ad_height = 60;  //-->  </script>  <script type="text/javascript"  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">  </script></div>';  }    add_shortcode('adsense', 'showads');

2. Сохранив изменения в functions.php, ты можешь использовать следующий шорткод для отображения AdSense в любом месте твоих постов и страниц:

[adsense]

Заметь, что наш код AdSense обёрнут в div с id=»adsense», мы можем добавить ему стиля в файле style.css.

Объяснение кода. Верхний код использован просто для вывода объявлений AdSense. Когда шорткод вставлен в пост, он возвращает AdSense объявление. Это довольно просто, но согласись реально экономит время!

4. Встроить RSS поток

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

Как обычно, что бы этот трюк удался, просто скопируй следующий код в файл function.php твоей темы.

//This file is needed to be able to use the wp_rss() function.  include_once(ABSPATH.WPINC.'/rss.php');    function readRss($atts) {  extract(shortcode_atts(array(  "feed" => 'http://',  "num" => '1',  ), $atts));    return wp_rss($feed, $num);  }    add_shortcode('rss', 'readRss');

Что бы использовать шорткод, введи:

[rss feed="http://feeds.feedburner.com/wprecipes" num="5"]

Аттрибут feed это URL, встраиваемого фида, а num, это количество постов для вывода.

5. Бери посты из базы данных WordPress с помощью шорткодов

Когда-нибудь хотел вызывать список связаных постов прямо в редактор WordPress? Конечно, плагин «Simple Tags» или «Related posts» может показать связанные записи, но с шорткодом ты можешь легко получить список любого числа постов из отдельной категории.

Вставь этот код в твой файл functions.php.

function sc_liste($atts, $content = null) {  extract(shortcode_atts(array(  "num" => '5',  "cat" => ''  ), $atts));  global $post;  $myposts = get_posts('numberposts='.$num.'&order=DESC&orderby=post_date&category='.$cat);  $retour='<ul>';  foreach($myposts as $post) :  setup_postdata($post);  $retour.='<li><a href="'.get_permalink().'">'.the_title("","",false).'</a></li>';  endforeach;  $retour.='</ul> ';  return $retour;  }  add_shortcode("list", "sc_liste");

Для использования вставь следующее в редактор WordPress, в HTML режиме:

[liste num="3" cat="1"]

Это выведет список трёх постов из категории с ID 1.

Объяснение кода. После извлечения аргументов и создания глобальной переменной $posts, функция sc_liste() использует функцию get_posts() с параметрами numberposts, order, orderby и category, что бы получить Х наиболее похожих постов из Y категории. После этого, посты встраиваются в виде HTML списка и выводятся на экран.

6. Вызывай картинку последнего поста

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

Открой файл functions.php и вставь следующий код:

function sc_postimage($atts, $content = null) {  extract(shortcode_atts(array(  "size" => 'thumbnail',  "float" => 'none'  ), $atts));  $images =& get_children( 'post_type=attachment&post_mime_type=image&post_parent=' . get_the_id() );  foreach( $images as $imageID => $imagePost )  $fullimage = wp_get_attachment_image($imageID, $size, false);  $imagedata = wp_get_attachment_image_src($imageID, $size, false);  $width = ($imagedata[1]+2);  $height = ($imagedata[2]+2);  return '<div class="postimage" style="width: '.$width.'px; height: '.$height.'px; float: '.$float.';">'.$fullimage.'</div>';  }  add_shortcode("postimage", "sc_postimage");

Что бы использовать этот шорткод, просто введи следующую строку в редакторе в режиме HTML

[postimage size="" float="left"]

Объяснение кода. Функция sc_postimage() сначала выполняет аттрибуты шорткода. Потом она берёт картинку при помощи следующих функций WordPress get_children(), wp_get_attachment_image() и wp_get_attachment_image_src(). После этого картинка возвращается, встроенной в содержание поста.

7. Добавление шорткодов в виджеты боковой колонки

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

Ещё немного кода для вставки в файл functions.php:

add_filter('widget_text', 'do_shortcode');

Это всё, что тебе нужно.

Объяснение кода. То, что мы сделали, довольно просто: мы добавили фильтр к функции widget_text(), что бы выполнить функцию do_shortcode(), которая использует API для исполнения шорткодов. Таким образом шорткоды теперь включены в виджетах боковой колонки.

Этот пост является переводом статьи Mastering WordPress Shortcodes
Перевод статьи Вверх_ком

www.wp-info.ru

Всем привет! Сегодня на seo-mayak.com я еще раз коснусь темы использования функций shortcode WordPress.

Что такое shortcode? Шорткоды — это набор простейших функций, создающих микро-коды, которые можно использовать в стандартном редакторе WordPress, в виджетах и также в файлах шаблона, для различных целей.

Вот как раз о целях использования шорткодов мы сегодня и поговорим.

Не так давно, в своей статье — заработок на контекстной рекламе, я показал пример использования шорткодов для вставки рекламных объявлений Яндекс Директ и Google AdSense, но это далеко не все их возможности.

Многие веб-мастера вообще не знают о существовании коротких кодов, так как в WordPress эта функция появилась только с выходом версии 2.5, что сравнительно недавно. Безусловно shortcode очень удобны и они значительно облегчают жизнь блогерам.

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

Самый простой пример использования shortcode

Наверное проще такой функции shortcode и придумать нельзя и вставляется она в файл functions.php в самый конец перед знаком «?>»:

  function mayak_easy() {  return'Здравствуйте дорогие читатели блога seo-mayak.com';  }  add_shortcode('hi', 'mayak_easy');  

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

Для этого в визуальном режиме редактора WordPress достаточно прописать:

[hi]

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

Теперь немного усложним задачу и сделаем домен ссылкой:

    function mayak_easy() {  return 'Здравствуйте дорогие читатели блога <a href="">seo-mayak.com</a>';  }  add_shortcode('hi', 'mayak_easy');    

Проще простого. Идем дальше.

Как с помощью shortcode предложить подписаться на rss

Добавление атрибута nofollow к ссылкам в тексте

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

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

В файл functions.php вставляем следующее:

  function mayak_nofollow($attr, $content= null){   $link = explode("href", $content);   return $link[0].' rel="nofollow" href'.$link[1];  }  add_shortcode('nw', 'mayak_nofollow');  

Затем, прямо в визуальном редакторе, оборачиваем ссылку в теги:

[nw]Внешняя ссылка[/nw]

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

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

Откуда я их взял? Сам сделал! Я и Вас научу! Так что подписывайтесь на обновления блога, чтобы не пропустить интересный материал.

Шорткоды с использованием стилей

Например нам надо подсветить цветным фоном определенный участок текста. В файл functions.php вставляем следующую функцию:

  function mayak_background($attr,$content= null){  return'  <style type="text/css">  .yellow_background{   border: 1px solid #d2d2d2;   background-color: #FFFF80;   padding:10px;   margin: 5px 10px;  }  </style>  <div class="yellow_background">'.$content.'</div>  ';  }  add_shortcode('yw', 'mayak_background');  

Заключаем участок текста в теги:

[yw]Участок текста[/yw]

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

background-color:#xxxxxx;

По желанию можно убрать стили из функции и прописать их в файле style.css.

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

Ретвит с помощью shortcode

Очень интересная и опять же полезная функция, которая выводит кнопку «Твитнуть»:

  function mayak_twitt() {  return '  <style type="text/css">  button{  background: #2E8CE3;  padding: 7px 30px;  font-size: 13px;  font-weight: bold;  color: #FFFFFF;  text-align: center;  border: solid 1px #73C8F0;  cursor: pointer;  border-radius: 5px;  -moz-border-radius: 5px;  -webkit-border-radius: 5px;  background: -moz-linear-gradient(0% 100% 90deg, #2E8CE3, #fff);  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff),  to(#2E8CE3));  box-shadow: inset 0 1px 0 0 #FFFFFF;  -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);  -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);  border-bottom: 1px solid rgba(0,0,0,0.25);  text-shadow: 0 -1px 1px rgba(0,0,0,0.25);  }  button:hover {  background: #2E69E3;  background: -moz-linear-gradient(0% 100% 90deg, #2E69E3, #59C2FF);  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#59C2FF),  to(#2E69E3));  }  button:active {  background: #2E69E3;  background: -moz-linear-gradient(0% 100% 90deg, #2E69E3, #59C2FF);  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#59C2FF),  to(#2E69E3));  box-shadow: inset 1px 1px 0 0 #004A7F;  -moz-box-shadow: inset 1px 1px 0 0 #004A7F;  -webkit-box-shadow: inset 1px 1px 0 0 #004A7F;  padding: 8px 29px 6px 31px;  }  </style>    <button><a title="Кликни и отправь этот пост в Твиттер!" href="http://twitter.com/home?status=В данный момент я читаю '.get_permalink($post->ID).'">Твитнуть</a></button>';  }    add_shortcode('tt', 'mayak_twitt')  

В нужном месте статьи вставляем:

[tt]

И пользователям явиться вот такая симпатичная кнопочка:

Твитнуть

Можете попробовать твитнуть и посмотреть как она работает 🙂

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

Вывод категорий с помощью shortcode

Для выводы списка категорий, в WordPress отвечает специальный тег

<?php wp_list_categories();?>

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

  function mayak_category($atts, $content = null) {   extract(shortcode_atts(array( 'name' => null, ),$atts));   return wp_nav_menu(array('menu' => $name,'echo' => false));  }  add_shortcode('cat', 'mayak_category');  

В редакторе пишем:

[cat]

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

Как вставлять shortcode в виджеты WordPress

По умолчанию WordPress не разрешает использовать шорткоды в виджетах, но этот запрет можно обойти с помощью фильтра, который надо добавить в тот же файл functions.php:

add_filter('widget_text', 'do_shortcode');

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

Выполнение шорткода в комментариях

Здесь мы просто применим другой фильтр:

add_filter( 'comment_text', 'do_shortcode' );

Все просто!

Но что делать если есть необходимость применить короткий код в файле шаблона, например для вставки контекстной рекламы?

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

Для вставки шорткода в файл php придется квадратные скобки и их содержимое поместить в специальный php-контейнер:

<?php echo do_shortcode('[Короткий код]');?>

Как видите shortcode WordPress обладают широкими возможностями и на полную веб-мастера их еще не используют, а зря.

Как правильно вставлять видео с YouTube

В заключение я хочу рассказать вот о чем. Еще пару месяцев назад я использовал шорткод для вставки видео с YouTube и даже планировал им с Вами поделиться, но в ходе изучения материала я понял, что необходимость в этом уже отпала. Почему?

Просто с выходом версии 2.9 в WordPress появилась возможность вставлять видео в пост с помощью обычной ссылки. Например:

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

С выходом WordPress 3.5 разработчики движка исправили данный недочет. Каким образом? С помощью уже знакомого нам shortcode.

Теперь для вставки видео в пост надо в визуальном режиме прописать следующее:

[ embed width="640" height="360"]Ссылка на видео с YouTube[ /embed]

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

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

На сегодня у меня все. Как Вам статья?

С уважением, Виталий Кириллов

seo-mayak.com

1. Shortcode

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

[ postcountbr ] — отображает общее количество опубликованных в блоге записей;
[ catcountbr ] — отображает общее количество категорий, которые содержат одну или более запись;
[ tagcountbr ] — отображает общее количество тегов, которые содержатся в одной или более записи;
[ totalwords ] — отображает общее количество слов в опубликованных записях;
[ commentcount ] — отображает общее число одобренных комментариев;
[ PageCount ] — отображает общее количество опубликованных страниц.

2. WordPress Shortcodes

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

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

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

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

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

3. Post Content Shortcodes

Этот плагин добавляет в блог два шорткода:

[post-content] — позволяет отображать содержимое одиночной записи или страницы, внутри другой записи или страницы. Вы должны использовать в шорткоде аргумент, чтобы указать ID поста. Вы также можете использовать аргументы, чтобы отображать характерное изображение, фрагмент записи и заголовок поста;

[post-list] — отображает список записей внутри другой записи. Этот шорткод также поддерживает опциональные аргументы для настройки списков: опции упорядочения элементов, типы/статусы сообщений, вывод изображений и т.д. Вы даже можете подтянуть список записей из другого блога, добавив ID блога в качестве аргумента в шорткод.

4. Shortcoder

Плагин Shortcoder позволяет создавать пользовательские шорткоды через визуальный редактор. Вы также можете хранить часто используемые тексты, HTML и фрагменты JavaScript.

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

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

5. Hide Broken Shortcodes

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

Другие варианты: Hide Unwanted Shortcodes аналогичный плагин, который делает «битые» шорткоды недоступными для просмотра на сайте. После этого вы можете отредактировать шорткод на странице настроек плагина.

6. Column Shortcodes

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

На выбор предлагается 10 размеров столбцов: от одной шестой до всей ширины страницы. Вы также можете настроить заполнение каждого отдельного столбца:

7. Metaphor Shortcodes

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

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

• Post Block Shortcode — отображает название и выдержку из любого типа сообщений в любом месте вашего блога;
• Post Slider Shortcode — создает горизонтальный слайдер для любого типа сообщений и выводит его в контенте блога;
• Pricing Table Shortcode — создает различные типы таблиц прайсов для отображения в контенте вашего блога.

8. ShortCodes UI

ShortCodes UI это еще один плагин для создания шорткодов, которые используют собственные кнопки TinyMCE и Quicktag. Вы можете легко вставлять шорткоды в ваши сообщения и страницы через визуальный и HTML редакторы.

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

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

Другие варианты: My Shortcodes — это аналогичный плагин с красивым интерфейсом, который позволяет создавать собственные шорткоды.

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

9. Last Updated Shortcode

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

Есть также опции для изменения формата отображения даты / времени.

10. Geoportail Shortcode

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

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

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

Шорткоды

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

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

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

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

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

Insert AdSense Ads

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

Шорткод: [adsense]

Код:

Show Related Posts

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

Шорткод: [related_posts]

Код:

Insert PayPal Donation Link

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

Шорткод: [donate]

Код:

Display A Google Map

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

Шорткод: [googlemap src=»google_map_url»]

Код:

Display External Files

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

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

Код:

Add A Login Form

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

Шорткод: [devpress-login-form]

Код:

Display Private Notes

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

Шорткод: [note]Your Note Here[/note]

Код:

Registered Users Only Content

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

Шорткод: [member]For Registered Users Only[/member]

Код:

Embed YouTube Videos

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

Шорткод: [youtube id=»_ggWarwhv9M»]Check out this video![/youtube]

Код:

www.internet-technologies.ru

Что такое шорткоды

Начиная с версии 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 = '<div class="price">';  if(is_array($GLOBALS['plans'])) {  foreach ($GLOBALS['plans'] as $plan) {  $planContent = '<div class="plan">';  $planContent .= $plan;  $planContent .= '</div>';  $output .= $planContent;  }  }  $output .= '</div>';  // вывод HTML кода  return $output;  } 

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

function plan_code ($atts, $content) {  // получаем параметры шорткода  extract(shortcode_atts(array(  'title' => '', // Plan title name  'price' => '0', // Plan price  ), $atts));  // Подоготавливаем HTML: заголовок плана  $plan_title = '<div class="plan-title">';   $plan_title .= ' <p>'.$title.'</p>';  $plan_title .= '</div>';  // Подоготавливаем HTML: стоимость  $f_price = round(floatval($price), 2);  $f_price = ($f_Price > 0) ? $f_Price : 0;  $s_price = '$'.$f_Price;  $price_plan = '<div class="plan">';  $price_plan .= ' <p class="price-sum">'.$s_price.'</p>';  $price_plan .= ' <small class="price-text">'.$text.'</small>';   $price_plan .= '</div>';   // инициализация глобальных переменных для опций  $GLOBALS['plan-options-count'] = 0;  $GLOBALS['plan-options'] = array();  // читаем контент и выполняем внутренние шорткоды  do_shortcode($content);  // Подоготавливаем HTML: опции  $plan_options = '<div class="plan-options">';  if (is_array($GLOBALS['plan-options'])) {  foreach ($GLOBALS['plan-options'] as $option) {  $plan_options .= $option;  }  }  $s_OptionsDiv.= '</div>';  // Подоготавливаем 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 = '<div class="price-option">';  $plan_option .= ' <p class="price-option-text">'.do_shortcode($content).'</p>';  $plan_option .= '</div>';  // сохраняем полученные данные  $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 "<div class=’col-lg-6’>".do_shortcode($content)."</div>"; } В этом случае исходный синтаксис станет: [column_half]  [column_half_inner] Content [/column_half_inner]  [column_half_inner] Content [/column_half_inner] [/column_half] [column_half] Content [/column_half] 

Заключение

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

Автор: Дмитрий Кабаков, Senior Front-end Developer.

habr.com