Як додавати та використовувати віджети WordPress для налаштування вашого сайту

Що таке віджети та які види віджетів пропонує WordPress, ми розібрали у попередній статті. Далі розглянемо практичні питання щодо використання віджетів на сайтах WordPress.

Як знайти відповідний віджет для вашого сайту

Щоб знайти правильний віджет WordPress, дотримуйтесь цих порад:

1. Визначте точно, що вам потрібно від віджету. Які функціональні можливості він повинен мати і як ви хочете, щоб він виглядав? Чи потрібно посилатися на сторонні API?
2. Перевірте вбудовані віджети. Протестуйте їх, якщо ви знайдете відповідний, це чудово.
3. Перевірте каталог плагінів, до якого можна отримати доступ через Plugins> Add New. Спробуйте кілька ключових слів для пошуку. Шукайте з і без слова "віджет". Іноді плагін, який не орієнтований на віджети, включатиме віджет як частину ширшого набору функцій.
4. Якщо ви не можете знайти нічого, що підходить серед безкоштовних плагінів, шукайте преміум плагін. Попросіть інших користувачів WordPress дати рекомендації та перегляньте відгуки, перш ніж зробити вибір.

Хоч би який віджет ви вибрали, його потрібно перевірити, щоб переконатися, що він працює так, як ви хочете. Якщо ви купуєте плагіни преміум-класу, рекомендуємо купити із гарантією повернення грошей або безкоштовним пробним періодом.

Як додати віджети на бічну панель та нижній колонтитул у WordPress

Ви можете додавати віджети до будь-якої активної області віджетів, що надаються вашою темою. Якщо у вашій темі немає області віджету в тому місці, де ви хочете, спробуйте знайти іншу тему. Можна кодувати свою власну область віджетів, але цей процес скрутний для новачків.

Є два способи додати віджети на сайт:

• Використовуючи налаштувач. Перейдіть у «Зовнішній вигляд»>«Налаштування»>«Віджети» в меню адміністратора або в «Налаштування»>«Віджети» на панелі адміністратора у верхній частині екрана.
• Через екран адміністратора віджетів. Перейдіть у «Зовнішній вигляд»>«Віджети» в меню адміністратора або на панелі адміністратора натисніть «Налаштування»>«Віджети».

Розглянемо обидва методи, але спочатку розберемося з областю віджетів.

Віджети не тільки для бічної панелі

Залежно від вашої теми WordPress області віджетів можна знайти у кількох місцях.

Найчастіше області віджетів знаходяться на бічній панелі і в нижньому колонтитулі. Але в деяких темах можна знайти їх в інших місцях, наприклад, нижче / вище вмісту або в заголовку.

Якщо ви перейдете на екран налаштувань віджетів в адміністраторі WordPress, побачите всі області віджетів вашої теми.

приклад. На скріншоті нижче видно, що є області віджетів у бічній панелі, під заголовком та 4 області у нижньому колонтитулі (футері).

Якщо ви хочете додати віджети в інші місця на вашому сайті, є сенс знайти тему з кількома областями віджетів.

Хороший приклад віджету – це додати панель пошуку до заголовка:

Області віджетів та теми

Області віджетів закодовані у файлах шаблону теми, а також у файлі функцій теми.

Нижче наведено код, який ми використовували у файлі функцій теми, щоб додати область віджету в заголовку.

register_sidebar( array(
 'name' => __( 'In Header Widget Area', 'rmccollin' ),
 'id' => 'in-header-widget-area',
 'description' => __( 'A widget area located to the right hand side of the header, next to the site title and description.', 'rmccollin' ),
 'before_widget' => '
<div id="%1$s" class="widget-container %2$s">',
 'after_widget' => '</div>

',
 'before_title' => '
<h3 class="widget-title">',
 'after_title' => '</h3>

',
) );

І код у файлі header.php, який додає цю область віджету у потрібне місце у темі.

if ( is_active_sidebar( 'in-header-widget-area' ) ) { ?>

 
<aside class="in-header widget-area right" role="complementary">
  <?php dynamic_sidebar( 'in-header-widget-area' ); ?>
 </aside>


<?php }

Якщо ви хочете додати додаткові області віджетів на вашу тему, можете додати такий же код.

Не забувайте, що якщо ваша тема не має стільки областей віджетів, скільки вам хочеться, ви можете зробити одну з двох речей:

• Знайти тему, яка має області віджетів у потрібних вам місцях.
• Додати код нової області віджету на вашу тему.

Як тільки ви визначилися з областями віджетів у всіх місцях вашої теми, можете додавати до них віджети.

Як використовувати екран віджетів для додавання віджетів

Є два способи додати віджети на ваш сайт WordPress. Перший – використовувати екран віджетів у адмінці WordPress.

Натисніть на Зовнішній вигляд>Віджети. Перед вами екран віджетів.

Щоб додати віджет, ви можете зробити одну з двох речей:

• Перетягніть його зі списку віджетів з лівого боку у відповідну область віджетів.
• Натисніть віджет, який ви хочете додати, і ви побачите список, де ви можете додати його. Виберіть потрібну область віджету та натисніть кнопку «Додати віджет».

Ви можете додати стільки віджетів, скільки захочете, в кожну область віджетів, але не перестарайтеся. Ви можете змінювати порядок віджетів у кожній області, перетягуючи їх. А також переміщати їх з однієї області віджетів до іншої, якщо вирішите, що в іншій області вони будуть виглядати краще.

Дивіться також:

Вісім Facebook віджетів для вашого сайту WordPress.

Додавання та редагування віджетів у режимі доступності

Якщо ви не використовуєте мишу, з екраном віджетів можна працювати через клавіатуру.

Спочатку переведіть екран у режим спеціальних можливостей, клацнувши (або перейшовши на вкладку та вибравши) посилання Увімкнути режим спеціальних можливостей у верхньому правому кутку екрана.

Екран зміниться, відображаючи той факт, що ви знаходитесь у режимі доступності.

Тепер можна переміщатися між елементами екрана за допомогою клавіші таб на клавіатурі, і натискаючи Enter, щоб вибрати елемент та впливати на нього. Ви можете або перейти на віджет, натиснути "Повернення" за посиланням "Додати", а потім вибрати місце, куди ви хочете додати його, або перейти в область віджетів і натиснути "Повернення" за посиланням "Змінити".

Як використовувати налаштувач WordPress для додавання віджетів

Другий спосіб додати віджети на ваш WordPress – використовувати налаштувач для додавання віджетів замість екрана віджетів. Так ви можете бачити свої віджети в міру їхнього додавання. Це полегшує перегляд і переміщення віджетів між областями віджетів.

У меню адміністратора виберіть «Зовнішній вигляд» > «Налаштування». Це відкриє живий настройщик.

Тепер натисніть «Віджети», і ви побачите список усіх областей віджетів у вашій темі. Клацніть область віджету, до якої потрібно додати віджет, і натисніть кнопку «Додати віджет».

На екрані відображається список усіх віджетів, доступних для вашого сайту: усі вбудовані віджети, що постачаються з WordPress, а також усі віджети, додані вами за допомогою плагінів.

Виберіть віджет, який потрібно додати до області віджетів, і ви побачите його на екрані попереднього перегляду з правого боку.

Тут також можна змінити порядок віджетів, перетягуючи їх вгору та вниз з лівого боку або клацнувши посилання «Змінити порядок» під списком віджетів, а потім клацнувши стрілки, щоб перемістити їх вгору та вниз.

Коли ви закінчите додавати віджети, не забудьте натиснути кнопку «Опублікувати» у верхньому лівому куті. Якщо ви залишите налаштування без цього, жодна з ваших змін не буде відображено на сайті.

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

Як додати віджет на певну сторінку

Деякі теми включають області віджетів, призначені лише для певних сторінок, наприклад, домашньої сторінки. Але що якщо ви хочете додати віджет тільки на одну сторінку вашого сайту?

Ви можете зробити це в редакторі постів та сторінок Гутенберг.

Додайте новий блок звичайним способом, а потім виберіть тип блоку віджети.

Потім виберіть один зі списку віджетів, які ви увімкнули для свого сайту, і додайте його до змісту вашого поста або сторінки. Це корисно, якщо ви хочете додати віджет форми, віджет заклику до дії або список останніх постів.

Дивіться також:

Як через плагін відображати різні сайдбари для різних записів та сторінок у WordPress.

Як редагувати віджети

Додані на сайт віджети можна змінювати. Окремі віджети матимуть налаштування, до яких можна отримати доступ через екран віджетів або налаштувач (не має значення, який із них ви використовували для додавання віджету).

Деякі віджети не містять жодних налаштувань, але інші мають настройки, наприклад, для назви віджету або кількості постів, що відображаються. Більш складні віджети вимагають налаштування на окремій сторінці налаштувань. Перевірте документацію від розробника вашого плагіна.

Опції для редагування плагінів віджетів:

• Редагування параметрів для плагіна.
• Переміщення віджету з однієї області віджету до іншої.
• Видалення віджету.

Щоб відредагувати налаштування віджету, знайдіть його на екрані віджетів або в налаштуванні та відредагуйте всі настройки.

Щоб перемістити віджет з однієї області до іншої, відкрийте екран віджетів і перетягніть його з однієї області віджетів до іншої. У режимі спеціальних можливостей перейдіть до стрілки праворуч від віджету та виберіть один із варіантів.

Видалення віджетів

Щоб видалити віджет на екрані «Віджети», знайдіть цей віджет і натисніть посилання «Видалити» у нижньому лівому куті вікна налаштувань.

Щоб видалити віджет у налаштуванні, знайдіть його в області віджетів. Натисніть на стрілку праворуч від імені віджета, а потім на посилання «Видалити» в нижньому лівому куті налаштувань віджета.

Можна видалити віджет з області віджетів, але зробити його доступним для подальшого використання через екран віджетів.

Прокрутіть вниз до області «Неактивні віджети» у нижній частині екрана. Перетягніть віджети в цю область, щоб видалити їх з області віджетів, але збережіть їх як чернетки з поточними параметрами. Якщо ви захочете в майбутньому, ви завжди можете перетягнути їх назад в область віджетів.

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

Джерело: kinsta.com

Олексій Шевченко

редактор wpcafe

Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, який спеціалізується на створенні сайтів на WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/