Полное руководство: как добавить шорткоды в WordPress

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

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

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

Преимущества шорткодов

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

Как использовать шорткоды в WordPress

Чтобы использовать шорткод, просто вставьте его на страницу или запись WordPress.

Шорткод выглядит примерно так — [Shortcode-name],

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

Вот еще один пример синтаксиса шорткода с использованием гипотетического объекта шорткода «shortcode_ex».

[shortcode_ex] Здесь отображается ваш контент[/shortcode_ex]

WordPress поставляется со следующими шорткодами по умолчанию:

Видео шорткоды

• [dailymotion] встраивает видео DailyMotion.
• [hulu] встраивает видео Hulu.
• [ted] встраивает видео TED Talks.
• [vimeo] встраивает видео Vimeo
• [youtube] встраивает видео YouTube.

Аудио

• [аудио] отображает загруженный аудиофайл как аудиоплеер
• [spotify] встраивает музыку из Spotify.

Изображения и документы

• вставляет галерею изображений в запись или на страницу.
• [instagram] встраивает изображение из Instagram.
• [slideshare] встраивает слайд-шоу из Slideshare.net.
• [слайд-шоу] встраивает слайд-шоу из загруженных фотографий.
• [googleapps] встраивает документ из Документов Google.

Разнообразный

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

• [blog_subscription_form] включает форму подписки, позволяющую людям подписываться на обновления по электронной почте.

В сегодняшней статье мы обсудим, как легко добавить шорткоды на ваш сайт WordPress с помощью плагина Shortcodes Ultimate. Итак, начнем.

Окончательный плагин шорткодов

Плагины для коротких кодов позволяют нам легко и гибко создавать короткие коды без программирования. Он содержит набор предварительно определенных шорткодов, которые вы можете скопировать и вставить на свою страницу/публикацию. На рынке доступно множество плагинов для шорткодов. В этой статье речь пойдет о плагине Shortcodes Ultimate от Владимира Анохина.

Shortcodes Ultimate — популярный плагин WordPress, который можно использовать для создания вкладок, кнопок, блоков, адаптивных видео и многого другого. Он поставляется с более чем 50 потрясающими шорткодами, а также генератором шорткодов для создания пользовательских шорткодов.

Чтобы использовать плагин, просто установите его и нажмите кнопку «Шорткоды» на своей странице/публикации. Его можно интегрировать с надстройками премиум-класса для дальнейшего расширения его функциональности.

Этот плагин очень популярен в сообществе WordPress, о чем свидетельствует тот факт, что он имеет более 700 000 активных установок и почти 4000 5-звездочных рейтингов.

Ключевые особенности плагина Shortcodes Ultimate

• 50+ профессионально выглядящих шорткодов
• Полностью отзывчивый
• Выделите текст, окно отображения, изображения, карты Google и т. д.
• Пользовательский редактор CSS
• Вставка шорткода в 1 клик с предварительным просмотром в реальном времени
• Поддержка RTL и хорошая работа с многоязычными источниками
• Мощный API

Установка коротких кодов Ultimate

Установка плагина проста и включает в себя несколько шагов, описанных ниже.

• Войдите в панель администратора WordPress.
• Нажмите « Плагины » в меню левой боковой панели.
• Нажмите кнопку « Добавить новый » в разделе « Плагины» .
• Появится новое окно, введите « Shortcodes Ultimate » в меню поиска в верхнем левом углу окна и нажмите Enter.
• Появится список плагинов. Отсюда выберите плагин и нажмите кнопку «Установить сейчас».

После завершения установки нажмите Активировать

После активации вы будете перенаправлены на страницу плагинов , где вы сможете найти плагин Shortcodes Ultimate вместе с другими. Вот и все, теперь вы готовы использовать плагин и создавать шорткоды на своем сайте WordPress.

Изучение шорткодов Ultimate

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

Аккордеоны, спойлеры, стили и якоря — это позволяет нам добавлять такие вещи, как аккордеоны и якоря. Аккордеоны используются, если вы хотите скрыть некоторый контент за знаком «+» , который расширяется, чтобы показать ваш контент при нажатии. Также доступно несколько различных стилей и значков, которые можно добавить на передний план.

Вкладки и якоря вкладок

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

Макет столбца

Этот шорткод можно использовать, чтобы разбить содержимое нашей страницы на несколько столбцов.

Медиа-элементы

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

Анимации

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

Помимо основных шорткодов, есть также несколько других расширенных шорткодов.

Создание шорткодов с помощью плагина Shortcodes Ultimate

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

Чтобы добавить шорткод на свою страницу, перейдите в панель администратора, затем нажмите «Страницы», а затем выберите страницу, на которую вы хотите добавить шорткод.

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

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

Сделав свой выбор, вы можете либо настроить этот элемент, чтобы изменить его внешний вид, либо просто вставить его так, как он есть.

Теперь нажмите кнопку «Вставить шорткод», чтобы вставить его на свою страницу/публикацию.

Вот и все, ваш шорткод теперь вставлен на вашу страницу/публикацию.

Вот так будет выглядеть кнопка

Шорткод для разделения содержимого нашей страницы на несколько столбцов

Перейдите на панель инструментов, а затем на страницы. Создайте новую страницу или выберите существующую и нажмите «Вставить шорткод» , как указано выше.

В примере мы собираемся разделить содержимое с помощью столбцов. Однако столбцы находятся внутри строк. Итак, мы начнем с добавления шорткода Rows, щелкнув опцию «Row».

Отобразится диалоговое окно «Добавить строку». Поскольку мы хотим создать макет из 3 столбцов, мы не будем вносить никаких изменений и нажмем « Установить шорткод».

Теперь шорткод строки должен быть вставлен в ваш пост. Вставьте содержимое между [su_row] и [/su_row].

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

Поместите курсор в начало шорткода строки и снова нажмите кнопку « Вставить шорткод» и выберите « Столбец » из вариантов шорткода.

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

Шорткод теперь будет отображаться в вашем редакторе сообщений.

Вы можете добавить больше столбцов, повторив описанные выше шаги или просто скопировав существующие шорткоды.

Наконец, заполните пробелы между шорткодами своим содержимым. Когда вы закончите, нажмите кнопку «Обновить/Опубликовать», чтобы завершить процесс.

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