Как легко добавить шорткод в WordPress

Опубликовано: 2024-02-05

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

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

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

Итак, без лишних слов, давайте начнем.

Оглавление

  1. Понимание коротких кодов
  2. Зачем использовать шорткоды в WordPress?
  3. Методы добавления шорткода в WordPress
    • Добавьте шорткод с помощью редактора блоков (Гутенберг)
    • Добавьте шорткод с помощью классического редактора
    • Добавьте шорткод в виджет WordPress
    • Добавьте шорткод в файлы темы WordPress
  4. Как создать свой собственный шорткод в WordPress
  5. Часто задаваемые вопросы
  6. Заключение

1. Понимание коротких кодов

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

Эти короткие коды заключаются в квадратные скобки. Например, если вы настроили локальное SEO с помощью плагина Rank Math SEO, вам нужно будет использовать шорткод для отображения информации о вашей компании, который будет выглядеть следующим образом:

 [rank_math_contact_info]

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

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

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

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

2 Зачем использовать шорткоды в WordPress?

Есть несколько причин, по которым вы можете захотеть добавить шорткод на свой сайт WordPress:

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

3 метода добавления шорткода в WordPress

Теперь давайте обсудим способы добавления шорткодов на ваш сайт WordPress.

3.1 Добавьте шорткод с помощью редактора блоков (Гутенберг)

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

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

Добавьте шорткод в Гутенберге

Как только блок шорткода будет добавлен, вы увидите поле для ввода шорткода. Введите желаемый короткий код, включая все необходимые параметры в коротком коде, если это необходимо.

Добавьте свой шорткод

После этого опубликуйте или обновите свою страницу или публикацию, чтобы шорткод появился на вашем веб-сайте.

3.2 Добавление шорткода с помощью классического редактора

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

Добавить шорткод в классическом редакторе

После этого нажмите кнопку «Опубликовать/Обновить» , чтобы сохранить изменения.

3.3 Добавьте шорткод в виджет WordPress

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

Для начала перейдите в «Внешний вид» → «Виджеты» на панели управления WordPress. Затем найдите область виджетов, куда вы хотите вставить шорткод.

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

Добавьте шорткод в область виджетов

После добавления блока шорткода вы можете вставить нужный шорткод в эту область.

Добавить шорткод

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

3.4 Добавление шорткода в файлы темы WordPress

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

Для этого откройте файл темы, в которую вы собираетесь добавить короткий код, например page.php, single.php, или файл пользовательского шаблона, и используйте функцию do_shortcode , предоставляемую WordPress.

Просто передайте короткий код в качестве параметра этой функции, и она отобразит соответствующий вывод.

Например, если у вас есть короткий код под названием [your_shortcode] , вы можете добавить его в файл темы следующим образом:

<?php echo do_shortcode("[your_shortcode]"); ?>

Добавить шорткод в файл темы

После добавления шорткода не забудьте сохранить изменения.

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

4. Как создать свой собственный шорткод в WordPress

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

Если вам знаком PHP, используйте следующий код шаблона.

 // Define a custom shortcode function function custom_shortcode() { // Define the desired functionality $message = 'This is my custom shortcode!'; // Return the output return $message; } // Register the shortcode add_shortcode('my_shortcode', 'custom_shortcode');

В этом примере мы создаем короткий код [my_shortcode] , который будет отображать текст «Это мой собственный короткий код!» на вашем сайте.

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

После выполнения необходимых действий вы можете вставлять шорткод в свои записи, страницы и виджеты с помощью кода:

 [my_shortcode]

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

5 часто задаваемых вопросов

Могу ли я использовать одно и то же имя короткого кода в нескольких функциях?

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

В чем разница между короткими кодами и блоками Гутенберга?

Шорткоды — это устаревший метод добавления динамического контента в WordPress с использованием простой системы тегов, такой как [my_shortcode]. С другой стороны, блоки Гутенберга представляют собой более современный подход, предлагающий визуальный редактор и блочную структуру.

Являются ли шорткоды единственным способом добавления динамического контента в WordPress?

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

6. Заключение

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

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

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

Кроме того, важно протестировать ваши шорткоды, чтобы убедиться, что они работают правильно и остаются совместимыми с вашей темой и плагинами WordPress.

Если вам понравился этот пост, сообщите нам об этом в Твиттере @rankmathseo.