Главная
Wordpress
Как сделать шорткоды для WordPress
  • 08 Апр 2015г
  • 1698
  • 8
  • Рубрика: Wordpress

Как сделать шорткоды для WordPress

Шорткоды WordPress

Доброго времени суток. 🙂

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

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

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

Как и со всеми функциями, добавление осуществляется в файл functions.php, в самый его конец, но перед закрывающим тегом ?>. Назовем функцию text_short. Внутри нее добавим нужный текст, который потом выведем вызовом.

function text_short() {
return 'Любой нужный текст. который нужно выводить внутри текста Вашей записи.';
}

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

add_shortcode('ts', 'text_short');

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

function text_short() {
return 'Любой нужный текст. который нужно выводить внутри текста Вашей записи.';
}
add_shortcode('ts', 'text_short');

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

[ts]

Вот так все просто.

  1. Создаем функцию
  2. Делаем ее шорткодом
  3. Вызываем внутри записи

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

function reklama() {
return '
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:inline-block;width:728px;height:90px"
     data-ad-client="ca-pub-ххххххххххххх"
     data-ad-slot="хххххххххххх"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>';
}
 add_shortcode('rek_sh', 'reklama');

И шорткод

 
[rek_sh]

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

Создаем шорткод

function gb_bgrnd($attr,$content= null){
return'
<style type="text/css">
.redbg{
	background-color: #f00;
    padding:3px 5px;}
</style>
<span class="redbg">'.$content.'</span>';
}
add_shortcode('gbb_sh', 'gb_bgrnd');

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

[gbb_sh]текст что будет выделяться[/gbb_sh]

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

function gb_twit() {
return '
<style type="text/css">
a.bttn{
background: #00B1F4;
padding: 5px 10px;
font-size: 13px;
font-weight: bold;
color: #fff;
text-align:center;
cursor: pointer;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
a.bttn:hover,a.bttn:active {
background: #f30;
}
</style>
<a class="bttn"title="Поделиться в Твиттере" href="http://twitter.com/home?status=Интересная статья '.get_permalink($post->ID).'">Твитнуть</a>';
}
add_shortcode('twit', 'gb_twit')

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

[twit]

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

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

add_filter('widget_text', 'do_shortcode');

Как вывести шорткод в любом месте темы WordPress

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

<?php echo do_shortcode('[Название шорткода]');?>

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

<!--название шорткода-->

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

<?php echo apply_filters('the_content', "<!--название шорткода-->"); ?>

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

Используете ли Вы шорткоды у себя на сайте?

На этом все, спасибо за внимание. 🙂




Если Вам был полезным мой труд, можете поддержать сайт, обменяться со мной текстовыми ссылками или посмотреть рекламку, что займет 2 минуты :)


Оцените статью
  1. 5
  2. 4
  3. 3
  4. 2
  5. 1
(16 голосов, в среднем: 5 из 5)

Опубликовано 8 комментариев

  • Gorkiy
    Комментариев: 1

    За способ с рекламой спасибо. Давно хотел вставлять внутри текста, да все руки не доходили поискать как это сделать. 5 звезд от меня 🙂

  • Artur
    Комментариев: 1

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

    • Виталий
      Комментариев: 267

      А как поехать на машине, не садясь в нее? 🙂 Если руки неправильно расположены, любая информация мусор. Чтобы вывести свой собственный шорткод в любой части темы, нужно по-любому его прописать в function.php, а потом вызвать
      <?php echo do_shortcode('[Название шорткода]');?>
      Как это показано в статье 🙂

  • Pavel
    Комментариев: 1

    есть плагин слайдера http://petromi.com/get/f2i59s69219a508a1e11 в нем не работает шорткод.. мне нужно чтобыы аудиоплеер (определенный) был в слайдере..

    • Виталий
      Комментариев: 267

      Возможно нужно вставлять не напрямую шорткод, как для записи, а в таком:
      <?php echo do_shortcode('[Название шорткода]');?>

  • Андрей
    Комментариев: 1

    Виталий, большое спасибо, за ваш совет!

    Именно прописывание данной строчки в файле functions.php

    позволило вывести шорткод в рубрике.

  • Андрей
    Комментариев: 2

    Здравствуйте, Виталий! Подскажите, пожалуйста, как использовать такую конструкцию. Смысл в том, что я хочу делать в некоторых статьях метку о дате обновления. Да не выходит... Пытался править и так и сяк, но - либо ошибка синтаксиса php, либо дата не выводится.

    ';
    }
    add_shortcode('mod', 'moddata');
    ?>

    Благодарю!

    • Андрей
      Комментариев: 2

      <?php
      function moddata() {
      return'
      <div class="moddata">Редакция от <?php
      $u_time = get_the_time(U);
      $u_modified_time = get_the_modified_time(U);
      if ($u_modified_time != $u_time) the_modified_time(d.m.Y, H:i);
      ?></div>';
      }
      add_shortcode('mod', 'moddata');
      ?>

      Извините, код поломался в предыдущем комментарии...

Добавить комментарий

Заполните поля ниже. Ваш e-mail не будет опубликован. Обязательные поля помечены *

Уважаемые пользователи! При добавлении комментариев на сайт Вам следует соблюдать правила указанные под формой отправки комментариев.

Соблюдайте добавления комментариев

Это не спам *

Нажмите, чтобы добавить код в комментарий