Шорткоды на простых примерах.
Времена, когда иметь вебсайт было уделом «избранных», давно миновали. Сейчас любой желающий может заиметь свой сайт, созданный, например, на системе WordPress. Для этого достаточно использовать бесплатную тему оформления, которых существует множество. Понятно, что сайт на бесплатной теме будет выглядеть несколько попроще, чем сайт, созданный профессиональными веб-студиями…Для изменения внешнего вида сайта, записей и страниц необходимо знание языков программирования php, html, таблиц стилей css и еще бог знает чего…
Что делать владельцам сайтов, желающим немного разнообразить записи и публикации на своих сайтах, но, при этом, не владеющими языками программирования? Ответ-использовать разнообразные плагины, содержащие шорткоды.
Шорткод (Shortcode) – это короткий программный код, который позволяет выполнить работу какой-либо функции WordPress в месте его вставки. Причем, шорткоды вставляются прямо в текст статьи или заметки. Пользователю при этом вовсе не обязательно знать языки программирования. Программисты позаботились о том , чтобы вам не пришлось ломать голову над всякими там css.
Я использую для этих целей плагины Shortcodes Ultimate и Page Builder by SiteOrigin.
Естественно, в сети полно статей на тему использования этих плагинов. Я просто поделюсь, как использую их я…
Про плагин Page Builder by SiteOrigin будет отдельная статья.
Поговорим о плагине Shortcodes Ultimate и примерах его использования.
Плагин Shortcodes Ultimate содержит в своем составе больше 50 шорткодов, как говорится, на все случаи жизни…
Вот так, например, в текст статьи можно вставить кнопку:
Та же кнопка, но включен режим «резиновая» для растягивания на всю ширину текста:
В кнопках настраиваются стили, цвета текста и фона, имеется возможность выбора иконки ( в данном случае-двойная стрелочка слева от надписи), адрес ссылки также выбирается на усмотрение пользователя.
Вот так создается галерея изображений при помощи шорткода «Галерея«:
Здесь также можно настроить размер изображения, действие при клике по изображению ( полноразмерный вид, переход на соответствующую статью сайта и т. д.)
Столь же просто вставляются в текст статьи ролики с Ютьюб при помощи соответствующего шорткода:
Шорткод Слайдер создает вот такую скользящую галерею из изображений:
Шорткод Заголовок вставляет в текст статьи заголовки вида:
Шорткод Разделитель вставляет в произвольное место статьи разделитель с обеспечением возможности перехода на начало статьи:
Шорткод «Развернуть» формирует блок текста, который можно развернуть/свернуть. Причем, иконки (стрелочки) можно выбрать из галереи в несколько десятков штук:
Шорткод «Выделитель» выделяет цветом часть текста. Цвет текста и фона настраивается пользователем:
Текст (от лат. textus «ткань; сплетение, связь, сочетание») — зафиксированная на каком-либо материальном носителе человеческая мысль; в общем плане связная и полная последовательность символов.
Есть даже шорткод «Google карта«, вставляющий Гугл-карту:
Шорткод «Колонки» позволяет сформировать несколько независимых колонок для вывода текста. В данном случае сформированы три колонки по 1/3 ширины текстового поля каждая:
А в этом примере сформированы три колонки с размерами 1/4, 1/2 и 1/4 ширины соответственно:
….. Продолжение следует……