Содержание

Полезные шорткоды WordPress и WooCommerce

Что такое шорткод (shortcode)?

Шорткоды (shortcode) — это функции PHP, которые можно задействовать внутри содержимого поста, для выведется какого-то контента. Шорткод заключается в квадратные скобки.

Шорткод можно применить в любом месте Вашего сайта.

Как создать шорткод в WordPress?

Создать шорткод в WordPress можно двумя способами:

Вставка шорткода в любой части сайта do_shortcode

Бывает нужно вывести ту или иную информацию через шорткод, например, в хедере, футере или иной части сайта, которые невозможно редактировать как страницу, запись или виджет.

Для этого в WordPress используется специальная функция do_shortcode. Ее применение выглядит так:

<?php echo do_shortcode("[шорткод]"); ?>

Шорткод 1: Вывод значения текущего года

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

В файле functions.php, обычно в самом низу, дописываем код:

function show_current_year(){
	return date('Y');
}
add_shortcode('show_current_year', 'show_current_year');

Теперь, вставив в тексте (или заголовке) поста шорткод [show_current_year], мы получим значение текущего года.

Шорткод 2: Контентные шорткоды

В предыдущем примере выше показано как создавать «Одиночные» (self-closing) шорткоды: [name]. Но кроме них есть еще «Контентные» (enclosing) шорткоды: [name]Контент[/name]. Зарегистрированный шорткод всегда можно использовать как Одиночный или Контентный.

Для Enclosing шорткода функция-обработчик получит второй параметр содержащей контент. При регистрации шорткода желательно всегда указывать значение по умолчанию для второго параметра $content.

function my_shortcode( $atts, $content )

Создадим контекстный шоркода, который будет обрабатывать 1 атрибут и информацию заключенный межу тегами шрткода (то есть переменную $content)

add_shortcode('ulr_out', 'ulr_out');
 
function ulr_out( $atts, $content ) {
 
$atts = shortcode_atts( [
		'name' => 'Fb',
	], $atts );
 
$name = $atts["name"];
 
	return '<a href="'.$content.'">' . $name . '</a>';
}

Вызовем полученный шорткод

[ulr_out name="Хостинг в Украине"]https://dieg.info/tsod/ukraine/[/ulr_out]

Список шорткодов в WooCommerce

[recent_products per_page="4" columns="4"]
[product id="13"]
[products ids="13,27"] или [products skus="product1,product2"].
[product_attribute per_page="4" columns="4" attribute="tsod" filter="ukraine,singapore"]

Шорткод gallery позволяет вам легко вставлять и настраивать галереи изображений без необходимости использовать плагины или писать сложный код.

Предположим, у вас есть блог о путешествиях, и вы хотите создать галерею изображений из последнего путешествия. Вы загрузили фотографии и хотите отобразить их в галерее из трех столбцов. Шорткод будет выглядеть так: [gallery columns="3"]. Этот код автоматически создаст галерею с изображениями, которые вы загрузили на эту конкретную страницу или запись, организованными в три столбца.

Пример использования шорткода [gallery]:

  1. Базовый Шорткод: Просто вставьте [gallery] в ваш пост или страницу. Это автоматически создаст галерею со всеми изображениями, которые были загружены на эту страницу или пост.
  2. С ID изображений: Вы можете указать конкретные изображения, используя их ID. Например, [gallery ids="123,234,345"], где числа - это ID изображений, которые вы хотите включить.
  3. Настройка столбцов: Чтобы контролировать количество столбцов в галерее, используйте атрибут columns. Например, [gallery columns="3"] создаст галерею с тремя изображениями в ряд.
  4. Указание размера изображения: Вы можете выбрать размер изображения для галереи, используя атрибут size. Например, [gallery size="medium"].
  5. Включение или исключение изображений: Чтобы включить или исключить определенные изображения, используйте атрибуты include или exclude. Например, [gallery include="789,890"] или [gallery exclude="456,567"].
  6. Случайный порядок изображений: Для отображения изображений в случайном порядке, используйте [gallery orderby="rand"].