Создал сайт для популяризации и рекламы роупджампинга в Мариуполе.

Сайт: https://ropejump.mrpl.info/

Git-репозиторий https://github.com/chomovva/ropejump.git

Моя роль в проекте:

  • дизайн
  • вёрстка
  • разработка темы
  • первоначальное наполнение и настройка сайта

Подробнее о проекте

Сайт создан для рекламы роупджампинга в Мариуполе. Организацией прыжков занимается фирма АльпСити и её руководитель Андрей Шаталин.

Роупджампинг – достаточно молодое направление экстремального спорта и отдыха, суть которого заключается в прыжках с высотных объектов с использованием специального снаряжения.

На сайте опубликована информация об этом виде отдыха, фото прыжков и настроены формы для обратной связи с администрацией, так же есть возможностью записаться на прыжки.

Контент сайта переведён на русский и украинский языки.

Подробней о проекте вёрстки

Проект вёрстки выполнен на Gulp.js. Стили написаны на препроцессоре SASS (синтаксис SCSS), html-код на препроцессоре PUG (Jade).

Вёрстка сайта адаптивна, хорошо отображается на мобильных устройствах и десктопах.

Главная страница выполнена в виде лендинга.

Библиотеки и фреймворки, которые я использовал:

  • FlexboxGrid.css – модульная бутстрап подобная сетка на флексбоксах;
  • LazyLoad.js – jQuery плагин для добавления “ленивой” загрузки изображений;
  • justifiedGallery – js библиотека, которая позволяет создавать галерею изображений по ширине экрана;
  • Superembed.js – обнаруживает встроенное видео популярных видеосервисов и делает его адаптивным;
  • Fancybox.js – jQuery плагин для создания модальных окон и галлереи;
  • jQuery -популярный JavaScript фреймворк.

Интеграция WordPress темы

Тема интегрирована по всем правилам кодекса wordpress. При интеграции не использовались сторонние плагины или билдеры. Вся настройка темы осуществляется через WordPress Customizer API. Для некоторых блоков главной страницы написаны нестандартные элементы управления. Работает живое превью, т.е. при изменении настроек автоматически обновляется область предварительного просмотра страницы.

Тема поддерживает многоязычность с помощью плагина Polylang. Все настрйоки Customizer API переводятся стандартными средствами этого плагина.

Вёрстка главной страницы

Скриншоты настроек темы

51голос
Рейтинг статьи
Подписаться
Уведомить о
guest
0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии
0
Оставьте комментарий! Напишите, что думаете по поводу статьи.x
()
x