Перенос сайта на wordpress для повышения "гибкости"

Мы не только разрабатываем сайты с нуля, но и осуществляем “переезд” с одной CMS-системы на другую.

Один из наших клиентов занимается производством и продажей промышленной тары, а также изготовлением столярных изделий. В начале нашего сотрудничества у клиента уже был сайт на одной из отечественных CMS, который обладал определенными преградами в работе. Основные из них и наши варианты решения рассмотрим ниже.

Основными преградами при работе с данной системой в техническом плане были:

• закрытость;
• большая часть функционала являлась платной;
• отсутствовала возможность внедрения собственного кода.

Из данных технических сложностей тянулись следующие сложности для бизнеса:

• невозможность создать на сайте понятное деление товаров по категориям;
• отсутствие возможности показывать примеры товаров в нужном количестве;
• ограниченность в управлении, невозможность масштабирования.

Из-за перечисленных сложностей было решено перенести сайт на другую CMS.

Подбор подходящего инструмента: WordPress, 1С-Битрикс или что-то еще?

В очередной раз мы решили переносить сайт на WordPress (далее называем WP), но в начале рассматривали и другие варианты. Поясним наш выбор:

1С-Битрикс был одним из кандидатов в CMS для нового сайта, но мы его отсеяли. Причины: клиент не планировал делать интернет-магазин, также не было необходимости в интеграции с 1С. Разумеется, 1С-Битрикс подходит и для обычных сайтов, но с позиции рациональности он проигрывает из-за платных лицензий.

От Drupal мы отказались из-за отсутствия необходимости делать мультиязычный сайт и сложную архитектуру с гибкими ролями.

WordPress в данном случае отлично мог выполнить свою задачу и подходил по многим аспектам:

• Бесплатно. Клиент сильно устал при каждом действии на старом сайте видеть уведомление о том, что какой-то функционал является платным.
• Большое количество готовых решений. На WordPress реализовать можно практически любой функционал: деление на разделы, категории, дополнительные поля в любом месте и под любой тип информации.
• Масштабирование. Благодаря гибкости WordPress нет опасения упереться в технический потолок, при необходимости можно легко добавлять новые разделы, страницы, динамическую и статичную информацию и многое другое.

Настраиваем WordPress под нужды бизнеса

Чтобы далее было проще описывать проблемы и способы их решения, обзорно познакомимся с бизнесом клиента.

Основной продукцией являются:

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

Дополнительными услугами являются:

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

Проблема 1. Невозможность расширения ассортимента

В предыдущей CMS-системе существовало ограничение на количество страниц, которые можно добавить на сайт. Клиент в рамках своей деятельности хотел добавить на сайт новый тип продукции и “уперся” в это ограничение. Разумеется, данную особенность можно было бы обойти, сложив все товары на более общие страницы. Но желанием клиента также было и улучшение позиций сайта в поисковой выдаче. Исходя из этого, размещение нескольких разных товаров на одной странице было бы нерациональным и навредило бы SEO показателям.

На скриншоте из веб-архива представлен весь список страниц, которые можно было добавить на сайт в рамках тарифа клиента

Решение. Сущности под каждый тип товара и использование встроенного функционала WP

Сущности

Отталкиваясь от описанной проблемы, мы добавили возможность добавлять неограниченное количество страниц на сайте, используя сущности, которые образовали бы иерархию: товар — подкатегория — категория. На реальном примере выглядит так: деревянная обрешетка — деревянные ящики — деревянная тара.

В WP сущности называются типами записи. Существуют встроенные типы записей (страница (page) и запись (post)) и кастомные типы записи (custom post type). Кастомные типы записей создаются разработчиком. На сайте клиента мы использовали и встроенные типы (о них рассказываем ниже) и кастомные. В нашем случае кастомных типов записи 3: тара, столярные изделия, сад/огород.

Можно было использовать и встроенные типы записи, например, страницы (page). Но мы создали собственные по следующим причинам:

• Удобная работа в админке.
• Полный контроль над сущностями. Контроль позволяет добавлять информацию гибко (как для всех сущностей, так и для каких-то конкретных). Это позволяет не нагружать административную панель. Примеры добавления информации к конкретным товарам рассмотрим ниже.

В админке легко разобраться и удобно работать

Например, настройки общего списка товаров доступны для всех сущностей. Так как во всех сущностях отображение одинаковое, покажем только две из них:

Общие настройки для архивных страниц столярных изделий

Общие настройки для архивных страниц тары

Для изделий сущности "Тара" было необходимо указать особенности изготовленной продукции (ГОСТ, пригодность к экспорту и так далее). Мы внедрили такой функционал. Особенности можно указать только для товаров сущности "Тара", для товаров других сущностей этот функционал недоступен.

Дополнительные поля для указания особенностей

Для других сущностей такой возможности нет, отсутствует пункт

Использование встроенного функционала WP

Как уже упомянули в пункте выше, в WordPress есть встроенные типы записи. Их мы использовали для статичной информации на сайте, например, для служебных страниц "Контакты", "О компании". Также напоминаем, что клиент не только производит продукцию, но еще и оказывает связанные с производством услуги. Например, если вы заказали ящик для перевозки компьютера, то при желании можете сделать на нем гравировку с персонажем любимой игры. Для страниц таких дополнительных услуг мы тоже использовали встроенный тип записи.

Так выглядит общая страница услуг

Так выглядит страница конкретной дополнительной услуги — "Доставка"

Так выглядит страница конкретной дополнительной услуги — "Упаковка"

Проблема 2. Проблема загрузки новых товаров и изображений

Одной из основных проблем клиента с прошлым сайтом была сложность с загрузкой новых примеров изготовленной продукции. Проблема была не только в процессе загрузки примеров, но и в их отображении на сайте. Оно было хаотичным. Примеры товаров напоминали галерею фотографий в альбоме ВКонтакте. Грузить можно было только фото и описание в формате HTML.

Решение. Гибкое добавление примеров для каждого товара

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

Рассмотрим подробнее на примере одного товара — деревянной обрешетки.

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

Перейдя в товар, нужно нажать на кнопку "Добавить фотографию". Также есть функционал, позволяющий редактировать ранее загруженный пример. Его и рассмотрим более подробно. Чтобы изменить информацию, нажимаем на иконку карандаша в правом верхнем углу.

После нажатия открывается модальное окно с основной информацией о примере.

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

Загруженные через админку данные отображаются на странице сайта при обновлении

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

Проблема 3. Цены

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

Решение. Таблицы с ценами для всех товаров

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

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

Для каждого товара мы запросили популярные размеры исполнения и стоимость, создав “вилку” цен. Затем добавили возможность самостоятельного занесения цен в полях карточки конкретного товара и помогли с их занесением. В случае необходимости клиент может сам добавить новые цены на продукцию, заполнив поля в админке. Это гораздо удобнее, чем править HTML верстку.

В административной панели сайта цены заносятся в специальные поля

Если поля в админке заполнены, цены отображаются на сайте

Итого

Нашей основной целью переезда на WordPress была возможность расширять и улучшать сайт, чтобы добавление нового контента можно было поручить не разработчикам, а простым пользователям, менеджерам, специалистам. С этим мы справились: теперь для создания новой полезной (для пользователей и поисковиков) страницы нужно в дружелюбной админке просто кликнуть на кнопку "Новый товар", заполнить поля описания, прописать цены, загрузить фото примеров. Все! Полностью оформленная и информативная страница про новый товар готова. Можно ее рекламировать в директе, соцсетях или просто подождать, когда поисковики ее проиндексируют и появится органический трафик.

Кстати, о трафике. Если на старом сайте посетителей можно было считать по пальцам (к сожалению, метрика подключена не была, оперируем цифрами из старой cms), то новый сайт ежемесячно растет просто за счет большого количества полезных страниц.

На скрине посещаемость из поисковых систем без роботов с марта 2023 (установили счетчик) до августа 2024.