Elementor — безкоштовний Page Builder для WordPress з відкритим кодом

Сьогодні ми поговоримо про нову плагін побудови сторінок для WordPress. Elementor . Це новий безкоштовний Page Builder з відкритим вихідним кодом від Поджо.

Будівельники сторінок у наші дні бувають різними. Вони дозволяють створювати красиві сайти без навичок програмування. Деякі теми йдуть із вбудованим будівельником сторінок, але найчастіше будівельники сторінок є окремими плагінами. Elementor Page Builder відноситься до другого типу, це окремий плагін, який відмінно працює з будь-якими темами та плагінами.

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

• Порівняння Топ-3 будівельників кастомних сторінок у WordPress (WordPress Page Builder)
• MotoPress - drag&drop плагін WordPress для керування контентом
• Forge – безкоштовний Front-End Page Builder для WordPress
• Frontend Builder - редагуємо контент WordPress за допомогою drag'n'drop
• PB Sandwich – безкоштовний WordPress плагін для створення сторінок через Front-end

Завантажити плагін ви можете безкоштовно тут:

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

Інтерфейс користувача Elementor

Ми знову встановили WordPress за допомогою теми Twenty Sixteen, щоб протестувати Elementor.

Після встановлення Elementor можна встановити певну основну інформацію в меню налаштувань. Ви зможете вибрати тип записів з якими буде працювати Elementor, роль користувачів та ще деякі базові параметри.

Після цього ви побачите кнопку на будь-якій сторінці або запису, якщо Elementor увімкнено для цього типу сторінок і записів. Просто натисніть кнопку для входу в інтерфейс Elementor:

З'явиться інтерфейс Elementor drag-and-drop. Ось так виглядає порожня сторінка:

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

Налаштування розмітки

Elementor покращує налаштування розмітки. Якщо ви хочете поміняти базову розмітку з 1 колонкою на щось інше, просто натисніть кнопку “ADD NEW SECTION”, і у вас з'явиться вибір з 12 різних структур. Натисніть будь-яку з них, щоб встановити її в розмітку:

Ви можете додавати будь-яку кількість розділів.

Змінювати розмір розділів легко. Якщо ви хочете змінити розмір по горизонталі, то просто розтягніть розділ так:

Зміна розміру надзвичайно плавна. Ми не виявили жодних збоїв.

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

Віджети Elementor

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

Крім того, є стандартні віджети, наприклад: заголовки, зображення тощо. Elementor має кілька крутих доповнень. Один із наших коханих – це віджет Counter. Ми думаємо, що в майбутньому можна круто поєднати Google Maps з віджетами Progress Bar.

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

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

Щоб показати, наскільки швидко працює Elementor, давайте побудуємо сторінку. Ми можемо зібрати розмітку за 30 секунд. Так, дизайн не вражає, але нас вразила швидкість інтерфейсу та побудови нової сторінки.

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

Налаштування віджетів

Elementor надає величезну кількість можливостей для редагування кожного віджету, який ви додали на сторінку. Коли ви додаєте новий віджет, ви можете налаштувати його інформацію, стиль та розташування:

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

• комп'ютера
• мобільного пристрою
• планшета

Ця функція дозволяє вам отримати максимум від адаптивного дизайну. Відмінний додаток від Pojo.

Додавання віджетів

На додаток до своїх 22 вбудованих віджетів, Elementor дозволяє додавати в дизайн віджети WordPress. Метод додавання такий самий — просто перетягніть їх у потрібне місце:

У дизайн Elementor ви можете додати навіть віджети. Elementor підтримує інші плагіни, що є величезною перевагою.

Попередній перегляд

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

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

Elementor має заготовки для:

• Комп'ютера
• Ноутбук
• Планшета
• Вертикальній орієнтації на мобільному пристрої
• Горизонтальна орієнтація на мобільному пристрої

Просто натисніть будь-який з варіантів і ви зможете налаштувати сайт в режимі реального часу. Зміни відразу відобразяться на пристрої. Круто!

Ціна та документація

Elementor йде за чудову ціну - БЕЗКОШТОВНО! На даний момент він 100% безкоштовний. Немає платних аддонів, немає обмежених функцій. Ви отримаєте весь пакет безкоштовно.

До того ж цей плагін з відкритим вихідним кодом, що є дуже хорошим рішенням Pojo. Вони планують випускати додаткові віджети та функції щотижня. Слідкуйте за оновленнями: https://github.com/pojome/elementor/issues Документація є, Але вона мізерна. Ми впевнені, що зі зростанням плагіна документація також покращиться.

Підсумки

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

Плюси Elementor:

• Безкоштовно та з відкритим вихідним кодом
• Чудова підтримка для адаптивного дизайну
• Гладкий інтерфейс без затримок. Ви бачите те саме, що і кінцевий користувач
• Відмінно працює з різними плагінами та темами

Мінуси Elementor:

• Короткий список віджетів порівняно з деякими преміум будівельниками сторінок

Ви використовували Elementor? Розкажіть нам у коментарях!

Джерело: elementor.com

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

редактор wpcafe

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