Сайт-портфоліо для контент-креатора Андрія Бурди
Створення сайту під ключЗавдання
Створити багатосторінковий сайт для презентації робіт контент-креатора – фото, відео, контенту для соціальних мереж та рекламних кейсів. В якості платформи використовувати CMS WordPress та преміум-тему, придбану замовником – Aoki. Готове доменне ім’я та хостинг також були заздалегідь придбані та надаються замовником.
Сайт має бути тримовним — українською, англійською та чеською мовами. Сторінки мають бути заповнені демонстраційним контентом. До сайту висуваються вимоги щодо адаптивності для всіх пристроїв, браузерів та операційних систем, а також щодо швидкого завантаження. Усі відеофайли в портфоліо мають відкриватися за допомогою ефекту лайтбокс. На сайті мають бути кнопки з посиланнями на соціальні мережі власника та номер телефону.
Проєкт складається з таких сторінок та підсторінок:
- Головна
- Про мене
- Портфоліо:
- Фото
- Відео
- Соціальні мережі
- Реклама
- Контакти
Замовник надав макет дизайну всіх сторінок сайту з демо-контентом, як він їх собі уявляє, створений у Claude.ai.
Додаткові завдання
Використовувати брендовий шрифт, наданий замовником.
Після створення сайту надати замовнику інструкцію щодо наповнення портфоліо контентом.
Інструменти реалізації
Для реалізації проєкту використовувалися такі інструменти:
- платформа – CMS WordPress;
- тема – Aoki;
- конструктор сторінок WPBakery (у складі теми);
- плагін Firelight Lightbox – ефект лайтбокса у відео;
- плагін Polylang – багатомовність;
- плагін Loco Translate – переклад елементів теми з англійської на українську та чеську мови.
Хід роботи та результат
Робота розпочалася з установки WordPress на домені та хостингу замовника, а також установки та активації преміум-теми. Замовник надав ключі активації та інші необхідні дані.
Потім було створено українську версію головної сторінки, аналогічну наданому макету Claude.ai. Для реалізації використовувалися блоки WPBakery. Сторінку було продемонстровано замовнику, після чого він вніс кілька правок, які були одразу реалізовані. Зокрема, деякі правки вимагали внесення кастомних CSS-стилів.
Потім було виконано подальшу роботу — реалізовано всі інші сторінки, а також багатомовність. Для досягнення оптимальної адаптивності для мобільної та настільної версій створювалися окремі варіанти деяких блоків.
За допомогою плагіна Loco Translate деякі елементи дизайну теми були перекладені на необхідні мови — з англійської на українську та чеську.
Замовник надав свій фірмовий шрифт, який було встановлено на сайт за допомогою інструментів WordPress та підключено за допомогою CSS-коду. Після цього шрифт було успішно застосовано на всіх сторінках.
Особливої уваги потребувала сторінка Відео, на якій мали розміщуватися відео зі співвідношенням сторін 9:16, що відкриваються у лайтбоксі. Сітка була створена за допомогою блоків WPBakery, а лайтбокс — за допомогою плагіна Firelight Lightbox та спеціального коду відкриття. Відео беруться з YouTube.
У результаті було створено сайт burda.marketing, який після демонстрації замовнику зазнав незначних правок, і проєкт було здано.
Після виконання проєкту замовник отримав детальну інструкцію зі скріншотами про те, як правильно змінювати та створювати контент, а також створювати мовні версії всіх сторінок. Зокрема, в інструкції було продемонстровано, як додавати відео з ефектом лайтбоксу.
#створення_сайту #сайт-портфоліо
Створити багатосторінковий сайт для презентації робіт контент-креатора – фото, відео, контенту для соціальних мереж та рекламних кейсів. В якості платформи використовувати CMS WordPress та преміум-тему, придбану замовником – Aoki. Готове доменне ім’я та хостинг також були заздалегідь придбані та надаються замовником.
Сайт має бути тримовним — українською, англійською та чеською мовами. Сторінки мають бути заповнені демонстраційним контентом. До сайту висуваються вимоги щодо адаптивності для всіх пристроїв, браузерів та операційних систем, а також щодо швидкого завантаження. Усі відеофайли в портфоліо мають відкриватися за допомогою ефекту лайтбокс. На сайті мають бути кнопки з посиланнями на соціальні мережі власника та номер телефону.
Проєкт складається з таких сторінок та підсторінок:
- Головна
- Про мене
- Портфоліо:
- Фото
- Відео
- Соціальні мережі
- Реклама
- Контакти
Замовник надав макет дизайну всіх сторінок сайту з демо-контентом, як він їх собі уявляє, створений у Claude.ai.
Додаткові завдання
Використовувати брендовий шрифт, наданий замовником.
Після створення сайту надати замовнику інструкцію щодо наповнення портфоліо контентом.
Інструменти реалізації
Для реалізації проєкту використовувалися такі інструменти:
- платформа – CMS WordPress;
- тема – Aoki;
- конструктор сторінок WPBakery (у складі теми);
- плагін Firelight Lightbox – ефект лайтбокса у відео;
- плагін Polylang – багатомовність;
- плагін Loco Translate – переклад елементів теми з англійської на українську та чеську мови.
Хід роботи та результат
Робота розпочалася з установки WordPress на домені та хостингу замовника, а також установки та активації преміум-теми. Замовник надав ключі активації та інші необхідні дані.
Потім було створено українську версію головної сторінки, аналогічну наданому макету Claude.ai. Для реалізації використовувалися блоки WPBakery. Сторінку було продемонстровано замовнику, після чого він вніс кілька правок, які були одразу реалізовані. Зокрема, деякі правки вимагали внесення кастомних CSS-стилів.
Потім було виконано подальшу роботу — реалізовано всі інші сторінки, а також багатомовність. Для досягнення оптимальної адаптивності для мобільної та настільної версій створювалися окремі варіанти деяких блоків.
За допомогою плагіна Loco Translate деякі елементи дизайну теми були перекладені на необхідні мови — з англійської на українську та чеську.
Замовник надав свій фірмовий шрифт, який було встановлено на сайт за допомогою інструментів WordPress та підключено за допомогою CSS-коду. Після цього шрифт було успішно застосовано на всіх сторінках.
Особливої уваги потребувала сторінка Відео, на якій мали розміщуватися відео зі співвідношенням сторін 9:16, що відкриваються у лайтбоксі. Сітка була створена за допомогою блоків WPBakery, а лайтбокс — за допомогою плагіна Firelight Lightbox та спеціального коду відкриття. Відео беруться з YouTube.
У результаті було створено сайт burda.marketing, який після демонстрації замовнику зазнав незначних правок, і проєкт було здано.
Після виконання проєкту замовник отримав детальну інструкцію зі скріншотами про те, як правильно змінювати та створювати контент, а також створювати мовні версії всіх сторінок. Зокрема, в інструкції було продемонстровано, як додавати відео з ефектом лайтбоксу.
#створення_сайту #сайт-портфоліо