Skip to content

Все для WordPress, веб-розробки — і не тільки

🔧 WordPress: як вивести віджет шорткодом у будь-яке місце сайту

🔧 WordPress: як вивести віджет шорткодом у будь-яке місце сайту

Вам потрібна форма підписки не в сайдбарі, а прямо посеред посту. Або віджет каталогу WooCommerce на сторінці, де сайдбару взагалі немає. Заходите в адмінку, шукаєте блок, а WordPress каже: віджети живуть лише в зареєстрованих областях теми. Усе.

Обмеження архітектурне: система віджетів прив’язана до sidebar-1, footer-widgets та інших зон, прописаних у темі. Контент запису для неї, чужа територія. Обійти можна, але стандартного способу «вставити віджет сюди» в ядрі немає.

Шорткод для віджета вирішує проблему одним рядком. Без створення окремої області, без дочірньої теми та без правки шаблонів. Нижче, як це працює у 2026 році: готовий плагін, усі параметри та нативна PHP-альтернатива для розробників.

💡 Швидкий огляд:

  • Встановіть WP Anywhere Widgets, плагін генерує шорткод для будь-якого зареєстрованого віджета.
  • Вставте шорткод у пост, сторінку, сайдбар або PHP-шаблон теми.
  • Налаштуйте заголовок, HTML-обгортку та CSS-класи через параметри шорткоду.
  • Для проєктів без сторонніх плагінів використовуйте нативну функцію the_widget().

WordPress не дає вивести віджет усередині контенту запису штатними засобами. Система віджетів працює лише в межах зареєстрованих областей теми, а все, що за їхніми межами, для неї не існує.

На практиці потреба виникає у трьох сценаріях:

  • Форма підписки в довгому гайді. Сайдбар поїхав угору під час скролу, читач форму не бачить. Шорткод тримає CTA прямо в тілі посту, перед очима.

  • Віджет WooCommerce на кастомній сторінці. Сторінку зверстано без сайдбару, а фільтри товарів або пошук ([woocommerce_product_search]) мають бути саме тут.

  • Динамічний блок «Схожі записи» у шаблоні single.php. Тема не передбачила область перед коментарями. Шорткод, викликаний із functions.php, ставить віджет куди завгодно без торкання шаблонів.

Раніше задачу закривав плагін Widget Shortcode, простий інструмент, що генерував [widget id="text-1"] для будь-якого зареєстрованого віджета. У січні 2023 його закрили через неусунуту вразливість. Прямий спадкоємець, WP Anywhere Widgets.

WP Anywhere Widgets: генератор шорткодів для будь-якого віджета

WP Anywhere Widgets перейняв ту саму ідею, але пішов далі. Він не лише віддає шорткод для наявних віджетів, а й дозволяє створювати власні прямо в адмінці, без прив’язки до сайдбару. Підтримує і класичний редактор віджетів, і блоки Gutenberg.

Сторінка шорткодів усіх віджетів у WP Anywhere Widgets

Встановлення стандартне: Plugins → Add New → пошук «WP Anywhere Widgets» → Install → Activate. Після активації в меню Appearance з’являється пункт Widget Shortcodes, зведена таблиця всіх створених віджетів та їхніх шорткодів. Кнопка «Copy» поруч із кожним.

Плагін працює з WordPress 3.3 і вище, протестовано до версії 6.8.5. На червень 2026 року, 700+ активних встановлень і рейтинг 4.8 із 5 на WordPress.org. Останнє оновлення (v4.0) додало повну підтримку блоків Gutenberg та окрему адмін-сторінку для керування шорткодами.

🔗 WP Anywhere Widgets на WordPress.org

Як згенерувати шорткод віджета

Будь-який зареєстрований у системі віджет отримує унікальний ID: text-1, calendar-3 або block-7. WP Anywhere Widgets показує цей ID в інтерфейсі й одразу видає готовий шорткод:

Генерація шорткоду віджета в адмінці WordPress

Базовий синтаксис:

1[widget id="text-1"]

Вставте його в будь-який пост, сторінку або текстовий блок. Плагін підставить HTML віджета цілком: заголовок, тіло, обгортку з CSS-класами теми. Додаткове налаштування не потрібне.

Вставка шорткоду в запис і в редактор Gutenberg

У класичному редакторі шорткод вставляється прямо в текст, так само, як [gallery] або [contact-form-7]:

Вставка шорткоду віджета в тіло запису WordPress

У блочному редакторі, через блок Shortcode. Додаєте блок, вставляєте [widget id="text-1"], і WordPress рендерить віджет у візуальному редакторі:

Шорткод віджета в блочному редакторі Gutenberg

Якщо віджет містить JavaScript, наприклад, карту або форму, в редакторі він не виконається. Це обмеження безпеки Gutenberg. На фронтенді все працює штатно.

Параметри шорткоду: заголовок, обгортка та CSS-класи

Шорткод приймає кілька опціональних параметрів, які змінюють HTML-вивід без жодного рядка коду:

Інтерфейс налаштування параметрів шорткоду віджета

title, перевизначення заголовка. Типово віджет показує той заголовок, який задано в його налаштуваннях. Параметр title замінює його на льоту:

1[widget id="text-1" title="Новый заголовок"]

Щоб повністю приховати заголовок, передайте title="0". Віджет відрендериться без <h2> або <h3> над тілом.

container_tag, HTML-тег обгортки. Типово віджет загортається в <div>. Замініть на <section>, <aside> або будь-який інший семантичний тег:

1[widget id="text-1" container_tag="aside"]

container_class, додатковий CSS-клас. До стандартного класу widget додається ваш. Стане в пригоді для кастомної стилізації конкретного екземпляра:

1[widget id="text-1" container_class="my-custom-widget"]

container_id, HTML-атрибут id. Типово WordPress генерує ID автоматично. Параметр фіксує значення, для якірних посилань і JavaScript-таргетингу:

1[widget id="text-1" container_id="subscribe-widget"]

title_tag** і title_class, керування заголовком.** Змінюють тег заголовка з <h2> (типово) на <h3>, <h4> і додають кастомний клас:

1[widget id="text-1" title_tag="h3" title_class="widget-title-large"]

Усі параметри комбінуються в одному шорткоді. Порядок не важливий, синтаксис стандартний: param="value".

PHP-спосіб: функція the_widget() для розробників

Коли плагін не потрібен, WordPress дає нативну функцію the_widget(). Вона виводить будь-який зареєстрований віджет напряму з PHP, у темі, дочірній темі або сніпеті Code Snippets.

Базовий виклик:

1the_widget( 'WP_Widget_Text', array(
2 'title' => 'Форма подписки',
3 'text' => '[mailpoet_form id="1"]',
4 'filter' => true,
5) );

Перший аргумент, PHP-клас віджета. Другий, масив налаштувань, збігається з тим, що віджет зберігає в wp_options. Третій, масив аргументів обгортки:

1the_widget( 'WP_Widget_Text',
2 array( 'title' => 'Подписка', 'text' => '[shortcode]' ),
3 array(
4 'before_widget' => '<section class="widget %2$s">',
5 'after_widget' => '</section>',
6 'before_title' => '<h3 class="widget-title">',
7 'after_title' => '</h3>',
8 )
9);

Підхід не залежить від сторонніх плагінів і не ламається під час оновлень WordPress. Мінус: потрібно знати PHP-клас кожного віджета. Стандартні класи ядра:

  • WP_Widget_Text
  • WP_Widget_Calendar
  • WP_Widget_Search
  • WP_Widget_Categories

Клас плагіна шукайте у вихідниках або через var_dump( $wp_widget_factory->widgets ).

Код вставляється у functions.php активної теми, краще дочірньої, або через плагін Code Snippets. Перед правкою functions.php зробіть бекап файлу: синтаксична помилка в PHP покладе весь сайт.

⁉️🤔 Часті питання

Чи працює шорткод віджета з кешувальними плагінами?

Так, шорткод обробляється сервером на етапі рендерингу сторінки, до того як HTML потрапляє в кеш. WP Rocket, W3 Total Cache і LiteSpeed Cache зберігають уже зібрану сторінку з готовим віджетом. Для динамічних даних, як-от кошик WooCommerce чи курси валют, використовуйте ESI-блоки, щоб виключити конкретний фрагмент із кешу. Функція the_widget() у зв’язці з DOING_AJAX дає повний контроль над тим, що кешується, а що ні.

Чи обов’язково віджету бути в активному сайдбарі?

Ні, віджет не зобов’язаний перебувати в активному сайдбарі. Достатньо, щоб він був зареєстрований у WordPress і доданий у будь-який сайдбар, зокрема неактивний (Inactive Widgets). WP Anywhere Widgets створює віджети у власному внутрішньому реєстрі, який узагалі не прив’язаний до областей теми.

Скільки віджетів можна вивести шорткодом на одній сторінці?

Обмежень за кількістю немає. Кожен виклик [widget] або the_widget() створює незалежний екземпляр. Продуктивність упирається лише в складність самих віджетів: десять текстових блоків або форм підписки відпрацюють миттєво, а десять віджетів із зовнішніми API-запитами додадуть по 200-300 мс на кожен. Для API-важких віджетів кешуйте результати через transient усередині the_widget().

Що робити, якщо плагін віджета видалили, а його шорткод залишився в постах?

Шорткод без активного обробника виводиться як звичайний текст, відвідувачі побачать [widget id="text-1"] прямо на сторінці. Перед видаленням плагіна-джерела перевірте всі пости через пошук в адмінці: Tools → Better Search Replace, або WP-CLI: wp search-replace '[widget id="text-1"]' '' --dry-run. Після масової заміни підчистіть порожні абзаци через базу окремо.

Чи можна використовувати шорткод віджета в меню навігації?

Меню WordPress не обробляє шорткоди штатним чином. Щоб вставити віджет у навігацію, використовуйте фільтр wp_nav_menu_items у functions.php із викликом do_shortcode('[widget id="..."]'), це додасть шорткод до, після або між конкретними пунктами меню. Альтернатива: кастомний Walker-клас, який парсить {widget}-плейсхолдер у назві пункту й замінює його на живий віджет.

Що обрати: плагін чи свій код

У більшості випадків WP Anywhere Widgets закриває задачу повністю. Поставили, скопіювали шорткод, вставили куди потрібно. Параметрів достатньо для кастомізації обгортки без жодного рядка CSS.

PHP-спосіб через the_widget() виправданий у двох ситуаціях: ви розробник і тримаєте курс на нуль сторонніх плагінів у проєкті, або вам потрібна особлива логіка, наприклад, різні віджети для авторизованих і гостьових користувачів. В іншому, беріть плагін і не ускладнюйте.

Якщо ваша мета, вбудувати саме форму підписки в середину посту, придивіться до поштових плагінів із нативною підтримкою шорткодів: MailPoet, Newsletter, Brevo. Кожен із них дає готовий [form]-шорткод із контролем позиціювання, а WP Anywhere Widgets виступає універсальним прошарком для всього іншого.

Наочна демонстрація від каналу WebTutorials: повний цикл від встановлення плагіна до працюючого шорткоду на сторінці, швидко і без води.