Урок по созданию короткого кода для wordpress
Короткие коды впервые появились в 2.5 версии движка wordpress и они с каждой новой версией набирают популярность. Сегодня мы создадим с вами несколько коротких кодов. Как известно короткие коды вызываются при помощи специальных тэгов и вашего названия. К примеру, вы хотите сделать кнопки разных цветов, чтобы ваши пользователи могли их легко создавать при помощи одной строки. И так вызов кнопки будет таким
![]()
Для того чтобы задать кнопке пару стилей необходимо вызвать её с атрибутами.
![]()
Или же вы хотите добавить туда свою фразу, то тогда необходимо вызвать кнопку следующим образом
![]()
Создадим простой короткий код, который позволит нам вставлять кнопку «Следуй за мной» в любом месте нашего поста. Для этого находим файл functions.php, который расположен по этому пути /wp-content/themes/ваша тема/ и открываем его в любом редакторе и вносим туда следующий код.
<?php
function button_shortcode() {
return '<a href="http://twitter.com/ellipsse" class="twitter-button">Следуй за мной в Twitter!</a>"';
}
add_shortcode('button', 'button_shortcode');
?>
Для того чтобы вызвать кнопку необходимо вставить код в любом месте поста в режиме HTML
![]()
Теперь создадим короткий код, в который мы будем передавать параметры, и который не будет иметь закрывающийся тэг. Всё в том же файле functions.php, мы пишем следующую функцию
<?php
function button_shortcode($type) {
extract(shortcode_atts(array(
'type' => 'type'
), $type));
// проверить какой тип кнопки выбрал пользователь при помощи простого switch
switch ($type) {
case 'twitter':
return '<a href="http://twitter.com/ellipsse" class="twitter-button">Следуй за мной в Twitter!</a>';
break;
case 'rss':
return '<a href="http://web-kladez.org/rss" class="rss-button">Подписаться на нашу рассылку!</a>'
break;
case 'vkontakte':
return '<a href="http://vkontakte.ru/ellipsse" class="vkontakte-button">Страница вконтакте!</a>'
break;
}
}
add_shortcode('button', 'button_shortcode');
?>
Теперь вы с лёгкостью можете передавать параметры при вызове кнопки, к примеру

А теперь создадим короткий код с закрывающимся тэгом. Прописываем следующую функцию
<?php
function button_shortcode( $attr, $content = null ) {
return '<a href="http://twitter.com/ellipsse" class="twitter-button">' . $content . '</a>';
}
add_shortcode('button', 'button_shortcode');
?>
Как видно из определения функции, мы передаём 2 параметра, первый это атрибуты, а второй текст, который вставим в нашу кнопку.
Вызвать кнопку можно следующим образом
![]()
Сделаем нашу кнопку более гибкой, позволив ей иметь параметры. Опишем функцию
<?php
function button_shortcode( $atts, $content = null ) {
extract( shortcode_atts( array(
'account' => 'account',
'style' => 'style'
), $atts ) );
return '<a href="http://twitter.com/' . esc_attr($account) . '" class="twitter-button ' . esc_attr($style) . '">' . $content . '</a>';
}
add_shortcode('button', 'button_shortcode');
?>
Теперь вы сами можете задавать ник для твиттера, а не привязывать к одному и тому же.
Для того чтобы активировать кнопки в виджете вы должны добавить следующий код в файл functions.php
add_filter('widget_text', 'do_shortcode')
А для того, чтобы использовать код в страницах шаблона используйте следующий вызов
do_shortcode("");
Вот парочка полезных коротких кодов, которые вы с лёгкостью можете использовать у себя на сайте, встроив их в файл functions.php
1. Добавить рекламный баннер размером 468 на 60 в любом месте вашей статьи.
functions.php
function showads() {
return '<script type="text/javascript"><!--
google_ad_client = "pub-3637220125174754";
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>
';
}
add_shortcode('adsense', 'showads');
Вызов короткого кода:
[adsense]
2.Добавить видео с YouTube.
functions.php
function youtube($atts) {
extract(shortcode_atts(array(
"value" => 'http://',
"width" => '475',
"height" => '350',
"name"=> 'movie',
"allowFullScreen" => 'true',
"allowScriptAccess"=>'always',
"controls"=> '1',
), $atts));
return '<object style="height: '.$height.'px; width: '.$width.'px"><param name="'.$name.'" value="'.$value.'"><param name="allowFullScreen" value="'.$allowFullScreen.'"><param name="allowScriptAccess" value="'.$allowScriptAccess.'"><embed src="'.$value.'" type="application/x-shockwave-flash" allowfullscreen="'.$allowFullScreen.'" allowScriptAccess="'.$allowScriptAccess.'" width="'.$width.'" height="'.$height.'"></object>';
}
add_shortcode("youtube", "youtube");
Вызов:
// Возможные атрибуты, который можно добавить при вызове: width, height, name, allowFullScreen, allowScriptAccess, controls
[youtube value="http://www.youtube.com/watch?v=1aBSPn2P9bg"]
3. Добавление кнопки PayPal «Вознаграждение» или «Поддержка» с возможностью вставки своего текста на кнопке.
functions.php
function donate_shortcode( $atts, $content = null) {
global $post;extract(shortcode_atts(array(
'account' => 'your-paypal-email-address',
'for' => $post->post_title,
'onHover' => '',
), $atts));
if(empty($content)) {
$content='Make A Donation';
}
return '<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_xclick&business='.$account.'&item_name=Donation for '.$for.'" title="'.$onHover.'">'.$content.'</a>';
}
add_shortcode('donate', 'donate_shortcode');
Вызов:
[donate] [donate]Помочь сайту[/donate] [donate account="you@yoursite.com" onHover="Спасибо" for="Название"] [donate account="you@yoursite.com" onHover="Спасибо" for="Название"]Помочь сайту[/donate]
4. Создание записей, которые могут видеть только авторы статей или админы.
functions.php
function sc_note( $atts, $content = null ) {
if ( current_user_can( 'publish_posts' ) )
return '<div class="note">'.$content.'</div>';
return '';
}
add_shortcode( 'note', 'sc_note' );
Вызов:
[note]Эта персональная запись, которую могут увидеть только админы[/note]
5.Если на вашем сайте часто встречаются отрывки кода, то этот короткий код позволит вам беспрепятственно вставлять его.
functions.php
function code_shortcode( $attr, $content = null ) {
$content = clean_pre($content); // Очистить тэги pre
return '<pre"><code>' .
str_replace('<', '<', $content) . // Escape < символы
'</code></pre>';
}
add_shortcode('code', 'code_shortcode');
Перевод урока Филлипа Стефенсона.
Ещё по теме:
- Как создать свой короткий код (shortcode)
- WordPress шаблон Trexen
- Как ограничить количество слов в заголовке
- Как сделать красивые кнопки только при помощи CSS3
- Как убрать верхнюю админ панель