Админ-панели для Laravel: минимум ограничений, максимум возможностей
Почему админки коробочных CMS проигрывают по функционалу кастомным решениям в е-коммерс-проектах
Админ-панели для Laravel: минимум ограничений, максимум возможностей
Почему админки коробочных CMS проигрывают по функционалу кастомным решениям в е-коммерс-проектах
Когда создаешь плюс-минус типовой проект, не думаешь о том, что спустя несколько лет потребуются хитрые акции, кастомизируемые попапы или шустрые привязки товаров друг к другу. Поэтому особенно и не смотришь в сторону фреймворков — ведь условный Битрикс давно учел базовые популярные сценарии.
С годами проект масштабируется, и его в итоге приходится переделывать заново (таков уж путь каждого сайта). Но редкий заказчик готов расставаться с привычной CMS, потому что та «удобная», «привычная» и «понятная». А зря: ведь очень многие кастомные и нестандартные «хотелки» и бизнес-потребности реализовывать при таком подходе сложнее, дольше и — в итоге — дороже.
Да, проект на фреймворке, в том числе на Ларавел, может пугать своей неизвестностью. Но если учесть, что внутри его админки можно сделать что угодно и как угодно, то можно получить и абсолютно «битриксовые» фишки, и другие необычные возможности, которые никакой CMS и не снились.
Да, проект на фреймворке, в том числе на Ларавел, может пугать своей неизвестностью. Но если учесть, что внутри его админки можно сделать что угодно и как угодно, то можно получить и абсолютно «битриксовые» фишки, и другие необычные возможности, которые никакой CMS и не снились.
Вот лишь несколько реализованных нами проектов на Laravel
Ниже расскажем и покажем на примерах, в чем особенности админ-панелей на фреймворках.
Максимально точная настройка ролей
Хочется, чтобы менеджер мог только просматривать товары или только редактировать подборки товаров в конкретной категории? Пожалуйста. Доступы через админ-панель можно настроить максимально гибко и прицельно.
Частая история на проектах, когда базовых ролей в админ-панели три: админ, менеджер и контент-менеджер. Но совсем нечастая, когда правами доступа можно управлять по 100500 параметрам — максимально гибкие настройки в Laravel-админке помогают заказчику распределять права доступа между сотрудниками, не переживая, что кто-то из них сделает что-то не то.
Частая история на проектах, когда базовых ролей в админ-панели три: админ, менеджер и контент-менеджер. Но совсем нечастая, когда правами доступа можно управлять по 100500 параметрам — максимально гибкие настройки в Laravel-админке помогают заказчику распределять права доступа между сотрудниками, не переживая, что кто-то из них сделает что-то не то.
Настройка прав доступа внутри админ-панели на одном из проектов
Переход на публичную страницу из админки (и наоборот)
Ну как было раньше: несчастный админ должен был на одной вкладке заполнять контент на странице, а чтобы его просмотреть, ему приходилось вручную искать ее на сайте и постоянно обновлять, чтобы увидеть изменения. При этом непроверенную страницу мог увидеть и любой посетитель сайта. Но есть решение гораздо проще: добавить в админку кнопку «Перейти на страницу».
Фишка в том, что с помощью этой кнопки можно применить изменения и посмотреть, как они будут выглядеть ДО публикации — это удобно для контент-менеджера и безопасно с точки зрения изменений контента: никакие «тестовые» или «сырые» данные случайно не попадут на глаза пользователям.
Фишка в том, что с помощью этой кнопки можно применить изменения и посмотреть, как они будут выглядеть ДО публикации — это удобно для контент-менеджера и безопасно с точки зрения изменений контента: никакие «тестовые» или «сырые» данные случайно не попадут на глаза пользователям.
Кнопка «перейти на страницу» в админ-панели одного из проектов
Еще удобнее, если в режиме админа можно и со страницы сайта быстро перейти к редактированию контента на ней в один клик.
Переход со страницы сайта в админ-панель в один клик на одном из проектов
Типично «битриксовые» возможности
Боитесь, что админ-панель проекта на Ларавель будет непривычной и неудобной? Не стоит: ведь внутри можно сделать максимально типичный функционал, который будет удобен даже самому «забитриксованному» админу. Например:
Привычные кнопки «Сохранить» и «Применить»
Не ломают логику для админов, привыкших к функционалу Битрикса: можно реализовать на каждой странице, если это необходимо.
Привычно-битриксовые кнопки в админ-панели одного из проектов
Привязка товаров к акциям
Подобный функционал можно реализовать максимально привычно, «как в Битриксе»: при добавлении открывается отдельное окно, где можно найти нужный элемент. Для быстроты поиска товара есть фильтры (например, по названию, артикулу или ID товара). В результате на странице появляются товары, которые участвуют в конкретной акции.
Привязка товаров, участвующих в акции
Как товары из акции выглядят на сайте
Генерация символьного кода из названия товара
Если для клиента такая реализация привычна — сделаем: как только контент-менеджер вводит название при создании товара, автоматически создается символьный код на латинице. При желании его можно отредактировать.
Автоматическое создание символьного кода в админ-панели
Импорт товаров и остатков
Сейчас чаще встречается интеграция с 1С, чтобы забирать данные по товарам оттуда. Но на одном из проектов по запросу заказчика мы сделали возможность загрузки данных из файла. Для менеджеров это максимально удобная фича: они могут импортировать товары и цены по артикулам или по штрихкодам, не подтягивая данные из 1С, а просто загружая файл с товарами в админ-панели.
Импорт товаров внутри админ-панели
Импорт остатков внутри админ-панели
Возможности каталога
Почему многие так держатся за админку привычной CMS? Потому что приходится много работать с товарами в каталоге, а это удобнее делать в «объезженном» интерфейсе. Но практика показывает, что админка для Laravel бывает не менее классной (а порой и в разы лучше).
Удобное отображение списка товаров с быстрым переключением по категориям
Можно комфортно редактировать как сами категории, так и товары внутри каждой из них.
Удобные категории товаров в каталоге внутри админ-панели
Привязка сопутствующих товаров по артикулам
В е-коме часто бывает, что на странице конкретного товара нужно вывести другие товары каталога:
Чтобы контент-менеджерам было легко и удобно добавлять такие товары, в админке можно предусмотреть привязку по артикулу: достаточно ввести его в специальном поле, и необходимый товар автоматически будет выводиться в нужном разделе на странице.
- товары из комплекта (кофта + брюки, краситель + оксид, сыворотка + крем и так далее);
- аксессуары (к пальто — шарфы, шапки, броши, к краске для волос — перчатки, кисточки, чашки для замешивания, а к швейной машине — дополнительные лапки, наборы игл и катушки);
- рекомендуемые товары (к кофте — пальто, джинсы и кроссовки, к швейной машине — чехол, набор катушек, сумка).
Чтобы контент-менеджерам было легко и удобно добавлять такие товары, в админке можно предусмотреть привязку по артикулу: достаточно ввести его в специальном поле, и необходимый товар автоматически будет выводиться в нужном разделе на странице.
Удобная привязка товаров по артикулу
А вот как привязанные товары выглядят на сайте
Удобство в том, что под полем ввода артикулов сразу показываются товары, которые делятся на найденные, ненайденные (ошибка в артикуле) и неактивные (те, что уже заведены в админ-панели, но по какой-то причине не выводятся пользователю) — так контент-менеджер сразу видит состояние товара, что снижает возможность ошибки.
Найденные товары при этом можно упорядочивать в списке, просто перетаскивая их между собой с помощью Drag’n’Drop — на публичной странице они будут выводиться в выбранном порядке.
Найденные товары при этом можно упорядочивать в списке, просто перетаскивая их между собой с помощью Drag’n’Drop — на публичной странице они будут выводиться в выбранном порядке.
Редактирование товаров «пачкой»
Поменять цены для десятка товаров в админ-панели — звучит довольно утомительно. Но есть выход: реализовать возможность редактирования сразу нескольких выбранных товаров. Тогда контент-менеджеру не придется заходить на страницу каждого товара в админке, что существенно сэкономит его силы, нервы и время.
Редактирование товаров «пачкой» в админ-панели
Маркетинговые возможности
Да, у Битрикса их придумана целая пачка. Но когда дело доходит до сложносочиненных акций заказчика, где стандартных возможностей не хватает — приходится все равно разрабатывать логику с нуля. На Laravel в админке сразу можно создать что угодно и «как надо» — без попыток «адаптировать, что есть». Как правило, это экономит время и деньги. Например:
Кастомизированные баннеры
Баннеры на сайтах в е-коме — всегда немножечко проблема: когда проект только зарелизился, всё выглядит красиво. Но потом приходят маркетологи, и через полгода-год сайт уже не узнать: на баннерах появляются какие-то совсем другие цвета, шрифты и отступы, и визуально проект теряет привлекательность.
Чтобы такого не происходило, на проекте «Первый швейный» мы предусмотрели конструктор баннеров и акций. Внутри можно настроить (в рамках единой дизайн-концепции сайта, естественно):
При предпросмотре админ может сразу видеть, как баннер в созданной им конфигурации будет выглядеть в разных частях сайта: в шапке, в списке статей, в каталоге. Для акций — всё аналогично.
Чтобы такого не происходило, на проекте «Первый швейный» мы предусмотрели конструктор баннеров и акций. Внутри можно настроить (в рамках единой дизайн-концепции сайта, естественно):
- заголовок и описание;
- текст и ссылка кнопки;
- фоновые цвета кнопок;
- цвет текста;
- фоновый цвет самого баннера;
- подложку с паттерном и ее расположение на баннере (в центре или по краям);
- фоновое изображение.
При предпросмотре админ может сразу видеть, как баннер в созданной им конфигурации будет выглядеть в разных частях сайта: в шапке, в списке статей, в каталоге. Для акций — всё аналогично.
Предпросмотр баннеров на сайте из админки проекта «Первый швейный»
Конструктор попапов
На проекте Beecolor заказчик попросил сделать возможность выводить пользователям попапы с акциями: например, «- 30% на первый заказ». Чтобы админ мог легко создать такой баннер, мы предусмотрели конструктор. Внутри можно указать:
Кроме этого можно указать тип клиента, для которого будет показываться эта акция, период ее действия (с такого-то числа и времени до такого-то), регион и направление бизнеса (у заказчика их несколько). Каждая такая акция связана с Яндекс Метрикой, и на вкладке статистики можно просмотреть показатели.
- название и описание акции;
- цвета текста и фона;
- таймер обратного отсчета;
- текст и действие для кнопки (закрыть, закрыть и перейти на страницу акции и т. д.);
- изображение (с учетом разрешения устройства пользователя).
Кроме этого можно указать тип клиента, для которого будет показываться эта акция, период ее действия (с такого-то числа и времени до такого-то), регион и направление бизнеса (у заказчика их несколько). Каждая такая акция связана с Яндекс Метрикой, и на вкладке статистики можно просмотреть показатели.
Настройка визуала попапа в админ-панели сайта Beecolor
Статистика по акции в админ-панели сайта Beecolor
Как попап с акцией выглядит на сайте Beecolor
Привязка товаров через пины
Актуальная фишка для промобаннеров: можно добавлять на изображения пины с привязкой конкретных товаров, по клику на которые пользователь перейдет на детальную страницу. Главное удобство в том, что не нужно математически высчитывать в пикселях положение пина на изображении — достаточно переместить пин в нужное место на миниатюре изображения внутри админ-панели.
Настройка пинов в промоблоке на сайте проекта «Первый швейный»
Как настроенные пины в промоблоке выглядят на сайте
«Конструктор» акций
Акции в е-коммерс-проектах — почти всегда сложный многогранный механизм, которым как-то нужно управлять изнутри. Для удобства внутри админ-панели можно создать настоящий «конструктор», который сможет учитывать какие угодно условия и параметры.
Например, на одном из проектов при настройке акций внутри админ-панели мы сделали две большие составляющие: условие и эффекты. Условия — это даты, суммы заказа, на что именно применяется акция (отдельный товар, раздел, линейка и т. д.) и другие параметры. Их можно миксовать между собой и прописывать логику через И/ИЛИ. Эффекты — это либо скидки, либо подарки к заказу. И для каждого эффекта также свои настройки. Такая система дает заказчику максимально гибкие возможности для создания самых разнообразных акций.
Например, на одном из проектов при настройке акций внутри админ-панели мы сделали две большие составляющие: условие и эффекты. Условия — это даты, суммы заказа, на что именно применяется акция (отдельный товар, раздел, линейка и т. д.) и другие параметры. Их можно миксовать между собой и прописывать логику через И/ИЛИ. Эффекты — это либо скидки, либо подарки к заказу. И для каждого эффекта также свои настройки. Такая система дает заказчику максимально гибкие возможности для создания самых разнообразных акций.
Промокоды: настройка «пакетом» и статистика
Промокоды — частая история в е-коме, поэтому их настройка должна быть простой, понятной и максимально удобной. Но чтобы оценить эффект от их внедрения, гибких настроек недостаточно — нужна статистика. И ее легко можно добавить в админ-панель.
Статистика по применению промокода
Создание пакета промокодов на одном из проектов
Подарочные сертификаты
Подарочные сертификаты — также довольно частая история в е-коме, но их реализация — почти всегда задача «на подумать». Сам сертификат чаще всего представляет собой специальный промокод, но если считать его за фундамент, сверху получается еще минимум десяток этажей: хочется и выбор номинала, и настройку дизайна, и отправку подарка получателю прямо с сайта, и возможность расходовать средства частями. Так, на одном из проектов мы предусмотрели в админ-панели автоматическую генерацию номеров и кодов для сертификатов.
Генерация кодов для подарочных сертификатов
Создание триггерных рассылок
На одном из проектов под запрос заказчика мы создали максимально гибкий редактор для создания триггерных рассылок — фактически это маленький личный кабинет сервиса рассылок а-ля Unisender внутри админ-панели. Рассылки нужны, чтобы и покупатели, и администраторы сайта были максимально осведомлены обо всех событиях: от регистрации и обновления пароля до входа в систему и отмены заказа.
Внутри редактора можно настраивать триггеры, выбирать типы событий, условия отправки, указывать тему письма и даже редактировать текст самого письма.
Внутри редактора можно настраивать триггеры, выбирать типы событий, условия отправки, указывать тему письма и даже редактировать текст самого письма.
Настройка триггерных событий для рассылок в админке «Первого швейного»
Продвинутый редактор текстовых страниц
Для максимально разнообразного контента на текстовых страницах можно добавить к базовым возможностям редактора (заголовки разных уровней, маркированные и нумерованные списки, цитаты) дополнительные удобные фишки:
А контент-менеджера можно порадовать загрузкой изображений с рабочего стола (в админ-панели Битрикса, например, такой номер не прокатит: изображение придется сначала загрузить в отдельную папку внутри админки, и только потом ее там выбрать и вставить в нужное место на текстовой странице).
Итого — порядка 30 компонентов, которыми заказчик может легко управлять и самостоятельно создавать максимально кастомизированные страницы под свой запрос.
- спойлеры: разворачивающиеся по клику блоки текста;
- таблицы;
- аккордеоны: например, для блока «часто задаваемые вопросы»;
- табы с выводом разного контента на каждом;
- содержание страницы (когда все заголовки собираются в оглавление, в котором можно быстро переключаться между разделами);
- привязку к родительской странице.
А контент-менеджера можно порадовать загрузкой изображений с рабочего стола (в админ-панели Битрикса, например, такой номер не прокатит: изображение придется сначала загрузить в отдельную папку внутри админки, и только потом ее там выбрать и вставить в нужное место на текстовой странице).
Итого — порядка 30 компонентов, которыми заказчик может легко управлять и самостоятельно создавать максимально кастомизированные страницы под свой запрос.
Часть настроек внутри редактора типовых текстовых страниц на одном из проектов
Возможности поисковой оптимизации
SEO-настройки и шаблоны
Если это необходимо, то вообще для каждой страницы можно задать необходимые SEO-настройки. Кроме того, можно предусмотреть SEO-шаблоны, которые применяются на конкретных категориях каталога, чтобы не прописывать вручную SEO-настройки для каждой детальной страницы товара в этом разделе.
SEO-шаблоны в админ-панели одного из проектов
Редиректы внутри админ-панели
Чтобы при переезде на новый сайт не потерять SEO-ценность старых страниц, обычно настраивают редиректы. Они автоматически переводят пользователя со старой ссылки на соответствующую страницу нового сайта — например, если он найдет ее в поиске, закладках или на другом сайте.
Классически редиректы для каждой страницы делаются вручную в коде: это долго и не очень продуктивно. Но процесс можно существенно упростить, если добавить возможность указывать редиректы сразу в админ-панели.
Классически редиректы для каждой страницы делаются вручную в коде: это долго и не очень продуктивно. Но процесс можно существенно упростить, если добавить возможность указывать редиректы сразу в админ-панели.
Настройка редиректов внутри админ-панели
Статистические данные
Иногда заказчикам крайне важно отслеживать бизнес-показатели. Чтобы оценивать их быстро и удобно, можно добавить в админ-панель кастомизацию данных, наглядную статистику или формирование отчетов (а можно и всё вместе, если потребуется).
Кастомизация вывода данных
Актуально, если на странице слишком много столбцов с параметрами, и не всегда нужно просматривать их все (например, в списке заказов). Можно дать пользователям админки выбор, какие параметры выводить в списке, а какие — нет. Это существенно экономит время и упрощает аналитику.
Выбор столбцов в админ-панели на одном из проектов
Вывод статистики по нужным параметрам
Теоретически в админке можно вывести какую угодно статистику под запрос заказчика. Например, на одном из проектов мы добавили дашборд с данными по заполнению форм на сайте.
Вывод графика со статистикой в админ-панели на одном из проектов
Когда стандартная админка CMS — всё-таки окей?
Если совсем коротко — тогда, когда у вас корпоративный сайт или е-ком, который вы не планируете масштабировать (что даже в теории звучит фантастически). Для базового функционала тот же Битрикс — отличный рабочий инструмент. Но увы, редкий интернет-магазин готов ограничиваться этой «базой».
В заключение
Чтобы иметь под рукой классные маркетинговые инструменты и знакомый функционал внутри админ-панели е-ком проекта, совсем необязательно быть верным одной CMS до гроба. Практика показывает, что в админ-панелях на Laravel можно реализовать как самые популярные фишки, так и максимально кастомные запросы заказчиков: от конструкторов промоакций до вывода статистики чего угодно.
Причем, это можно сделать красиво, удобно и часто дешевле, чем в очередной раз пытаться подогнать напильником под свои задачи хоть и популярную, но все-таки довольно неповоротливую систему управления контентом, которой многие пользуются просто по привычке.
Так что если вы устали от ограничений — велкам: мы обсудим ваши задачи и создадим сайт с админкой, которая закроет 100% бизнес-потребностей.
Причем, это можно сделать красиво, удобно и часто дешевле, чем в очередной раз пытаться подогнать напильником под свои задачи хоть и популярную, но все-таки довольно неповоротливую систему управления контентом, которой многие пользуются просто по привычке.
Так что если вы устали от ограничений — велкам: мы обсудим ваши задачи и создадим сайт с админкой, которая закроет 100% бизнес-потребностей.
