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

Разработка сайта "STAR FLOORS"

Разработка сайта "STAR FLOORS"

Задача

Компания STAR FLOORS занимается профессиональным выполнением работ по устройству промышленных полимерных полов, защите и обеспыливанию бетонного основания. Философия компании заключается в предоставлении заказчику наилучшего варианта промышленного полимерного пола.

Был получен заказ на разработку многостраничного сайта под ключ для компании, предоставляющей услуги по устройству промышленных полимерных полов, защите и обеспыливанию бетонного основания.

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

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

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

- Анализ конкурентов;
- Разработка дизайна;
- Разработка сайта.

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

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

Решение

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

Одна из задач, которая была поставлена при разработке сайта – создание раздела “Системы покрытий”, который имеет две основные категории:

- Системы напольных покрытий;
- Области применения.

Сложность заключалась в том, что каждая категория имеет свой шаблон вывода записей, также для записей предусмотрен свой шаблон в зависимости от категории. Так как иерархия предполагалась очень большой, то разработка раздела через “Страницы” с использованием шаблонов не подходила под решение данной задачи. Поэтому написание кастомного типа записи с использованием своей таксономии было единственным правильным решением.

P.S: Если в разделе предполагаются более чем 30 категорий и записей, то верным решением будет написание кастомного типа записи. В иных случаях можно обойтись и разработкой через общий раздел “Страницы”.

Создав кастомный тип записи и таксономию категорий, первой задачей было сделать индивидуальный вывод записей для каждой категории. Так как в WordPress есть своя иерархия шаблонов, то для кастомных категорий я создал файл taxonomy-systems-category.php, отвечающий за вывод записей в категории.

Так как записи выводятся в цикле, то сперва необходимо было получить ID категории.

>code

$term_id = get_queried_object()->term_id;

После того, как получен необходимый ID, следующим этапом будет передача в его в цикл.

>code

$args = array(
'post_type' => 'systems',
'post_status' => 'publish',
'posts_per_page' => -1,
'orderby' => 'date',
'order' => 'ASC',
'tax_query' => array(
array(
'taxonomy' => 'systems-category',
'field' => 'term_id',
'terms' => $term_id))
);

И напоследок нужно было через обычное разветвление if сделать проверку ID и вывести индивидуальную верстку для категории.

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

В самом файле single получить все термы кастомной таксономии, после чего через цикл foreach прогнать все термы и сделать проверку на совпадение слагов. Если слаги совпали то подтянуть соответственный файл из папки template-parts.

>code

$categories = get_the_terms(get_the_ID(), 'systems-category');
foreach( $categories as $cat ){
if($cat->slug == 'oblasti-primenenija'){
get_template_part('template-parts/systems/area');
} elseif($cat->slug = 'sistemy-napolnyh-pokrytij') {
get_template_part('template-parts/systems/coating');}}

Так же одной из задач при разработке сайтов в связке WordPress + Woocommerce стоит обновление файлов шаблонов темы при выходе новой версии плагина Woocommerce. Так как зачастую разработка ведется непосредственно в файлах шаблонов темы, то их обновлении затрудняется в разы так как нужно открывать две версии файлов и делать сравнительный анализ на их изменение. Зачастую при разработке на Woo задействуются в основном следующие файлы:

- archive-product.php
- taxonomy-product-cat.php
- content-single-product.php
- single-product.php

При работе над данным проектом, у меня появилось решение, при котором я избегаю правок данных шаблонов, что позволяет мне сократить время на обновление шаблонов.

Кто работал когда-то из woocommerce знает, что он построен на основе фильтров и хуков. Для разработчика это огромный плюс, так как зная как все устроено, можно достучатся к любому нужному месту на сайте. Вся разработка Каталога данного проекта велась всего в одном файле: function.php.

Так как расписывать по каждой странице, будет долго и муторно, за основу возьму страницу “категории каталога”.

>code

add_action( 'wp', 'wcc_remove_actions_from_category_page' );
function wcc_remove_actions_from_category_page() {
if ( is_product_category() ) {
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10) ;
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_result_count', 20);
add_action( 'woocommerce_before_shop_loop', 'wcc_category_list_navigation', 10);
add_action( 'woocommerce_before_shop_loop', 'wcc_product_wrapper_end', 50);
add_action( 'woocommerce_before_shop_loop', 'woocommerce_pagination', 40);
add_action( 'woocommerce_after_shop_loop', 'wcc_category_list_navigation_bottom', 5);
add_action( 'woocommerce_after_shop_loop ', 'wcc_product_wrapper_end', 90);
}
}

При создании данной функции я не затронул шаблон archive-product и taxonomy-product_cat, а сделал изменения только на странице категории.

Результат

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

Другие работы автора

Разработчик года

Актуальная плитка

Разработчик года

40-30.tennis

Веб-дизайнер года

40-30.tennis