Что такое шорткод для чего они нужны
Создание шорткодов в WordPress CMS
Что такое шорткоды
Начиная с версии 2.5, разработчики WordPress ввели понятие «Shortcodes API». Этот функционал позволяет создавать и использовать макрокоды в страницах сайта или в записях блога. Например, простая и короткая запись добавит на странице целую фотогалерею.
Более подробно прочитать о шорткодах и узнать, как создавать простые шорткоды, вы можете из документации WordPress.
Подготовка почвы
Прежде чем начать создавать что-либо, предлагаю свой вариант размещения файлов:
Практически в каждом руководстве предлагают создавать шорткоды прямо в файле functions.php. Скажу сразу: я — противник такого подхода. Вместо этого настоятельно рекомендую вынести все шорткоды в отдельный файл (includes/shortcodes.php) и подключить его в functions.php одной строкой. Это значительно разгрузит functions.php и сделает код более читабельным.
Заметка: WordPress, конечно, поддерживает подключение файлов через require, но очень не рекомендует делать этого. Вместо этого предлагается использовать get_template_part().
Подключение скриптов
Многие начинающие разработчики очень часто совершают эту ошибку — подключают скрипты, необходимые для работы того или иного шорткода, сразу при объявлении шорткода. Т. е. скрипты загружаются всегда, даже если этого шорткода нет на странице.
Пример такой реализации:
Это полностью рабочий вариант, но скрипт будет загружаться на каждой странице, даже если он там не нужен (т. е. нет шорткода).
Во избежание таких ситуаций, предлагаю пользоваться следующим подходом:
Пример такой реализации:
В отличие от предыдущего варианта реализации, этот шорткод инициализируется, но все скрипты подгружаются только при наличии шорткода на странице.
Вложенные шорткоды
Есть еще пара проблем, с которыми могут столкнуться начинающие разработчики:
Теперь — более детально.
Создание многоуровневого шорткода
Проблема заключается в том, что такой шорткод состоит из нескольких более мелких шорткодов и необходимо предотвратить возможность использования их как отдельных шорткодов (кроме случаев, когда это необходимо).
Возьмем к примеру, шорткод, который создает прайсинг таблицу. Для этого необходимо подготовить три отдельных шоркода:
[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’ );
Для предотвращения использования внутренних шорткодов в качестве отдельных предлагается следующая схема:
Т. е. вывод кода на страницу происходит только во внешнем шорткоде, внутренние же просто возвращают полученные данные. Пример такой реализации приведен ниже.
Описание функции внешнего шорткода:
Описание функций внутренних шорткодов:
При этом подходе шорткод будет работать только в сборе, т. е. при правильном использовании, в других случаях ничего не будет выведено на экран (соответственно, ничего не сломается).
Конечно же, вы можете еще оптимизировать и усовершенствовать этот шорткод, но все же, думаю, основную идею продемонстрировать мне удалось.
Повторяющиеся шорткоды
Проблема заключается в следующем: нужно внутри шорткода использовать такой же шорткод. Наиболее частым примером в моей практике был шорткод для создания колонки. Т.е., к примеру, нужно реализовать разделение страницы на 2 части с помощью колонок и в первую колонку разделить еще на 2 колонки.
[column_half]
[column_half] Content [/column_half]
[column_half] Content [/column_half]
[/column_half]
[column_half] Content [/column_half]
К сожалению, для WordPress уже такая вложенность “не по зубам”. Верстка разлетится уже на втором контенте. Происходит это потому что при открытии шорткода WordPress сразу же ищет вторую (закрывающую) часть этого шорткода, т.е. в данном примере первая колонка будет закрыта на первом же вложенном шорткоде.
Для решения этой проблемы, к сожалению, нет других вариантов, нежели просто добавить новые шорткоды. Но, переписывать функции нет смысла, можно просто инициализировать шорткод на уже имеющиеся функции:
Заключение
В данной статье я рассмотрел наиболее частые проблемы, с которыми сам когда-либо сталкивался. Если же у вас есть что добавить, исправить, либо предложить свой вариант решения той или иной проблемы, не стесняйтесь писать в комментариях к этой статье.
Автор: Дмитрий Кабаков, Senior Front-end Developer.
Шорткоды в WordPress
Шорткод (шоткод, shortcode, короткий код) в WordPress — это конструкция в тексте, которая будет обработана и заменена на указанный код/текст. Обрабатывается шорткод специальной PHP функцией, указанной при регистрации шорткода.
Shortcode API — это набор простых функций, которые позволяют разработчикам тем и плагинов создавать свои шорткоды, которые затем можно использовать в контенте для вывода готовых блоков контента. Например, это может быть форма контактов.
Для примера, следующий Шорткод (в контенте записи) добавит фотогалерею:
| Шорткоды могут вызываться по-разному: | |
|---|---|
| [name] | «self-closing» Одиночный шорткод без параметров. |
| [name size=»medium»] | «self-closing» Одиночный с параметрами. |
| [name]текст[/name] | «enclosing» Контентный шорткод без параметров. Получает текст в качестве параметра. |
| [name size=»medium»]текст[/name] | «enclosing» Контентный шорткод с параметрами. |
Видео о шорткодах в WordPress:
Список шорткодов WordPress
В WordPress по умолчанию регистрируются следующие шорткоды:
Синтаксис шорткода
Само-закрытие (self-closing)
Шорткод можно закрыть слэшем в конце (такой слэш называется self-closing маркером).
Пробел перед маркером необязателен. Пробелы после маркера не допускаются. Такой маркер является чисто косметическим и ни на что не влияет.
Контентные шорткоды не могут использовать self-closing маркер.
Имя шорткода
Атрибуты шорткода
Атрибуты указывать не обязательно, между именем и атрибутами нужен как минимум один пробел. Если указывается несколько атрибутов, каждый атрибут должен быть разделен по крайней мере одним пробелом.
Каждый атрибут должен соответствовать одному из этих форматов:
Имя атрибута
Значение атрибута
Заметки по значению атрибута:
Кавычки атрибута. Двойные кавычки » допускаются внутри значений в одинарных кавычках ‘ и наоборот: [name foo=’1 «2» 3’ bar=»4 ‘5’ 6″]
Экранировать спец-символы в атрибутах можно через кодирование HTML символов (HTML encoding).
HTML символы и > поддерживаются в атрибутах ограничено. Например, этот шорткод не будет правильно работать, из-за символа > :
Версия 4.0 умеет проверять HTML, так что следующий код будет работать:
Чтобы полностью поддерживать HTML в атрибутах можно, сначала кодировать вводимые пользователем значения, а затем декодировать при обработке.
Удаляемые символы. Следующие символы, если они не экранированы, будут:
Экранирование
Экранирование нужно, когда шорткод зарегистрирован, но его не нужно обрабатывать, а нужно показать как есть. Не зарегистрированный шорткод и так не будет обрабатываться.
Для экранирования нужно обрамить шорткод еще одними квадратными кавычками:
Вложенные шорткоды
Парсинг шорткодов срабатывает один раз для контента. Это значит, что если в Контентном шорткоде есть вложенный шорткод, он не будет обработан:
Одинаковое название
Парсер не сможет обработать вложенные шорткоды с одинаковым названием, потому что уровень вложенности не подсчитывается. Такое ограничение сильно ускоряет обработку шорткодов:
Как это работает
На хуке the_content срабатывает функция do_shortcode(), которая ищет и обрабатывает все шорткоды в контенте.
То что вернула функция-обработчик заменят шорткод в контенте.
До срабатывания функции do_shortcode() (до парсинга шорткодов), контент обрабатывается тремя ключевыми функциями:
Создание шорткода
Для создания шорткода используется функция add_shortcode(). Она принимает два параметра: имя шорткода и название PHP функции, которая будет обрабатывать шорткод.
Вот самый простой PHP-код который регистрирует новый шорткод [foobar] :
Теперь [foobar] в контенте записи изменяться на строку: «Привет! Я шорткод.»
Атрибуты шорткода
Давайте добавим поддержку атрибутов шорткоду из примера выше. Для этого используем функцию shortcode_atts():
Теперь [foobar name=»Виктор» age=»25″] в контенте измениться на строку: «Меня зовут Виктор мне 25 лет».
shortcode_atts() определяет какие у шорткода могут быть атрибуты, задает им дефолтные значения и удаляет неопознанные атрибуты.
Ассоциативный массив который описывает возможные атрибуты шорткода (это ключи массива) и их дефолтные значения.
Неочищенный массив с данными, которые были указаны в шорткоде. Они будут сравниваться с массивом выше.
$atts будет содержать массив аргументов шорткода, которые были указанны пользователем.
Если указать значение без названия параметра, то они будут добавлены в индексные элементы массива. Например для шорткода [name value attr=»val2″ val3] получим:
Рассмотрим еще один пример.
Из кода видно, что приняли мы одни данные, а получили после обработки другие. Что изменилось?
Вывод функции обработчика
Возвращаемое значение функции обработчика шорткода вставляется в контент записи вместо самого шорткода.
Буфиризация вывода
Контентные шорткоды
Для Enclosing шорткода функция-обработчик получит второй параметр содержащей контент.
Теперь если написать шорткод так:
Получим такой результат:
$content передается в функцию без какой-либо очистки, поэтому в нём может быть HTML:
Иногда наоборот, когда HTML недопустим нужно очищать вывод, удаляя все HTML теги функцией wp_strip_all_tags().
Атрибуты в Контентном шорткоде
В Контентном шорткоде можно также как и в Одиночном, указать атрибуты. Например разрешим атрибут class :
Вложенные шорткоды
Если в Контентном шорткоде есть вложенный шорткод, он не будет обработан.
Поэтому если все же нужно нужно обработать шорткод внутри шорткода, то при обработке контента первого шорткода, нужно использовать функцию do_shortcode(), чтобы обработать вложенные шорткоды.
Удаление шорткода
Также в Shortcode API есть функция которая удаляет все зарегистрированные шорткоды разом: см. remove_all_shortcodes().
PHP Функции
| add_shortcode() | Добавляет новый шоткод и хук для него. |
| shortcode_atts() | Обрабатывает атрибуты (параметры) шорткода: добавляет значения по умолчанию когда нужно и удаляет неподходящие атрибуты. |
| remove_shortcode() | Удаляет зарегистрированный шорткод. |
| remove_all_shortcodes() | Удаляет все зарегистрированные шоткоды. |
| do_shortcode() | Находит в переданном тексте зарегистрированные шорткоды и обрабатывает их. |
| apply_shortcodes() | Алиас функции do_shortcode(). |
| has_shortcode() | Проверяет есть ли в переданном тексте указанный шоткод. |
| shortcode_exists() | Проверяет зарегистрирован ли указанный шоткод. |
| strip_shortcodes() | Удаляет/вырезает все шоткоды из переданного текста (контента). |
Заметки
wpautop
Шорткоды обрабатываются после того, как контент записи будет обработан функцией wpautop(). Поэтому, возвращаемая строка из функции-обработчика уже не будет обрабатываться этой функцией.
wpautop() распознает зарегистрированные шорткоды и не обрабатывает их (не добавляет p или br теги вокруг или внутри).
wptexturize
Шорткоды обрабатываются после того, как контент записи будет обработан функцией wptexturize(). Она обрабатывает незарегистрированные шорткоды как обычный текст, и заменяет в нем кавычки.
Чтобы этого не происходило шорткод можно обернуть в тег или
Или можно добавить шорткод в список не-текстурируемых шорткодов. Делается это через хук no_texturize_shortcodes.
Разные функции для одного шорткода
Если зарегистрировать два шорткода с одинаковыми названиями, но разными функциями-обработчиками, то применяться будет последняя функция. Т.е. сработает шорткод добавленный последним.
Одна функция для разных шорткодов
Смешанный вызов одного шорткода
Парсер не умеет обрабатывать смешанный вызов одно шорткода, когда он вызывается как Self-closed и Enclosing. Например:
Незарегистрированные шорткоды
Некоторые авторы плагинов не регистрируют шорткод, например, чтобы отключить вложенный шорткод до тех пор, пока не будет вызвана функция обработчика родительского шорткода. Это может привести к тому что шорткоды станут нерабочими. Например:
Незарегистрированные шорткоды будут считаться обычным текстом, который не имеет особого значения. Чтобы шорткод имел значение для wptexturize() его можно добавить в список через хук no_texturize_shortcodes:
Незакрытые шорткоды
В некоторых случаях анализатор шорткодов не может корректно работать с одним шорткодом, который используется как Одиночный и Контентный шорткод. Например в этом случае синтаксический анализатор будет правильно идентифицировать только второй экземпляр шорткода:
Однако так проанализирует оба:
Шорткод в атрибуте HTML тега
Начиная с версии 4.2.3 были наложены ограничения на использование шорткодов внутри HTML тегов. Например, следующий шорткод не будет работать корректно, поскольку он вложен в атрибут скрипта:
Обойти это можно создав шорткод, который выводит весь необходимый HTML, а не только одно значение.
20 шорткодов и плагинов WordPress, которые вы возможно захотите попробовать
Если коротко, то шорткод, как правило, используется для быстрого вызова длинного сценария или фрагмента кода. Несмотря на то, что WordPress имеет свой собственный набор шорткодов, которые можно использовать в записях и страницах вашего блога, кроме них существует большое количество шорткодов, которые предлагают почти безграничные возможности.
Шорткоды можно вставлять в тему блога вручную или через плагин. Проблема состоит только в том, чтобы найти среди огромного их количества именно тот, который подойдет вам.
Не волнуйтесь, в этой статье, мы представим 10 плагинов для WordPress, которые добавляют в ваш блог функциональный шорткод, а также 10 кодов, которые можно добавить самостоятельно.
Плагины WordPress
Вот некоторые из плагинов, которые позволяют применять или настраивать шорткоды WordPress. В соответствующих случаях предлагается альтернативный плагин, который делает почти то же самое.
1. Shortcode
[ postcountbr ] — отображает общее количество опубликованных в блоге записей;
[ catcountbr ] — отображает общее количество категорий, которые содержат одну или более запись;
[ tagcountbr ] — отображает общее количество тегов, которые содержатся в одной или более записи;
[ totalwords ] — отображает общее количество слов в опубликованных записях;
[ commentcount ] — отображает общее число одобренных комментариев;
[ PageCount ] — отображает общее количество опубликованных страниц.
2. WordPress Shortcodes
Этот плагин включает в себя более 20 шорткодов WordPress и простой редактор шорткодов.
Вы можете использовать его для добавления в свой блог таких крутых элементов, как:
Вы можете даже объединять несколько встроенных шорткодов, чтобы создавать такие уникальные элементы, как список кнопок или ссылок.
Другие варианты : Существует два аналогичных плагина 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. С его помощью вы можете установить определенные параметры для столбцов: такие как интервал, начало, конец и классы.
Этот плагин также поддерживает несколько других удобных шорткодов, в том числе:
8. ShortCodes UI
ShortCodes UI это еще один плагин для создания шорткодов, которые используют собственные кнопки TinyMCE и Quicktag. Вы можете легко вставлять шорткоды в ваши сообщения и страницы через визуальный и HTML редакторы.
Данный плагин отлично подходит для новичков, которые плохо знакомы с кодами, для них предназначены обучающие видеоуроки. Те, кто знает о кодах немного больше, вероятно, оценят цветовую разметку синтаксиса в редакторе кода.
Присутствует также функция импорта / экспорта, с помощью которой вы можете переместить ваши шорткоды с одного сайта на другой и даже поделиться с друзьями.
Другие варианты : My Shortcodes — это аналогичный плагин с красивым интерфейсом, который позволяет создавать собственные шорткоды.
В административной панели плагина, вы можете управлять, редактировать, включать / выключать, а также экспортировать элементы и шорткоды. Интерактивный просмотр позволяет увидеть, как выглядит ваш шорткод еще до его добавления в запись или на страницу.
9. Last Updated Shortcode
Это очень простой плагин, который позволяет добавить шорткод [ LastUpdated ] в ваши записи и страницы. Данная функция будет отображать дату и / или время последнего обновления.
Есть также опции для изменения формата отображения даты / времени.
10. Geoportail Shortcode
Данный плагин добавляет с помощью шорткода карту Geoportail в ваши сообщения и страницы. После этого вы можете задать размер карты, масштаб, местоположение (широту и долготу), размер (обычный, мини), территорию, слои и многое другое.
Карта поддерживает геотеги (которые можно подключить через плагин Геолокации ), чтобы в блоге отображалось место написания (публикации) ваших сообщений.
Плагин также включает в себя шорткод-билдер, для настройки шорткода карты, а также функцию предварительного просмотра, с помощью которой вы сможете просмотреть вашу карту, прежде чем публиковать ее.
Шорткоды
Существуют также простые шорткоды, которые можно использовать в блоге — без необходимости устанавливать их через плагин.
Для каждого шорткода мы предоставим вам:
Для некоторых шорткодов, возможно, потребуется дополнительная настройка (например, добавление вашего личного кода Google AdSense), так что некоторые знания о редактировании кодов вам все же понадобятся.
Другие шорткоды могут иметь дополнительные параметры, которые вы можете добавить: например, ширина и высота. Узнать больше вы можете кликнув ссылку для каждого шорткода.
Insert AdSense Ads
Вставляет блок объявления Google AdSense в том месте вашего контента, где вам нужно.
Show Related Posts
Выводит список похожих записей выше или ниже контента страницы.
Shortcodes — что это и как использовать?
Приветствую, уважаемые читатели wpnice. Сегодня поговорим о такой полезной функции в вашем блоге как шорткоды. А последующие две публикации я посвящу обзору двух самых популярных плагинов по использованию шорткодов. Первый плагин бесплатный — Shortcodes Ultimate. И еще один, платный — Styles with Shortcodes. Изначально хотел сразу приступить к обзору плагинов, но все таки, решил сначала сделать небольшую статью о том, что такое вообще шорткоды.
Что такое шорткоды [shortcodes]?
Говоря простым языком, это возможность превратить сложный PHP код для вывода какого то контента в код короткий, простой и понятный. Если вы знакомы с PHP, то легко сможете создавать шортсоды сами. По крайней мере, простые. В интернете можно найти немало туториалов на эту тему. Если же вы шарахаетесь от любого программирования как «черт от ладана», тогда можете использовать уже готовые плагины для быстрой вставки и использования шорткодов.
Что дают шорткоды?
Прежде всего, это возможность красиво, удобочитаемо, а иногда и более экономно выводить различный контент в ваших записях и страницах. Иметь великолепную премиум тему, это еще полдела. Пользователям будет вдвойне приятно, если ваши записи будут не просто сухими столбами текста с картинками, а еще и будут оформлены с использование различных шорткодов.
Шоркоды стали использоваться в WordPress c версии 2.5. Собственно говоря, многие привычные плагины именно тем и занимаются, что выводят необходимый пользователю контент именно в виде шорткодов. Например, плагин — Video Sidebar Widgets или всем известная галерея — Nextgen Gallery. Я уж не говорю о таком популярном плагине как Visual Composer.
Визуально шорткоды выглядят как правило, в виде текста заключенного квадратные скобки — [ shortcode ]. Их легко запомнить и достаточно просто вставить в контент вашей страницы, записи или даже в текстовый виджет в сайдбаре.
Ниже на вы можете посмотреть наиболее часто встречающиеся примеры использования шорткодов в текстах постов. Сделаны они с использованием инструментария уже входящего в состав премиум темы для моего сайта. Но точно такие же, можно использовать и установив соответствующие плагины со своими шорткодами, о которых я напишу чуть позднее.
Как их использовать?
Если вы используете специализированный плагин шоркодов для оформления страниц и записей, то почти всегда после его установки соответствующая кнопка появляется в редакторе. Нажимаете, выбираете нужный шорткод (может появится окно для дополнительного редактирования элементов) и вставляете его в нужное место страницы.