22 июня

Строим шорткоды WordPress

минут чтения

3  комментариев

Всем добрый день, друзья! На связи снова Денис Чернятинский. Мы с вами движемся к новому потоку информации по wordpress. Сегодня рассмотрим интересную и очень нужную тему: построение шорткодов WordPress.

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

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

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

shortcodes ultimate

Shortcodes Ultimate — это мега-плагин, содержит большой пакет шорткодов различной направленности. Это в действительности премиум плагин, дающий богатый функционал своему пользователю абсолютно бесплатно.

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

шорткоды wordpress функции

Оличительные особеености плагина:

  • Генератор шорткодов
  • Более 50+ удивительных шорткодов
  • Современный адаптивный дизайн
  • Сила CSS3
  • Персональный CSS редактор с подсветкой синтаксиса
  • Специальный виджет
  • Богатый API

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

Итак, приступим к установке плагина. Заходим в административную часть своего блога в раздел «плагины», нажимаем «добавить новый», ищем по названию нужный нам плагин, нажимаем «установить» и «активировать».

установка shortcodes ultimate

активация shortcodes ultimate

После активации плагина слева в основном меню админки появится раздел «Шорткоды» с несколькими подразделами:

  • Настройки
  • Примеры
  • Шпаргалка
  • Дополнения

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

Подраздел «настройки»

В настройках вы увидите несколько вкладок:

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

Вкладка «настройки» включают несколько пунктов:

настройки shortcodes ultimate

  • Специальное форматирование — в случае возникновения проблем совместимости с другими плагинами, можно отключить это значение.
  • Пропускать значения по умолчанию — вы получите более короткий шорткод без атрибутов.
  • Префикс шорткодов — этот префикс будет присвоен всем шорткодам плагина, например, введите в это поле ru_ и вы получите код следующего вида [ru_button].
  • Скин — это тема оформления для шорткодов. По умолчанию доступна только одна тема оформления.

Вкладка «произвольный CSS» — позволяет просматривать и редактировать оригинальные css стили, чтобы изменить их под себя. Все это делается прямо в настройках «произвольный css».

css shortcodes ultimate

Подраздел «примеры»

В подразделе «примеры» вы увидите основные и дополнительные примеры использования шорткодов в простой и наглядной форме. По нажатии на каждый пример в модальном окне вам представят визуальные возможности каждого шорткода.

шорткоды wordpress примеры

Подраздел «шпаргалка»

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

шпаргалка shortcodes ultimate

Подраздел «дополнения»

Дополнения Shortcodes Ultimate — это платные решения, дающие новые возможности вашим шорткодам, такие как, новые скины оформления, новые шорткоды, возможность создания своих шорткодов. Их можно приобрести как по отдельности, так и все разом с большой скидкой.

дополнения shortcodes ultimate

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

Мысль статьи

мысль Платон

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


Теги

плагины, шорткоды


Об авторе

У меня есть огромная уверенность в том, что каждый человек может реализовать себя с помощью современных интернет технологий, зарабатывать на этом, развивая и внедряя свои проекты. Реализация себя в том или ином направлении не требует большого времени. Вся необходимая информация уже существует, нужно только знать, что и как использовать для конкретных задач. Я окажу вам помощь в этом!

Denis Chernyatinsky

Вам также может понравиться

Как я осуществил перенос сайта на другой хостинг
Кэширование изображений WordPress в 1 клик
  • Евгений:

    Здравствуйте! такая проблемка с шорткодами. Пытаюсь вставить секцию со своим фоном. В нее вставляю строку с колонками(2 шт). Затем пытаюсь в каждую колонку вставить по секции уже со своим другим фоном, но что-то все едет…пытался задать коду section префикс типа section_inner, но не помогает. Может посоветуете?

    • Плагин по умолчанию не поддерживает такие многоуровневые вставки шорткодов друг в друга. Для ваших целей прекрасно подойдет расширение: Visual Composer. С его помощью можно конструировать простые и сложные страницы на WordPress.

  • квезаль:

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

  • {"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
    >