Виконав роботу по перенесенню дизайну і контенту сайту c платформи Tilda на CMS WordPress.

Сайт: https://omaldivah.ru/

Детальніше про проект

Компанія Люкс Острови займається організацією турів преміум-класу на Мальдівах. Оригінальний сайт компанії був створений на платформі Tilda у вигляді Лендінгу. Через особливості платформи він дуже довго завантажувався. Необхідно було перенести дизайн сайту і контент на CMS WordPress, створити каталог готелів і поліпшити показники швидкості в порівнянні з оригіналом.

Моя роль у проекті

  • верстка за зразком
  • створення валідной WordPress теми
  • створення плагіна каталогу готелів
  • встановлення та налаштування плагіна на хостингу
  • перенесення контенту

Верстка

Проект верстки виконаний на Gulp.js. Стилі написані на препроцесорі SASS (синтаксис SCSS), html-код на препроцесорі PUG (Jade). Файли проекту розділені на логічні модулі відповідно до їхньої ролі на сайті, що робить верстку легко розширюваною.

Верстка сайту адаптивна, добре відображається на мобільних пристроях і десктопах. Сайт виконаний у вигляді Лендінгу. Додатково створені шаблони для постійних сторінок / постів і блоку.

HTML-код повністю валиден, безпомилкова і попереджень.

Результати аналізу валідатора W3C
Результати аналізу валідатора W3C

Тема

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

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

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

“Готелі” завантажуються з каталогу консолі сайту. Опис готелю і додаткові поля у вигляді відео, галерей завантажуються тільки при кліці на відповідні посилання і відкриваються в модальних вікнах.

Плагін

Плагін побудований за аналогією з шаблоном WordPress Plugin Boilerplate і додає каталог готелів у вигляді нестандартного типу записів “Готель”.

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

Додаткові поля “Готелю”:

  • короткий опис за аналогією з описом товару в WooCommerce
  • вартість
  • умови проживання (туру)
  • галерея
  • посилання на відео YouTube з докладним описом
  • переваги проживання у вигляді списку
  • заголовок розділу переваг
  • посилання на сторінку (якір) з можливістю замовити зворотний дзвінок

Скриншоти

Скриншот главной страницы сайта люкс Острова
51голос
Рейтинг статті
Підписатися
Сповістити про
guest
0 Коментарі
Вбудовані Відгуки
Переглянути всі коментарі
0
Ми любимо ваші думки, будь ласка, прокоментуйте.x
()
x