How to Add WPForms Shortcodes to PHP Templates
Would you like to add your WPForms shortcodes directly to your PHP template? There are many different ways to include your WPForms inside your pages an editor from WordPress. You can embed the form inside a post, page, or widget area on your site. However, did you know you can also add a small PHP snippet to have the shortcode run inside any of the PHP templates in your them? In this tutorial, we’ll show you the steps to use to include the shortcode inside a PHP template.
Creating the form
First, you’ll need to create your form and add the fields you wish to have. Our form will have some basic fields to collect our initial contact information for our newsletter.
If you need help in creating your form, please see this documentation.
Adding the shortcode to a PHP template
It’s very important to note that we never recommend making any changes to any of your theme files without the use of a child theme. If you’d like to learn more about creating a child theme, please see this article from our friends at WPBeginner.
For more information on how to add code to any template file in your theme, please review this documentation.
Since we want our newsletter to appear at the bottom of every page on our site automatically, we’re going to use a child theme and edit the footer.php inside our child theme.
Just before the closing content div of the footer, we’re going to add this code.
Just be sure to update the id=”25″ with the form ID number you want to include in the template. If you need any help in how to locate your form ID number, please check out this tutorial.
Now when you load each page of your site, you’ll see the form at the bottom of every page.
As we mentioned, this is just one way. If your theme offers a footer widget, it’s much easier to just add your WPForms shortcode directly to the widget and there’s no need for coding edits or changes using this method.
And that’s all you need! Would you also like to know how to display a shortcode inside an HTML Field inside your form? Take a look at our article on How to Display Shortcodes Inside the HTML Field.
Как вставить шорткод в шаблон WordPress
Работа с сайтами WordPressСкрипты для сайтов на WordPressУчебник по WordPress
Разработчики WordPress включили поддержку шорткодов в версии 5.7 – это значительно упростило вставку различных функций плагинов в шаблоне. Он представляет собой короткий текст, помещенный в квадратные скобки. При этом нет необходимости вставлять сложный PHP, засоряя записи и страницы.
Шорткод – что это?
Его можно охарактеризовать следующим образом – короткий код для внедрения какой-либо функции в выбранном месте сайта. Состоит из легко запоминающегося текста. Он скрывает отображение длинного кода, записанного в PHP-файле, что упрощает работу для новичков и малоопытных вебмастеров. Для профессионалов shortcode позволяют экономить время на заранее разработанных функциях.
С их помощью можно выводить текст, оформлять контент, добавлять видео, слайды, изображения, графики и другие элементы. Такие плагины, как Nextgen Gallery, Visual Composer, Contact Form 7 используют шорткоды для размещения блоков и контента.
Регистрируется несколькими способами:
- создание функции в WordPress и определение шорткода для нее в functons.php;
- применение специального плагина;
- регистрация shortcode без использования расширений.
Известно, что большое количество дополнительных модулей и приложений подтормаживает работу ресурса, поэтому рассмотрим наиболее оптимизированный вариант. Следует зайти в functions.php, находящийся в корневой папке текущей темы и открыть его через текстовый редактор Notepad++. После чего можно вставить шорткод в тему WordPress. Регистрация осуществляется следующим образом:
| add_shortcode(‘short_code’, ‘function_name’); |
- add_shortcode – регистрация шорткода в WordPress;
- shortcode – название (используется для выведения последующей функции на сайте);
- function_name – название регистрируемой функции.
На примере видно, как можно организовать регистрацию рекламного блока AdSense:
<!– Код вывода рекламного блока –>
<script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>
<ins style=”display:block” data-ad-client=”ca-pub-9542020662080512″
(adsbygoogle = window.adsbygoogle || []).push(<>);
<!– конец вывода рекламного блока –>
Сделать шорткод WordPress достаточно просто, что увеличивает производительность работы с контентом. После вставки shortcode, в указанном месте будет отображена реклама Google. Теперь необязательно использовать плагины или устанавливать громоздкий код в статьи или другие места сайта.
Следующий пример позволяет сократить время добавления атрибута nofollow к ссылкам на внешний ресурс. В обычной ситуации процесс происходит так: переключение в режим HTML, поиск ссылки, добавление тегов. Использование shortcode не требует переключения режимов – достаточно работать в визуальном редакторе. Регистрация:
Для скрытия URL, следует обернуть его в зарегистрированные теги:
| [nf] Внешняя ссылка [/nf] |
Подключение стиля к контенту:
border: 1px solid #d2d2d2;
margin: 5px 10px;
Добавив текст в теги, фоновая часть заполняется желтым цветом:
| [yb] Участок текста [/yb] |
Названия указываются на свое усмотрение – чем короче, тем проще запоминать и вписывать.
Часто используемые shortcode можно добавить в панель инструментов редактора. Вставить шорткод в страницу WordPress также легко, как в запись. Все действия выполняются через визуальный редактор.
Как вставить шорткод в шаблон WordPress
Ситуация с квадратными скобками не работает с файлами темы, применяется специальная функция «do_shortcode»:
| <?php echo do_shortcode ( ‘[short_code]’ ) ; ?> |
Текст в квадратных скобках – название требуемого шорткода. Также, данная конструкция работает с виджетами.
Плагины для работы с shortcode
Система имеет по умолчанию несколько видов шорктодов, способных незначительно расширить стандартные функции:
- работа с галереями;
- вывод статистики блога;
- скрытие части текста;
- вставка аудио/видео;
- интеграция контента с YouTube;
- вывод похожих записей;
- настройки автоформатирования.
Для пользователей, не разбирающихся в PHP, желающих качественно и производительно работать – существуют плагины с набором всех необходимых функций.
Shortcodes Ultimate
Лучшее решение для работы с шорткодами в мире
Перейти
Мировой лидер по коллекции элементов для расширения возможностей и визуальной составляющей при помощи шорткодов. Расширение предполагает внедрение кодов в посты, страницы и файлы темы. С его помощью можно создать слайдеры, кнопки, блоки, видео-вставки, карусели. В визуальном редакторе добавляется отдельная кнопка, открывающая меню плагина.
- 50 предустановленных шаблонов шорткодов;
- редактор пользовательских CSS;
- доступен предпросмотр;
- поддерживается всеми темами, имеет адаптивный дизайн;
- переведен на 9 языков;
- подробная инструкция по использованию.
Обладателям премиальной версии предлагаются дополнительные элементы – 15 штук, 60 скинов и возможность создавать пользовательские шорткоды. Все это можно приобрести по отдельности либо вместе. Скачано более 700 000 копий, средняя оценка вебмастеров – 5 звезд. Версия со всеми аддонами обойдется в 59 долларов для одного сайта.
Column Shortcodes
Перейти
Отличный вариант для создания столбцов, достаточно вставить шорткод в страницу WordPress с необходимыми параметрами. В панели управления можно выбрать 10 колонок, каждая из которых отличается по ширине. Доступно редактирование отступов и подключение собственных стилей. Скачано более 100 000 копий, оценка пользователей – 4,5 из 5. На странице расширения размещена подробная инструкция и ответы на часто задаваемые вопросы.
WP Shortcode by MyThemeShop
Перейти
Интересное решение, в особенности для тех вебмастеров, которые часто меняют темы или их настройки. Все функции сохраняются даже при смене шаблона. Доступно около 24 шорткодов для создания кнопок, блоков, ценовых таблиц, переключателей. После установки, в редакторе записей/страниц появляется кнопка добавления shortcode. Во всплывающем окне имеется строка выбора и некоторые параметры. Настройка легкая и не требует особых навыков.
- вкладки;
- визуальное оформление;
- кнопки;
- ценовые таблицы;
- карты;
- переключатели.
Распространяется на бесплатной основе, скачано более 70 000 раз. Оценка пользователей – 4,5 балла.
Bootstrap Shortcodes
Перейти
Плагин поможет сделать шорткод WordPress вебмастерам, использующим темы с включенной библиотекой bootstrap 3. Предлагается внушительный список функций. Основные доступные элементы:
- таблицы, сетки, коды, изображения;
- метки, значки, медиа-объекты, дополнительные панели;
- прогресс-бары, вкладки, подсказки, слайдеры и карусели.
Бесплатное расширение скачано более 50 000 раз, оценка вебмастеров – 5 из 5. Русский язык недоступен.
Shortcake
Плагин не позволяет вставить шорткод в тему WordPress, но отлично справляется с их добавлением в записи и страницы. Рекомендован для новичков, поскольку имеет простой интерфейс, не требует здания кода и включает обучающие материалы. Благодаря функции импорт/экспорт возможен обмен шорткодами с другими сайтами.
Основные возможности:
- добавление медиа-контента;
- социальные кнопки;
- ценовые таблицы;
- оформление текста.
Распространяется на бесплатной основе. Скачан порядка 20 000 раз и оценен пользователями в 4 балла.
Заключение
Вставить шорткод в WordPress можно при помощи легкой функции, предварительно зарегистрировав его. С виджетами ситуации аналогичная. При добавлении shortcode в записи и страницы вовсе не возникает сложностей – вставляются в нужном месте в визуальном редакторе. Для расширения возможностей и производительности можно применить рассмотренные плагины.
Создание и применение шорткодов в WordPress
На этом уроке мы с вами узнаем о создании шорткодов в WordPress, а так же рассмотрим примеры их применения. Шорткод [shortcode] – дословный перевод «короткий код».
Где применяют шорткоды?
Существует масса вариантов применения шорткодов на WordPress, которая ограничивается лишь вашей фантазией.
Например, с помощью шорткода очень удобно вставлять рекламные блоки и партнерские ссылки в статьи
Оформлять в разном стиле статьи определенной тематики. Вы пишите в свой авторский блог на разные темы, так вот, для каждой темы можно использовать разное стилевое оформление.
Можно добавлять к постам ссылку для пожертвований PayPal.
Вставлять в тело поста Google map, видео с YouTube и другие мультимедийные материалы.
Суть в том, что вы хотите быстро вставить в определенные посты повторяющийся кусок кода и если потребуется, так же легко его заменить.
Как создать свой шорткод в WordPress
Алгоритм создания следующий. Пишется некая функция, как правило в файле function.php или в специально созданном файле под шорткоды. Дается короткое и осмысленное название этой функции и далее мы ее вызываем в определенном месте поста, прописав это короткое название в квадратных скобках – [название_функции].
Давайте создадим шорткод для рекламного блока, это может быть реклама Google Adsense или любая другая. Вся фишка в том, что если вы захотите сменить рекламодателя, вам не надо открывать каждый пост и править там код. Вы открываете файл с созданной вами функцией и заменяете только там рекламный код. Автоматически ваш код заменится во всех постах, где вставлен шорткод с названием этой функции.
А теперь давайте перейдем к практике и рассмотрим конкретный пример создания шорткода в WordPress.
В файле function.php внутри тегов <?php.. ?>. пропишем функцию add_shortcode
add_shortcode ('etsy', 'FuncEtsy'); /* добавить шорткод */
Данная функция содержит в себе 2 связанных между собой параметра с произвольными названиями. Первый параметр 'etsy' – это название функций, которое используется для вызова самого кода. Второй параметр 'FuncEtsy' – функция, которая должна срабатывать при ее вызове. В посте, в нужном нам месте просто вставляем — [etsy] и там появится рекламный блок. WordPress заменит квадратные скобки с названием на рекламу.
Но прежде давайте опишем эту функцию. В файл function.php добавим код:
Итого код целиком для файла function.php:
В файл стилей добавляем такой код:
/* Рекламный блок */
.etsy <
width:250px;
height:250px;
background:url(images/etsy.jpg); /* путь к баннеру */
>
Внизу, под статьей появился рекламный баннер:
Как не потерять добавленный код?
Если вы вносите изменения в файлы вашей текущей темы, то не меняйте ее на другую тему и не обновляйте. Иначе весь ваш добавленный код пропадет. Понимаю, что это плохой совет. Ведь можно забыться и случайно обновить тему. Существует несколько вариантов решения этой проблемы:
Использовать дочернюю тему и все изменения делать в ней.
Сохранять этот код в созданный кастомный плагин, независимо от темы, не правя function.php.
Воспользоваться готовым бесплатным плагином Code Snippets для добавления кода.
Кому нужны свои шорткоды?
Всем, кто использует на блоге бесплатную тему (большинство премиум тем имеют наборы встроенных шорткодов) и не хочет ставить очередной Shortcode плагин. Тем, кому функционала готовых плагинов с шорткодами или тех наборов из премиум тем недостаточно.
Плагин Shortcodes Ultimates
Shortcodes Ultimates – плагин для вставки шорткодов в записи и страницы WordPress. Если уж вам совсем лень вникать в создание своих шорткодов, то рекомендую вам данный плагин. Пользоваться им очень просто и удобно. Этот плагин включает в себя массу шорткодов на все случаи жизни.
Плагин Shortcodes Ultimates позволяет красиво оформить статью. Почувствуйте разницу. Верхний скриншот – статья без всякого оформления. На нижнем скриншоте – статья оформленная с помощью шорткодов плагина Shortcodes Ultimates.
Шорткод wordpress, как вывести свою программу на страницу сайта
Научно выражаясь — это простейшая функция для микрокодов, которую можно использовать как в редакторе WordPress, так и в виджетах, и в файлах шаблона.
А по простому — это маленький php код, в который можно «засунуть» любой html элемент, вставить всё это в файл functions.php, а затем с помощью совсем маленькой метки, выводить этот элемент в любой части контента.
Мало того. Этому html элементу, можно задать class, и в файле style.css сделать любое внешнее оформление.
Можно каждую статью какой либо рубрики, начинать логотипчиком этой рубрики, и не грузить для этого текст лишней картинкой.
Достаточно будет один раз вставить её в функцию шорткода, а затем в начале каждой статьи рубрики, ставить соответствующую метку, и WordPres динамически подгрузит туда эту картинку.
Можно для каждой рубрики написать отдельное меню, вставить его в код, а затем поставить метки только в статьях нужной рубрики.
Вот эти метки и имеют название «шорткод».
Теперь давайте смотреть, как это чудо выглядит, и как работает.
Вот и весь основной код. Разберём по косточкам.
В первой строке — пользовательская функция. Пользовательская — это значит, что название ей Вы придумываете самостоятельно.
Подробнее про то как даются названия, и вообще про функции php можно почитать в статье Функции php.
Во второй строке, в одиночных кавычках, вставляется то, что Вы хотите выводить на страницах сайта.
У меня там просто слово Привет, но вместо него, как я уже говорил, можно вставить любой html элемент. Ну например бегущую строку:
В третьей строке, в скобках, в первых одиночных кавычках, указывается имя шорткода, который Вы будете вставлять в контент, а во вторых — имя функции, которая будет этот шорткод выводить.
Сам же он выглядит так:
Имя у него может быть любым, не обязательно именно shortcod. Желательно, чтоб это имя отображало то, что данный шорткод выводит.
Ведь когда таких кодов будет несколько, можно и запутаться, который для чего. Да и название функции лучше давать такое, чтоб было понятно, что она выводит.
В функцию можно прописать и сразу несколько html элементов. Например меню одним тегом не сделаешь.
Оформить это меню можно в файле style.css, так как тегам ul и li заданы классы. Но можно прописать стили прямо в теле функции, добавив туда тег style.
Код меню я представил не полностью, чтоб не занимать место в статье, только для примера, чтоб понять как работает шорткод, что и является целью этой статьи.
Конечно же в стили нужно обязательно добавить позиционирование, так как шорткод будет вставлен в текст в редакторе, а меню должно быть где-то сбоку от текста.
Это были примеры того, как можно применять шорткод с пользовательскими функциями.
Теперь несколько примеров со встроенными php функциями. Напомню, что встроенная — это функция уже имеющаяся в языке php, и решающая определённую задачу.
Скрываем часть контента от незарегистрированных пользователей
В файл functions.php, в самый конец вставляется следующий код:
Закрываемый текст оборачивается в конструкцию
Функция member_check_shortcode проверяет регистрацию посетителя Вашего сайта, и в зависимости от этого скрывает или нет выделенный фрагмент контента.
Что и для чего нужно скрывать, я думаю всем понятно. Типичное увеличение подписной базы. А вот для чего нужно следующее действие?
Показываем часть контента только незарегистрированным пользователям
Соответственно шорткод будет выглядеть так:
Подумали для чего это нужно? Правильно, чтоб не мозолить глаза зарегистрированных пользователей формой подписки.