Більше результатів...

Загальні селектори
Тільки точні збіги
Шукати у заголовках
Шукати у контенті
Вибір типів постів
Фільтрувати за категоріями
FAQ
Hostenko
Натхнення
Відео уроки
Новини
Плагіни
теми
Уроки
Хакі

Зробіть це нарешті! Створіть мобільну версію свого сайту на WordPress і позбавте кожного відвідувача з мобільного пристрою від незручності постійно збільшувати масштаб сторінок для читабельності тексту і виконувати N-ну кількість зайвих рухів.

Ми пропонуємо вам 7 найкрутіших, а головне безкоштовних плагінів WordPress, які допоможуть вам це зробити лише за кілька хвилин.

inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!

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

Плагіни для створення мобільної версії вашого сайту на WordPress

Швидше за все, термін «адаптивний дизайн» не є для вас новим, тому що вже протягом років так двох він знаходиться у всіх на слуху. Але якщо ви ще не знаєте, його зміст полягає в «перетворенні» або «адаптації» сайту для мобільних пристроїв. Тобто відвідувачеві з будь-якого гаджета, будь то планшет чи смартфон, так само зручно переглядатиме сторінки вашого сайту, як і зі стаціонарного ПК або ноутбука.

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

1.неприродний

7 плагінів WordPress для адаптації сайту під мобільні пристрої

Почнемо з дуже зручного плагіна Hammy для зміни розмірів зображень відповідно до роздільної здатності екрана мобільного пристрою, на якому виводитиметься сайт. Він замінює тегimg> назрозуміти>, а також використовує код зображення WordPress 3.5 для зміни розміру зображення.

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

2.Responsive Widgets

7 плагінів WordPress для адаптації сайту під мобільні пристрої

Цей плагін пропонує нові текстові/HTML віджети WordPress, доступні лише на гаджетах типу iPad, Nook, PlayStation Vita та інших загальних пристроях – планшетах та смартфонах.

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

  • Mobile
  • Mobile (landscape)
  • iPhones and iPods
  • Фабет
  • Tablet (Portrait)
  • Tablet (landscape)
  • iPad Portrait
  • iPad Landscape
  • Nexus Tablets
  • Kindle Tablets
  • Поверхневий планшет
  • Таблетки Nook
  • PS Vitas
  • Настільні комп'ютери
  • Large Monitors (1240px+ screens)
  • Лише друк

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

3.WP Lightbox 2

7 плагінів WordPress для адаптації сайту під мобільні пристрої

Дуже популярний «lightbox» плагін для використання зображень і галерей, що спливають у віконці, з ефектами накладання. Але майте на увазі, що цей плагін не вирішує завдання «адаптивності», а є сам по собі адаптивним.

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

4.Відповідальний

7 плагінів WordPress для адаптації сайту під мобільні пристрої

Надзвичайно корисний WordPress плагін. За його допомогою ви протестуєте адаптивний дизайн у своєму браузері, не відходячи від каси. У ньому використовується Viewport Resizer Bookmarklet для розміщення фіксованої панелі вгорі сторінки, де ви зможете змінити розмір сторінки для потрібних адаптивних пристроїв (наприклад, смартфони, планшети, екрани стаціонарних ПК), а також встановлювати необхідні дозволи екрану.

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

Плагіни для створення мобільних тем

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

5.WPTouch Mobile Plugin

7 плагінів WordPress для адаптації сайту під мобільні пристрої

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

Але будьте обережні! Ще в липні 2014 року стало відомо про вразливість версії плагіна WPTouch 3. Вона була відразу помічена і виправлена, але встигла нашкодити багатьом сайтам, які використовували цей плагін. Тому завжди слідкуйте за оновленнями плагіна і дбайте про безпеку вашого сайту у всіх його версіях.

6.Мобільний пакет WordPress

7 плагінів WordPress для адаптації сайту під мобільні пристрої

Ще один лідер тем для мобільної версії сайтів WordPress. Кількість завантажень плагіна перевалила за 600 тисяч, а рейтинг складає 3.8 зірок із 5 можливих. Його крутість полягає у заміні класичного дизайну на інтерфейс мобільного додатка.

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

7.Jetpack

7 плагінів WordPress для адаптації сайту під мобільні пристрої

Цей плагін займає лідируючі позиції з популярності серед подібних до нього інструментів, це підтверджується підтримкою WordPress.com і Automattic. У ньому є дуже корисна функція Mobile Theme. Щоб використовувати її, потрібно зайти на сторінку налаштувань (Jetpack → Settings) після встановлення та активації плагіна. Дій мінімум, а можливостей максимум. Ви переконаєтеся в цьому самі, якщо оберіть цей безкоштовний плагін.

Єдина порада, яку ми можемо вам дати – це не використовувати цей плагін з плагіном Disqus, оскільки вони не дуже сумісні.

Висновок

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

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

Джерело: code.tutsplus.com
inet.ws - Powerful VPS Hosting в США, Canada, UK та DE!
Олексій Шевченко
редактор wpcafe
Вивчає сайтобудування з 2008 року. Практикуючий вебмайстер, який спеціалізується на створенні сайтів на WordPress. Задати питання Олексію можна на https://profiles.wordpress.org/wpthemeus/

Коментарі до запису: 6

Imapo:

Навіщо використовувати якісь ліві навороти, якщо можна увімкнути плагін https://wordpress.org/plugins/any-mobile-theme-switcher/ та використовувати будь-які теми WP для мобільних пристроїв? Більшість із стандартних тем WordPress вже заточено для мобільних пристроїв та гаджетів?

Андрій:

Imapo ти маєш рацію, я весь інтернет перерив за мобільним плагіном, але жоден мене не влаштовував, і ось знайшов у wordpress російською мовою, називається WP Mobile Edition, найкращий, там в низу можна перемикати як на повну так і на мобільну версію, а ще можна рекламу встановлювати, а це погодьтеся дуже важливо, можете подивитися на прикладі сайту binews.ru, в самому низу є перемикач на мобільну і назад.

Наталія:

Добридень! Підкажіть, будь ласка, як мені знайти це плагін? Якщо в адмінці він не видає його в пошуку та не можна додати новий. Сайт cinomed.ru

михайло:

Здрастуйте. Я створив блог на движку wordpress, але як показав аналіз-мій блог некоректно показується на мобільних пристроях. Підкажіть як це виправити?

Віктор:

Чи не легше звернутися до професіоналів? Головне, у процесі обговорення пояснити, що саме ви хочете в результаті. Нещодавно сам намагався адаптувати за допомогою різних «візуальних редакторів», все криво, огидно, а серйозні компанії б'ють безбожно гроші. Одна тільки команда попалася, і то насилу відшукав, вибрав за цінником спершу. Моя проблема була в тому, що я продавав диски через Інтернет, магазин погано відображався на телефоні, але я пояснив, що саме мені потрібно, тому все вийшло) Кому цікаво, подивіться, не брешу: mobile-version .ru. Чи не реклама, просто самого дратують сторінки, не заточені під телефон.

Андрій:

дякую велике автору! я вибрав для себе дуже крутий плагін - WPTouch Mobile Plugin, всім раджу!

Додати коментар або відгук