Введённые начиная с версии WordPress 2.5, шорткоды – это мощная, но до сих пор малоизвестная функция WordPress. Представь, что ты можешь просто напечатать «adsense» что бы показывать рекламу AdSense или «post_count», что бы моментально узнать количество постов в твоём блоге.
WordPress shortcodes могут сделать это и многое другое возможным, и определённо могут сделать твою блоггерскую жизнь проще. В этой статье мы покажем, как создавать и использовать шорткоды, а также покажем примеры готовых шорткодов, которые заметно повысят твой блоггерский опыт.
Этот пост является переводом статьи Mastering WordPress Shortcodes[smashingmagazine.com]
Что такое шорткоды(shortcode)?

Использовать шорткоды очень просто. Что бы это сделать, создай новый пост(или открой для редактирования уже имеющийся), переключи редактор на HTML режим и введи шорткод в квадратных скобках, типа этого:
[showcase]
Так же с шорткодами есть возможность использовать атрибуты. Тогда они будут выглядеть так:
[showcase id="5"]
Шорткоды также позволяют встраивать контент:
[url href="http://www.smashingmagazine.com"]Smashing Magazine[/url]
Шорткоды управляются набором функций, введённых в WordPress 2.5 и называемых Shortcode API. Когда пост сохранён, его содержание парсится и Shortcode API автоматически трансформирует шорткоды для исполнения возложенной на них функции.
Создание простого шорткода
Шорткоды очень просто создать. Если ты знаешь, как написать простую Php-функцию, то ты уже знаешь, как создать WordPress шорткод. Для начала давай создадим известное сообщение «Привет, мир»
- Открой файл functions.php твоей темы. Если его нет, то создай.
- Первое, мы должны создать функцию для вывода строки «Привет, мир». Вставь следующий код в твой файл functions.php:
function hello() { return 'Привет, мир!'; }
- Теперь у нас есть функция, мы должны превратить её в шорткод. Это очень просто сделать, благодаря функции add_shortcode(). Вставь эту строку после нашей функции hello(), потом сохрани и закрой файл functions.php:
add_shortcode('hw', 'hello');
Первый параметр это имя шорткода, а второй это имя функции.
- Теперь, когда шорткод создан, мы можем использовать его в постах и на страницах. Для этого просто переключись в HTML режим и введи следующее:
[hw]
Вот и всё! Конечно, это очень простой шорткод, но это хороший пример того, насколько просто их создавать.
Создание продвинутых шорткодов
Как упоминалось, шорткоды могут быть использованы с атрибутами, которые очень полезны. В этом примере мы покажем тебе, как создать шорткод для вывода URL, точно так же, как ты это делал с BBCode на форумах вроде VBulletin и PHPBB.
- Открой твой файл functions.php. Вставь в него следующую функцию:
function myUrl($atts, $content = null) { extract(shortcode_atts(array( "href" => 'http://' ), $atts)); return '<a href="'.$href.'">'.$content.'</a>'; }
- Теперь преобразуем функцию в шорткод:
add_shortcode("url", "myUrl");
- Шорткод создан. Ты можешь использовать его в постах и на страницах примерно так:
[url href="http://www.vverx.com"]Вверх_ком, настройка WordPress[/url]
Когда ты сохранишь пост, шорткод выведет ссылку озаглавленную «Вверх_ком, настройка WordPress» и ведущую на http://www.vverx.com.
Classic.dachi.ru – строительство загородных дач.
Объяснение кода. Для правильной работы, функции нашего шорткода необходимо обращаться с двумя параметрами: $atts и $content. $atts(attribute(s)) это шорткод-атрибут. В этом примере атрибут называется href и содержит ссылку на URL. $content это содержание шорткода, встроенное между доменом и поддиректорией(т.е. между “www.example.com” и “/subdirectory”). Как ты можешь убедиться в коде мы дали $content и $atts значения по-умолчанию.
Теперь мы знаем, как создать и использовать шорткоды, давай заценим несколько готовых к использованию шорткодов!
Примеры кода на PHP и JavaScript
1. Шорткод Отправить в твиттер

Цель. Выводить ссылку для отправки поста в твиттер.
Этот шорткод просто создать. Вставь следующий код в файл functions.php твоей темы:
function twitt() { return '<div id="twitit"><a href="http://twitter.com/home?status=Currently reading '.get_permalink($post->ID).'" title="Кликни и отправь этот пост в твиттер!" target="_blank">Отправить в твиттер</a></div>'; } add_shortcode('twitter', 'twitt');
Чтобы его использовать, просто переключись в HTML-режим и введи:
[twitter]
И ссылка Отправить в твиттер появится там где ты оставил шорткод.
Глянь также плагин Twitter tools[alexking.org]
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 в любом месте твоего поста или страницы, создай шорткод:
- Открой файл functions.php твоей темы и вставь следующий код. Не забудь заменить код JavaScript своим собственным кодом AdSense!
function showads() { return '<div id="adsense"><script type="text/javascript"><!-- google_ad_client = "pub-8683604175367491"; /* 468x60, создано 05.02.09 */ google_ad_slot = "5183274352"; 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');
- Сохранив изменения в 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, это количество постов для вывода.
Бери посты из базы данных 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(). После этого картинка возвращается, встроенной в содержание поста.
Добавление шорткодов в виджеты боковой колонки
Даже если тебе понравилась эта статья, ты возможно останешся немного не доволен, потому что по-умолчанию WordPress не позволяет вставлять шорткоды в виджеты боковой колонки. К счастью есть маленький трюк, повышающий функциональность WordPress и позволяющий использовать шорткоды в виджетах боковой колонки.
Ещё немного кода для вставки в файл functions.php:
add_filter('widget_text', 'do_shortcode');
Это всё, что тебе нужно.
Объяснение кода. То, что мы сделали, довольно просто: мы добавили фильтр к функции widget_text(), что бы выполнить функцию do_shortcode(), которая использует API для исполнения шорткодов. Таким образом шорткоды теперь включены в виджетах боковой колонки.
Луший софт для рассылки и рекламы, с искуственным интеллектом!
февраля 6, 2009 в 01:16
Интересно и полезно, спасибо.
Попробую себе тоже в ближайшее время сделать.
Вопрос: а можно вставлять не в пост, а в код темы ?
февраля 6, 2009 в 02:18
wow, интересная и полезнейшая статья, я о таком даже и не знал. спасибо. расширил скилл работы с WP, а статья в закладки ушла
февраля 6, 2009 в 13:28
WordPress 2.5-получается что он облегчает работу во-много раз ! Эта версия стоит внимания !
февраля 7, 2009 в 11:37
Не знал такой фичи. Попробую на днях сделать при помощи этого строчку подписки на рсс в конце поста.
февраля 7, 2009 в 18:49
Наконец-то дождался перевода. Большое спасибо за статью
февраля 7, 2009 в 19:39
Хм, ниче себе..надо срочно обновляться
февраля 7, 2009 в 21:55
Прикольные коды. Обязательно попробую. Спасибо )))
февраля 8, 2009 в 11:05
Радуeт, что блог постоянно развиваeтся. Такой пост только прибавляeт популярности.
февраля 8, 2009 в 12:43
Интерсная тема, спасибо, нужно будет поробывать шорткоды в действии
февраля 10, 2009 в 10:03
Оппа, не знал, что есть такая фича. Спасибо.
февраля 11, 2009 в 23:10
Я так понимаю многие плагины, например [gallery] это и есть короткие коды?
февраля 11, 2009 в 23:48
Left, в коде темы шорткоды кажется не работают. Но вы проверьте, предварительно забэкапившись, конечно.
AlexPTS, походу да.
февраля 13, 2009 в 03:50
Штука конечно хорошая, но понастраивать надо будет конечно не один час (((
февраля 13, 2009 в 19:05
Спасибо за статью, обязательно воспользуюсь!!!
февраля 13, 2009 в 22:01
инфа полезная, стоит применять
февраля 15, 2009 в 22:17
вещь хорошая, я уже опробывал
февраля 17, 2009 в 04:04
Не знаю даже..я в эти коды лезть боюсь )))
февраля 19, 2009 в 03:52
а на джумле есть такая фича ? Просто нереально переносить на ВП весь сайт
февраля 21, 2009 в 13:09
Большое Спасибо!
февраля 24, 2009 в 16:19
Спасибо, только увлекся Твиттером, а тут уже код. Обязательно поставлю.
марта 3, 2009 в 14:00
WordPress лучший!!
марта 3, 2009 в 14:01
Спасибо за информацию
марта 6, 2009 в 09:43
Вот это спасибо. Реальную помощь. Я вот собрался завести твиттер(в асе друзья все уши прожужжали), а тут вон ещё такая фича. Очень радует!
марта 8, 2009 в 06:15
спасибо, очень позновательно! Твиттер в прошлом
марта 8, 2009 в 14:23
Спасибо мне это помогло.
марта 9, 2009 в 16:57
Скеч, когда ты, наконец, порадуешь нас новыми постами? А то этот если мне не изменяет зрение датируется 6 февраля
марта 10, 2009 в 04:43
Vlad, мой процессор загружен на 100% с того времени на переводе нового мега-поста. Скоро будет.
марта 10, 2009 в 22:09
я конечно мало чего понял, но все же спасибо, постараюсь разобратся.
марта 11, 2009 в 00:59
Хм, и ведб действительно малоизвестная функции WP, у меня один из блогов на WP – веду его уже второй год, но никогда не знал, что можно упростить кодинг шаблона на столько.
марта 16, 2009 в 08:20
ЛУчше поставте на скачту
function sc_postimage!!!
марта 16, 2009 в 08:24
Так намного легче! спс!!!
марта 16, 2009 в 08:27
Хоть гдето нашол решение!!!!
марта 22, 2009 в 00:48
Решение оказалось совсем несложным. Спасибо!
марта 22, 2009 в 23:22
Раньше казалось, что всё гораздо сложнее, безумно благодарен!
марта 28, 2009 в 20:13
Впервые слышу о шорткодах. И вправду очень удобная вещь. В ближайшем будущем опробую некоторые «шорты» на своем блоге. Спасибо:)
марта 31, 2009 в 00:52
Спасибо автору за полезную информацию.
Иногда просто руки опускаются, даже не верится, что я когда-нибудь смогу овладеть хотя бы половиной полезной информации, необходимой для работы.
апреля 2, 2009 в 13:40
Актуальный материал.
апреля 5, 2009 в 23:53
Полезная статья, узнал кое-что нового. Пригодится!
апреля 6, 2009 в 16:12
Ну а что ? Хорошая статья!
апреля 15, 2009 в 00:03
«Что бы встроить AdSense в любом месте твоего поста или страницы, создай шорткод:» – Насколько я знаю, аддсенс запрещает модифицирование своего кода. Я бы не рискнул копировать ваш и вставлять свой номер.
апреля 17, 2009 в 13:07
Андрей, а я сделал как рекомендует автор, поменял на свой номер и всё работает, адсенс ничего не сказал!
апреля 18, 2009 в 06:03
Интересно, а этим шорткодом можно вывести целую страницу? Ну как цитату, то есть страница внутри другой страницы.
апреля 18, 2009 в 15:34
Использование шорткодов открывает широкие возможности, но нужно уделить много времени чтобы освоить.
апреля 19, 2009 в 17:25
Интересная статейка, надо бы попробовать эти шорткоды, но вот времени на них у меня уйдёт немерено. Когда читал статью понял, что мне их не осилить, но я попробую)))
апреля 24, 2009 в 04:48
Не обьял всё с первого раза, оставил в закладках. Спасибо за обзор. Буду вкуриваться ).
апреля 26, 2009 в 01:09
А шорткодами можно выводить баннер от popunder?
мая 2, 2009 в 17:05
Хоть здесь нашол ответ!!! Спасибо за обьяснение!!!
мая 11, 2009 в 18:01
Спасибо !!!!!!! Подробно и хорошо описано, то что надо !
. А то я уже замучался искать в нете нормальное объяснение
мая 20, 2009 в 16:47
Достойная статья, пошла в закладки
мая 20, 2009 в 16:48
Вот ты каков, северный олень шорткод
мая 20, 2009 в 16:50
Очень полезное обьяснение, спасибо
мая 25, 2009 в 16:07
Весьма познавательно, добавил в закладки. Спасибо!
мая 26, 2009 в 14:29
Статья интересная, жаль, что вы не обновляете больше блог(
мая 29, 2009 в 16:50
А я и не знал что такое есть
Спасибо автору
июня 3, 2009 в 13:18
Да, теперь мы все будем знать что такое есть=)
июня 5, 2009 в 11:15
Да не робот я, не робот… Простой спамер…
июня 5, 2009 в 16:00
Купить недорого детские товары
июня 5, 2009 в 17:32
Жесть а не термин..шоткорды какие то….Но название темы заставляет открыть пост
Не спамер=)
июня 7, 2009 в 11:35
А у меня почему то не получается с встройкой PSS потока… может я что то не так делаю? объясните еще раз подробней пожалуйста.
июня 12, 2009 в 23:05
спасибо за дополнительную информацию о word press
июня 13, 2009 в 13:17
Отличная вещь, но вот как с настройкой пойдет
июня 14, 2009 в 21:47
спасибо за статью, некоторые плагины поставил, но с установкой помучался, в некотором код дорабатывал.
июня 21, 2009 в 16:52
Спасибо умным головам за то что,облегчают жизнь создателям блогов,тема интересная надо попробовать у себя на блоге…
июня 21, 2009 в 17:01
Отличная тема. Спасибо. Я и не догадывался что такое можно делать. Теперь буду юзать
июня 21, 2009 в 18:23
Хм.. прикольная вещь, спасибо за статью)
июня 22, 2009 в 02:32
Да, прикольная фишка… А вот действительно мало кто о них знает, например я впервые слышу…. и ни разу не видел ни на одном форуме или блоге.
июня 22, 2009 в 13:34
Сделал все согласно Вашей подробнейшей инструкции и у меня все получилось,даже не ожидал от себя такой прыти.Описание довольно длинное,но на деле ничего сложного.
июня 23, 2009 в 18:31
Очень интересная статья. Завтра обязательно попробую все проделать.
июня 24, 2009 в 11:32
Спасибо за разжеванный материал, все замечательно написано и очень понятно как дважды два.
июня 24, 2009 в 15:42
Иногда сталкивался с шорткодами, когда ставил плагин для рейтинга постов.
Но не думал, что ими можно вставлять в пост вообще все. Спасибо за материал.
июня 26, 2009 в 16:34
Шорткоды – учень удобная вещь. Чем больше узнаю о Вордпрессе, тем больше хочу перейти на него.
июня 26, 2009 в 23:51
спасибо за статью, некоторые плагины поставил, но с установкой помучался, в некотором код дорабатывал.
июня 30, 2009 в 14:45
Знал что есть такая функция, но ни как не получалось разобраться. Очень грамотно написал всё. Огромное спасибо. Страницу сохранил на финт даже
Нет так страшен шорткод как его малюют
июля 1, 2009 в 01:21
Действительно классная функция. Нужно будет попробовать в действии, но только один вопрос: а сломать через самописный шорткод не смогут?
июля 1, 2009 в 16:18
Тоже про взлом подумал, кто знающий-просветите, может вообще стоит как то заблокировать данную функию?
июля 2, 2009 в 01:49
Спасибо огромное, новремени на это уйдёт уйма…
июля 2, 2009 в 01:52
Кстати, реально могут сломать… так что нужно искать меры предосторижения…
июля 10, 2009 в 10:14
Какая замечательная статья! Даже захотелось изучить PHP ради этих шорткодов. Огромное спасибо, страницу в закладки.
июля 14, 2009 в 17:33
а с Сапой можно такую тему проворачивать?
июля 17, 2009 в 05:10
Думаю и с сапом это прокатит
июля 18, 2009 в 00:43
Пойду учить пхп и ставить их…
июля 20, 2009 в 10:07
спасибо!!!!
июля 21, 2009 в 12:38
Прокатит с сапом, проверил на собственной шкуре
июля 25, 2009 в 10:56
Информация очень полезна, шоркоды это достаточно сложно
августа 13, 2009 в 10:34
Да интересная информация, Шоркоды – сложны, но полезны
августа 13, 2009 в 18:17
Некотрые плагины используют функцию шорткодов тот же адсенс мастер…
августа 17, 2009 в 12:57
Информация полезна, шоркоды это достаточно сложно, помог бы кто-нибуть мне разобраться
августа 19, 2009 в 11:08
Спасибо! Вы мне очень помогли
августа 28, 2009 в 11:51
БЛин пробовала с сапой не катит….(
сентября 4, 2009 в 19:27
Сложновато – минут 50 разбирался.
Правда что с сапой не работает?
сентября 14, 2009 в 14:53
Ну так с русской кодировкой проблема не решилась? Автор ответьте, пожалуйста, на почту!
сентября 15, 2009 в 12:39
я мало что понял. Может кто нибудь мне разжевать суть?
сентября 25, 2009 в 11:56
to Liza, начните с самых азов. Для начала в поиске наберите шорткоды для чайников… если конечно, вы не спамер…
сентября 28, 2009 в 20:01
ОГО!!! Да ту не один день разбираться и вникать)))
Спасибо Вам большое!!!
октября 7, 2009 в 14:37
нафига они ваше нужны если есть плагины
октября 7, 2009 в 19:14
Солидная инфа. За один вечер не перечитать!!!))))
октября 29, 2009 в 22:07
Прикольно. За вечер не перечитаю…
ноября 5, 2009 в 11:52
Полезные плагины.
ноября 5, 2009 в 17:53
Дорогой автор, а ответь мне пожалуйста, каким хуем мой e-mail попал в список рассылки?
ноября 15, 2009 в 00:09
Суперский пост! Блог уже в ридере )
ноября 15, 2009 в 14:15
можно неплохо подзаработать
у меня получается
http://partners.nicedrugs.ru/?wmid=215
января 12, 2010 в 23:20
Имхо шорткоды применимы только в очень редких случаях. Например, для того чтобы в постоянной странице выводить емаил и телефон, который может меняться. Больше применений я не вижу.
января 18, 2010 в 18:40
очень удобно, кста
спасибо
февраля 7, 2010 в 12:54
Спасибо, попробую
февраля 16, 2010 в 13:46
Да я тоже запомнил блог в закладки, очень полезные вещи даёт автор, респект