Номинация: Разработчик года

Разработка сайта "Flumtec"

Задача
Решение
Результат
Бизнес-эффект
Соавторы
Презентация проекта
Примеры реализации
Другие работы автора

Задача

Интернет-магазин «Флюмтэк» разработан для продвижения и продажи профессионального оборудования премиум-класса для инженерных систем конечным потребителям, монтажным организациям, владельцам частных домов.

Предыстория:

Был получен заказ на разработку интернет-магазина по продаже и поставке профессионального оборудования премиум-класса для инженерных систем. Особое пожелание клиента – возможность импорта/экспорта товара с сайтов производителей.

Реализация проекта осуществлялась на CMS WordPress. Заказчик заполнил бриф, где обозначил все свои предпочтения, после чего заказ был принят в работу.

На первом этапе было создано несколько версий логотипа для сайта, основываясь на особенностях ниши и пожеланиях заказчика. После выбора одного, наиболее подходящего, логотипа был создан дизайн главной и внутренних страниц, а также дизайн мобильной версии сайта. На следующем этапе осуществлялась верстка и натяжка на WordPress, и в завершение – программинг + интеграция и настройка импорта/экспорта.

Решение

Общие работы, проведенные на сайте:

- Анализ конкурентов
- Разработка логотипа
- Разработка дизайна
- Разработка Сайта
- Дополнительное программирование
- Импорт товаров от поставщика/производителя

Технические работы, проведенные на сайте:

- Импорт товаров от поставщика/производителя
- Онлайн оплата, регион доставки
- Умный поиск
- Несколько вариаций описания одного товара
- Фотогалерея
- Слайдер
- Модуль новостей
- Карта сайта
- CSS анимация
- Анимированное меню
- Адаптивная верстка под мобильные устройства
- Неограниченное кол-во разделов
- Обратный звонок, задать вопрос
- Индивидуальная карточка товара
- Характеристики
- Калькулятор
- Карточка товара, которая меняет цену в зависимости от параметров

Результат

Сложности с которыми я столкнулся и как я их решал:

Одна из задач, которая была поставлена при разработке сайта – возможность настройки импорта товаров от производителя насосов Grundfos.

На сайте используется связка Wordpress+Woocommerce и для импорта данных, был выбран мощный инструмент WP All Import.

При анализе файла импорта, выяснилось, что у него:

- не совсем верная структура данных для импорта;
- у большей части ссылок на фотографии не хватает домена в начале ссылки или ссылки с устаревшим протоколом http;
- часть данных, которые необходимо разместить как дополнительное описание, видео, графики – сделаны в виде характеристик товара, что неправильно со стороны понимания – что такое характеристика товара;
- кириллические названия в идентификаторах характеристик.

Для решения перечисленных проблем, пришлось немного изменить скрипт плагина импорта данных (а именно, увеличить значение ограничения длины названия атрибута/характеристики с 28 символов на 32 и создание функции транслитерации с подменой некоторых целых слов на сокращения), подключение этой транслитерации в генерацию слага атрибута.

Дополнительно, в таблице wp_woocommerce_attribute_taxonomies в поле attribute_name необходимо было увеличить значение длины атрибута с 32 до 100, чтобы кириллическое название атрибута сохранялось целиком (очень много характеристик было с очень длинным названием).

Для изменения ссылок, в настройках плагина импорта были добавлены дополнительные функции:

– для подмены неправильной ссылки

КОД:

function uploads_replace($str){
$str = str_replace('/upload/', 'http://ecommerce.grundfos.ru/upload/', $str);
return $str;
}

далее эта функция вызывалась для подгрузки документов

– для изменения ссылок на ютуб

КОД:

function wrap_video($str){
$values_arr = explode( ",", $str );
$new_str = '';
foreach ($values_arr as $key=>$item){
$new_str .= '<iframe src="'.trim(str_replace('http://www.youtube.com/watch?v=','https://www.youtube.com/embed/',$item)).'" width="560" height="315" frameborder="0" allowfullscreen="allowfullscreen"></iframe> '; } return $new_str; }

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

Следующая из задач – фильтр товаров в каталоге по необходимым атрибутам уже после полного импорта данных.

На этом этапе разработки выяснилось, что производитель неверно указывает в прайсе значения атрибутов (большая часть значений указана вместо точки – запятая, что приводило к неправильному отображению шкалы значений; у части атрибутов дополнительно к числовому значению была добавлена еще и единица измерения).

У всех атрибутов правка значений производилась вручную, так как встречаются значения, перечисленные через запятую (2,1, 2,3, 5,2) и массово через запрос к базе заменить такие запятые затруднительно.

Клиент остался полностью доволен выполненным проектом.
Для более глубокого изучения проекта, просьба ознакомится с ним на моем сайте https://shulepov-code.ru/portfolio/razrabotka-sajta-flumtec/ т.к. там имеется более логическое разбиение и описание проекта.