Версия 2023−6

Виджеты

Начнём с простого — виджеты. Создано 2 новых:

Ссылки на соц. сети

Поддерживает 23 популярных соц. сети, мессенджера, сервиса.

Настраивается размер и фон иконок.

Номер телефона

Поддерживает телефон любой страны, опционально умеет открывать произвольное окно (например, заказ звонка), номер кликабелен.

Карта

Конверсионная кнопка / ссылка

Раньше все кнопки были одинаковые и довольно большие.

Теперь размер настраивается: помимо привычного большого добавился ещё средний и маленький.

Навигационная панель

• Подчёркивание ссылок стало более прозрачным — меньше визуального шума.
• Основная навигация — это ссылки на страницы сайта. Помимо неё есть дополнительная навигация по секциям текущей страницы. Чтобы легче отличать их, навигация по секциям теперь ещё больше визуально отличается от основной.
• Виджет телефона поддерживает код любой страны.
• Закрыто 7 багов, внутри многое переделано.

Режим сверху

• Все элементы теперь вертикально оцентрированы.
• Конверсионная кнопка всегда в крайней правой позиции.
• Ссылки на соц. сети всегда выводятся, если заполнены.
• Изменена вёрстка, что улучшило производительность и закрыло сразу все баги прилипания и отступов.

Мобильная панелька

• Появился логотип!
• Используется то же фоновое изображение, что у основной панели.
• Виджет телефона: дополнительная ссылка, открывающая окно, не показывается.

Секции «Товары» и «Страницы»

Фотки проще и красивее

У разных товаров и страниц могут быть фотографии разных пропорций. Некрасиво, когда в одной секции выводятся несколько товаров с разными фотками: одна вертикальная, вторая горизонтальная, третья, четвёртая, другая — всё прыгает. Больше нет.

Можно было просто поставить одинаковые пропорции всем фотографиям. Сделали интереснее — секция смотрит на каждую строку товаров отдельно и одинаковые пропорции фоткам ставит только в пределах одной строки.

Загружать любые фотки, не думая о пропорциях и чтобы само всё красиво — гораздо приятнее =)

Цены, кнопки корзины

• Кнопка раньше всегда добавляла товары в коризну. Теперь умеет сразу октрывать окно корзины (купить в 1 клик).
• Чем больше колонок в секции — тем меньше размер кнопок и цен. Товары в 4 или даже 6 колонок теперь смотрятся вполне неплохо.
• Дополнительно кнопки и цены адаптируются под мобильники: уже экран — меньше кнопки.

Контексты
мультиязычность и не только

Раньше страницы сайта жили сами по себе, теперь над ними добавились контексты.
К примеру, нам нужен мультиязычный сайт: RU, EN, GE. Тогда каждый язык — это отдельный контекст.

• Внутри каждого контекста произвольная структура страниц. По сути, вы можете сделать несколько разных сайтов под каждый язык в рамках одного. Страницы могут присутствовать на одном языке и отсутствовать в другом.
• Навигация по сайту зависит от контекста, а сам контекст меняется отдельным переключаетелем рядом с логотипом (если контекст всего 1, переключатель не показывается).
• Контекст добавляет в адреса страниц дополнительную вложенность (например, cubona.com/en/releases).
• Не имеет собственной отдельной страницы, вместо неё открывается первая дочерняя страница контекста.
• Один из контекстов назначается главным. Он не добавляет дополнительную вложенность в адреса страниц и используется по-умолчанию.

Контексты могут использоваться не только для мультиязычности. К примеру, у вас оффлайн-бизнес с филиалами в Москве, Челябинске и Краснодаре. У каждого филиала свои контакты, адрес, сотрудники и т. п. Просто заводим контекст под каждый филиал и всё, рядом с логотипом будет переключатель городов.

Прочее

Ильяс, основатель Cubona 💙