Віджети у WordPress. Створення віджетів для WordPress

Головна / Налаштування

Діти з WPBeginner.com зробили відмінну добіркуіз 25 корисних віджетів для блогу на WordPress. Я не полінувався і переклав вміст, щоб донести список до вас, шановні читачі.

За умовчанням у WordPress встановлений «рідний» віджет виведення останніх записів у вигляді списку, який рідко хто звертає увагу. Recent Posts Widget With Thumbnails- Відмінний віджет, який допоможе вам виводити останні записи разом з їх превью. Зазвичай плагін бере для превью перше зображення запису. Також можна вказати ширину і висоту мініатюри та сортування. Він може показувати як останні записи, так і найпопулярніші та випадкові.

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

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


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


Ви напевно бачили щось схоже на популярні сайти. Цей віджет допоможе вивести інформацію про кількість передплатників у соціальних мережахв одному блоці.


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


Стандартний віджет категорій Wordpess не дозволяє групувати рубрики. За допомогою цього віджету все стане дуже просто – категорії, підкатегорії, все це тепер можна розділяти заголовками та всіляко змінювати ієрархію.


Ще один віджет для тих, кого не влаштовує стандартна функціональність WordPress. Дефолтний віджет Календаря виводиться у вигляді довгого списку, який займає багато місця і трохи псує зовнішність сайту. Compact archivesвирішує цю проблему та дозволяє виводити записи за певний місяць, рік у компактній формі.


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


Відмінний віджет для виведення останніх відео з YouTube-каналу. Виглядає дуже красиво, компактно та цікаво для відвідувачів.


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


Віджет для виведення приємного меню меню авторизації. Авторизація, реєстрація, Забули пароль? - усі ці пункти поділені на таби. Виглядає свіжо та красиво.

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

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

SiteOrigin Widgets Bundle

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

Серед нових віджетів можна відзначити:

  • Карти.
  • Форма контактів.
  • Відгуки.
  • Слайдери.
  • І багато іншого.

WooSidebars

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

Relevanssi

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

Про цей плагін ми розповідали. Плагін також повністю безкоштовний.

Ninja Forms

Якщо ви хочете, щоб форма контактів завжди була на увазі, її потрібно поставити в бічній колонці. Однак у WordPress немає такого віджету. Плагін Ninja Forms створює додатковий віджет із формою зворотнього зв'язку. Крім того, він має безліч додаткових функцій, які можуть поліпшити форму.

Recent Posts Widget Extended

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

WordPress Popular Posts

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

Якщо ви ще не проходите у нас навчання, пройдіть .

Якщо ви знайшли помилку, то виділіть її та натисніть клавіші Shift+Enterабо щоб поінформувати нас.

Всім привіт! У моєї молодої людини з'явився новий друг — мотоцикл! Тепер він проводить більшу частину дня в його компанії, а я сиджу вдома та займаюся блогом. У мене теж з'явилося нове хобі, але про це пізніше:)

Сьогодні ми поговоримо про віджети для Вордпрес-блогу. Розберемо функції вже встановлених у шаблоні стандартних віджетів, згадаємо деякі плагіни для додавання нових функцій. Також ви дізнаєтеся, як додати відсутній вашому сайту блок віджетів у тему WordPress.

Як додати віджети на WordPress-блог?

Розглянемо віджети для Вордпрес, які вже є у встановленому нами шаблоні. Залежно від версії та виду теми, їх кількість та назви можуть відрізнятися. Також у кожному шаблоні передбачено свої області для додавання віджетів: футер або бічні панелі.

Ось доступні віджети теми Twenty Thirteen (Консоль – Зовнішній вигляд- Віджети):


Збоку, як бачите, щоб додати WordPress-віджети, передбачені дві області: основна (в нижній частині сайту – футер) і додаткова (бічна колонка).

Відповідно, потрібно перетягнути опцію, що вам сподобалася, в основну або додаткову область.

Ось так виглядає блог перед додаванням віджетів:


Немає нічого ні в сайдбарі, ні у футері.

Тепер, наприклад, перенесемо кілька віджетів в одну і в іншу панель:


Для кожної опції введіть заголовок, який відображатиметься на сайті і, де можливо, внесіть свої налаштування (наприклад, поставити галочку "Відображати дату запису" в "Свіжі записи"). Після внесення змін натисніть кнопку «Зберегти» під кожним вікном функції.

Подивимося, як змінився наш блог із віджетами:


Праворуч з'явився календар та хмара міток, і у підвалі сайту 3 додані нами опції.

Ми розібралися з тим, як додати віджети на WordPress-блог, розглянемо кожну з цих функцій докладніше.

Функції шаблонних віджетів Вордпрес

Після того, як ви і встановили його, вам стануть доступні такі WordPress-віджети:



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

Ось, наприклад, код лічильника Рамблер:

І ось він відображений у сайдбарі:

За тим же принципом можна додати інший лічильник, наприклад, або будь-який інший елемент.

Деякі плагіни віджетів WordPress

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

Ряд WordPress-плагінів для віджетів та варіанти їх додавання за допомогою коду ми вже розглядали.

Згадаймо деякі з них.

І це далеко не повний перелікможливі віджети, які можна встановити на свій блог.

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

Як додати новий блок віджетів?

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

Для цього потрібно додати ще один блок. А зробити це можна, прописавши у файлі вашої теми functions.php наступний код:

if (function_exists("register_sidebar")) register_sidebar(array("name" => "Додатковий блок", "before_widget" => "", "after_widget" => "", "before_title" => "

", "after_title" => "
",));

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

Тепер можна додавати WordPress-віджети до нової області. На відео нижче показано, як додати додаткову область за допомогою плагіна.

Все про віджети для вордпрес: огляд корисних віджетів, інструкції по встановленню, огляди, описи та багато іншого.

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

Даний файл присутній практично на всіх хостингах, проте переглядати його через FTP не завжди зручно: у новачків можуть виникнути складності, а у разі неймовірних розмірів він занадто довго вантажиться. Поліпшити ситуацію з WordPress логами помилок дозволяє плагін Error Log Monitor.

Настав час розглянути основні фішки, якими володітиме майбутній реліз системи WordPress 4.8 (запланований на 8 червня). Це перше серйозне оновлення цього року, тому навіть якось цікаво, що припасли для нас розробники. Попередній апдейт був досить масштабним і мені особисто сподобався.

Однак, переглядаючи список можливостей WP 4.8, виникають подвійні враження. З одного боку, начебто плануються цікаві фішки для редакторів, з іншого — не залишає відчуття, що змін, м'яко кажучи, не дуже багато.

Давайте розглянемо рішення однієї очевидної задачі з якою іноді зустрічається розробникам. Буває, що на сайтах потрібно виводити відразу два меню, які при цьому взаємопов'язані між собою: одне верхнє горизонтальне 1-го рівня, а друге в сайдбарі 2-го рівня. Причому у бічному відображаються лише ті підпункти, для яких вибрано відповідний батьківський елемент у головному меню. Наприклад, якщо у вас в шапці сайту є список країн, то вибравши, припустимо, Італію, в сайдбарі отримаєте тільки список італійських міст.

На деяких сайтах у сайдбарі можна зустріти функцію виведення випадкових цитат. Подібний елемент доповнює сторінку цікавою інформацієюхоча, звичайно, він підходить не для всіх тематик. Мені, наприклад, важко підібрати щось для відображення в даному блозі, проте, якщо у вас якийсь творчий чи науковий проект, можна виводити випадкові записи з цитатами відомих відповідних людей. Або, припустимо, для сайту про саморозвиток постити якісь мотиваційні фрази та корисні поради. Це може бути навіть маленький анекдот для гумористичного веб-сайту.

Нещодавно здавав замовнику і мені знадобилося додатково розповідати яким HTML кодом вставляється посилання та картинка у футері. Для візуального редакторасистеми (базового або ) такої проблеми не виникає, але у віджетах за умовчанням такого функціоналу немає. Об'єкт типу «Текст» дозволяє розміщувати лише звичайний контент без форматування або HTML-коду. Останнє для редакторів новачків, не знаючих основверстки, може бути дуже складним завданням. На щастя, плагін Black Studio TinyMCE Widget зможе її вирішити.

За традицією на початку нового року підбиваю підсумки попереднього шляхом публікації добірки найкращих нотаток блогу. Схожий пост ви, а сьогодні я поділюся найцікавішими вордпрес статтями за 2014. Тлумачних матеріалів, в принципі, було чимало, оскільки вордпрес — тема сама по собі досить велика. Тут майже завжди є про що розповісти, особливо якщо регулярно стикаєшся з даною CMS по роботі. На жаль, через брак часу я публікую не більше одного посту на тиждень. Сподіваюся вдасться

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

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

Головний файл плагіна

WordPress автоматично розпізнає плагіни, розташовані в папці wp-content/plugins. Для створення нового плагіна потрібно створити нову папкуу цій директорії. Ім'я цієї підпапки може бути будь-яким, але краще назвати папку ім'ям вашого плагіна. Намагайтеся уникати поширених слів, наприклад: textwidget або shoppingcart, т.к. ці імена вже можуть бути зайняті і можуть викликати проблеми, якщо ви зберетеся викласти ваш плагін у загальний доступ(Докладніше про найменування в статті). Для нашого прикладу створимо папку php_examplewidget.

WordPress розпізнає доступний плагін за коментарем, розташованим у головному PHP файлплагіна. Цей коментар повинен містити основну інформацію про вашу плагін: призначення плагіна, ім'я автора, інформацію про ліцензію тощо. Ця інформація допомагає системі ідентифікувати плагін. Створимо в папці php_examplewidgetфайл widget_init.phpз наступним змістом:

Це обов'язковий мінімум для будь-якого WordPress плагіна. Тепер зайдіть на сторінку ваших плагінів у WordPress і ви побачите, що ваш плагін розпізнаний і готовий до активації:

Як бачите, вся інформація, яку ви написали в коментарі, відображається тут. Плагін вже можна активувати, але краще додати до нього трохи функціоналу.

Файл, який ми щойно створили – стартова точка вашого плагіна. Код, розміщений після коментаря, буде автоматично виконуватися.

Віджети у WordPress

У WordPress є клас WP_Widget , який надає доступ до API віджетів. Коли ви успадкуєте цей клас, ваш віджет буде доступним для будь-якого сайдбара, який підтримує вашу тему. У комплекті WordPress вже є деякі віджети, наприклад «Свіжі записи» або «Архів», вони також успадковують клас WP_Widget .

Клас WP_Widget містить чотири методи, які мають бути перевантажені:

  • __construct()- Викликає батьківський конструктор і ініціалізує віджет.
  • form()— виводить форму для налаштування віджету.
  • update()— оновлення налаштувань віджету, які були вказані у формі аміністратором.
  • widget()- Відображення плагіна на сайті.

Конструктор

Конструктор нічим не відрізняється від тих, що зазвичай пишете. Головне, що потрібно зробити - це викликати батьківський конструктор, який приймає три аргументи: ідентифікатор віджету, назва віджету (це ім'я буде показано на сторінці віджетів) та масив з іншими деталями віджету (потрібно тільки "description"):

"A simple widget to show how WP Plugins work")); )

Тепер потрібно зареєструвати віджет. Для цього використовується функція register_widget() яка в якості аргументу приймає ім'я класу вашого віджету. Ця функція має бути викликана у певний час, тому нам потрібно використовувати систему . Потрібний нам хук називається "widgets_init". Для зв'язку реєстрації віджету з хуком будемо використовувати функцію add_action() , яка має два аргументи: перший — ім'я хука, другий — ім'я функції, яку треба виконати (другим аргументом може бути рядок або замикання). Цей код має бути розміщений після коментаря у файлі widget_init.php:

Add_action("widgets_init", function () ( register_widget("TextWidget"); ));

Тепер, коли ваш плагін зареєстрований та ініціалізований, ви можете побачити його на сторінці віджетів.

Метод form()

Віджет, який ми робимо, повинен давати можливість вводити заголовок і трохи тексту для відображення на сторінках сайту. Тому нам треба створити форму для введення цих значень. Метод form() використовується для відображення настройок віджету на сторінці віджетів. У методу один аргумент - $instance - Масив змінних, пов'язаних з віджетом. Коли форма відправиться на сервер, буде викликано метод update() і ми зможемо оновити змінні в масиві $instance . Після, метод widget() буде використовувати цей масив для відображення віджету.

Public function form($instance) ( $title = ""; $text = ""; // якщо instance не порожній, дістанемо значення if (!empty($instance)) ( $title = $instance["title"]; $text = $instance["text"]; ) $tableId = $this->get_field_id("title"); $tableName = $this->get_field_name("title"); echo "
"; echo"
$textId = $this->get_field_id("text"); $textName = $this->get_field_name("text"); echo "
"; echo" "; }

Методи get_field_id() і get_field_name() класу WP_Widget використовуються для створення унікальних імен та ідентифікаторів для полів вашого плагіна. Використання цих методів дозволяє уникнути конфліктів.

Зовнішній вигляд форми віджету на сторінці віджетів:

Батьківський елемент

, кнопки "видалити", "закрити" і "Зберегти" WrodPress генерує автоматично, що сильно спрощує нам життя. Ця форма відправить введені значення на сервер і викличе метод update(), щоб ми змогли зберегти їх.

Метод update()

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

Public function update($newInstance, $oldInstance) ( $values ​​= array(); $values["title"] = htmlentities($newInstance["title"]); $values["text"] = htmlentities($newInstance[ "text"]); return $values;

WordPress збереже ці значення самостійно, про це можна не перейматися.

Метод widget()

Цей метод використовується для відображення віджету безпосередньо у сайдбарі на сайті. У методу два аргументи: $args- аргументи віджету (масив, що містить деяку інформацію про віджет), $instance- Масив зі зв'язаними з віджетом змінними. У нашому випадку $argsне має значення.

Public function widget($args, $instance) ( $title = $instance["title"]; $text = $instance["text"]; echo "

$title

"; echo ""; )

У результаті ми отримаємо остаточний вид віджету:

Готово! Цей дуже простий плагін дозволяє відображати простий текст на вашому сайті за допомогою віджетів.

© 2022 androidas.ru - Все про Android