Значки и точки уведомлений

Привлекайте внимание к отдельным пунктам меню небольшим текстовым значком (например, «New», «Hot») или простой точкой уведомления.

Компоненты пункта MenuX: текстовые значки, точка уведомления, кнопки призыва к действию и индикаторы выпадающего меню

Текстовые значки

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

  1. Откройте Menu Builder → Menu Structure.
  2. Нажмите на пункт меню, чтобы развернуть его параметры.
  3. Введите текст значка в поле Badge (например, New, Hot, Sale).
  4. При желании выберите цвет фона значка.
  5. Нажмите Сохранить меню.
ℹ️

Значки декоративны и помечены атрибутом aria-hidden, чтобы не загромождать восприятие для пользователей программ чтения с экрана. Текст лучше делать коротким — оптимально одно-два слова.

Точка уведомления

Точка уведомления — это маленький цветной кружок, прикреплённый к пункту меню. Она удобна, чтобы без текста сигнализировать о непрочитанной активности или новой возможности.

  1. В разделе Menu Builder → Menu Structure разверните пункт меню.
  2. Включите флажок 🔴 Dot.
  3. Нажмите Сохранить меню.
💡

Точка содержит скрытый текст для программ чтения с экрана, поэтому вспомогательные технологии по-прежнему сообщают, что у пункта есть уведомление.

Значки пунктов

Каждый пункт меню также может отображать иконку Font Awesome 6 перед своей подписью. При добавлении или редактировании пункта укажите класс иконки в поле иконки — например, fas fa-home или fas fa-cart-shopping.