Баннеры уведомлений

[gormus (Osman Görmüş)]

	Краткое содержание	Тема-компонент «Notification Banners» предоставляет настраиваемый и гибкий способ публикации сообщений на вашем сайте.
	Предпросмотр	Theme Creator
	Репозиторий	https://github.com/gormus/discourse-notification-banners
	Руководство по установке	Как установить тему или компонент темы
	Новичок в темах Discourse?	Начинающее руководство по использованию тем Discourse

Установить этот компонент темы

Тема-компонент «Notification Banners» предоставляет настраиваемый и гибкий способ публикации сообщений на вашем сайте.

Вот некоторые ключевые возможности:

• Полная настраиваемость: Настройте каждый баннер в соответствии с вашими потребностями, включая содержимое, стиль и поведение.
• Гибкие варианты отображения: Отображайте баннеры в стеке или в виде вращающейся карусели для удобного просмотра.
• Целевые сообщения: Отображайте баннеры только для определенных групп пользователей, обеспечивая персонализированную коммуникацию.
• Поддержка тем: Баннеры автоматически адаптируются к светлой или темной теме, либо вы можете установить собственные цвета.
• Поддержка Markdown: Используйте Markdown для удобного форматирования сообщений в баннерах.
• Карусель на базе Splide: Функция карусели работает на основе библиотеки JavaScript Splide с индивидуальными настройками для каждого баннера.
• Планирование: Установите конкретные даты начала и окончания отображения баннеров.
• Простой порядок отображения: Контролируйте порядок отображения баннеров с помощью простых настроек.

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

Установка

1. Следуйте официальным инструкциям по добавлению этого компонента темы в вашу тему:
   https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966#add-theme-components-to-a-theme-9

2. Измените настройку theme authorized extensions, чтобы включить расширения файлов css и js.

Возможности

Каждый баннер уведомлений может иметь следующие функции:

• Заголовок (необязательно): Отображается как заголовок H2 над сообщением.
• Сообщение: Простое уведомление длиной до 500 символов. Поддерживается Markdown.
• Аудитория: Выберите группы пользователей в качестве аудитории для уведомления.
• Категории: Выберите категории, на которых будет отображаться баннер. Оставьте пустым для отображения во всех категориях.
• Цвет фона: Можно установить для различения баннеров друг от друга.
• Точка подключения плагина: Установите уведомления выше или ниже заголовка сайта или используйте точку подключения top-notices для отображения вместе с нативными баннерами тем.
• Отображение в карусели: При выборе все баннеры в каждой точке подключения отображаются в карусели. Требуется минимум 2 баннера, выбранных для любой точки подключения.
• Возможность закрытия: При выборе пользователи смогут закрыть баннер, и он будет скрыт для них.
• Даты начала и окончания: Если определены, видимость баннера подчиняется этим датам. Таким образом, вы можете установить баннер заранее, но он станет видимым для выбранной аудитории только в указанную дату и время; или аналогично вы можете автоматически удалить баннер по последней дате его отображения.
• Порядок отображения: Определите, какой баннер должен отображаться сверху, а какой — снизу. Начиная с версии 1.3.0, используются нативные кнопки перестановки.

Карусель

Функциональность слайд-шоу или карусели обеспечивается библиотекой Splide; она лицензирована по лицензии MIT.

Каждую карусель можно настроить на странице компонента темы с помощью опций Splide.

Цвета баннеров

По умолчанию баннеры используют те же цвета, что и баннеры тем:

.notification-banner {
    background: var(--tertiary-low);
    color: var(--primary);
}

Однако, если в настройках баннера определен цвет фона, в зависимости от его яркости автоматически выбирается черный или белый цвет для переднего плана.

Доступные CSS-классы

.notification-banners--above-site-header,
.notification-banners--below-site-header,
.notification-banners--top-notices {

  .notification-banner {

    &__wrapper {
    }

    &__close {
    }

    &__header {
    }

    &__content {
    }
  }

  &.splide {
    .notification-banner {
    }
  }
}

.notification-banners--top-notices {
  .notification-banner {

    &__content {
    }
  }
}

Версия 1.3.0 содержит критические изменения (для некоторых)

Не забудьте протестировать изменения и проверить свои настройки перед обновлением рабочих сайтов.

Notification Banners

I’ve been considering this idea to better target an audience using the Trust Levels: I think I have something for you all to check out. Though, I recommend testing this on a non-production environment first as it introduces a breaking change. To install this version, use the staging branch of Notification Banners: [Install the staging branch for testing the new feature] Breaking change When the banner visibility is evaluated using the Audience field values, all the trust_level_* roles of …

[nathank (Nathan Kershaw)]

Вау! Это выглядит потрясающе — и очень гибко.

Вы думали о возможности ограничить это одной или несколькими категориями?

[gormus (Osman Görmüş)]

Спасибо!

На самом деле я подумывал включить то, что я ранее делал с моим компонентом темы Списки отфильтрованных тем; см. раздел «Показывать на».

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

Но я с радостью включу это, если в этом возникнет необходимость.

[Lilly (Lillian)]

Очень приятно, @gormus, спасибо, что поделились этим компонентом с сообществом.

[gormus (Osman Görmüş)]

Спасибо, @Lilly, это для меня удовольствие : )

[toanvoc (Toan Nguyen)]

Когда я нажимаю кнопку «X», чтобы закрыть это всплывающее окно баннера, есть ли способ заставить его появиться снова? Я выбрал в настройках фона баннера значения: repeat; repeat-x; repeat-y, но это не работает?

[nathank (Nathan Kershaw)]

@Osman Görmüş

Но я с радостью включу это, если возникнет такая необходимость.

Отлично! Я попробую это в реальной жизни и посмотрю, действительно ли это нужно, прежде чем беспокоить вас по этому поводу.

[gormus (Osman Görmüş)]

@Тоан Нгуен

Когда я нажимаю кнопку X, чтобы закрыть это всплывающее окно баннера, есть ли способ снова его показать?

В данный момент нет. Я не предполагал, что кто-то захочет восстановить закрытое уведомление.
Как вы думаете, должна ли быть такая опция?

@Тоан Нгуен

Я выбрал для фона баннера значение repeat: repeat; repeat-x; repeat-y, но это не работает?

Не могли бы вы уточнить, что вы имеете в виду?

[toanvoc (Toan Nguyen)]

@Osman Görmüş

В настоящее время нет. Я не предполагал, что кто-то захочет восстановить отклонённое уведомление.
Как вы думаете, должна ли быть такая опция?

Понял, о чём вы, спасибо!

[ked (Kenny DuBose)]

@Osman Görmüş

Но я с радостью включу это, если в этом возникнет необходимость.

Меня также заинтересовала эта функция (доступная для определённой(-ых) категории(-й)). Спасибо за рассмотрение.

[gormus (Osman Görmüş)]

@Натан Кёршоу

Вы рассматривали возможность ограничения этого по категории или категориям?

@Кенни ДюБоз

Меня тоже заинтересовала бы эта функция (доступная для конкретных категорий).

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

Пожалуйста, дайте знать, что вы думаете : )

[hoangphuctran93 (Hoàng Phúc Trần)]

В данный момент моя страница Discourse работает на версии 3.4.0.beta3-dev, и при установке баннера возникает ошибка, из-за которой страница не отображается. Пожалуйста, проверьте это снова и предоставьте ранние обновления для сообщества. Спасибо за ваш вклад.

[gormus (Osman Görmüş)]

Привет, @hoangphuctran93,

Спасибо за сообщение об ошибке. Я смог подтвердить её с помощью чистой установки плагина Notification Banners на версии Discourse 3.4.0.beta3-dev (d3f09f8f61).

Я только что внёс исправление. Пожалуйста, обновите инстанс на вашем сайте и при необходимости выполните принудительное обновление страницы.

[hoangphuctran93 (Hoàng Phúc Trần)]

Спасибо, всё работает отлично. С нетерпением ждем ваших новых идей и обновлений. У меня есть следующие предложения:

1. Расширить поле ввода.
2. Добавить возможность быстрого выбора изображений помимо создания с помощью HTML.
3. Добавить поле данных для имени баннера, чтобы не использовать его вместе с заголовком; это поможет категоризировать и управлять баннерами, когда их несколько.

Вот результат применения на нашей странице Discourse.

[Beth]

@Osman Görmüş

Измените настройку разрешенные расширения тем, чтобы включить расширения файлов css и js.

У меня возникли проблемы с этой частью — ссылка здесь не работает. Как я могу разрешить эти расширения на своем сайте?

Спасибо!

[Moin]

Вам нужно заменить meta.discourse.org на URL вашего форума. Здесь вы не можете получить доступ к административной панели.
https://meta.discourse.org/admin/site_settings/category/files?filter=theme%20authorized%20extensions

Или вы можете перейти к настройкам вашего сайта и найти theme authorized extensions.

[Beth]

Ах да, спасибо

[Beth]

Ещё один вопрос: когда вы говорите о планировании, можно ли настроить появление баннера в одно и то же время каждую неделю? У нас есть еженедельные повторяющиеся часы приёма, и я хочу, чтобы этот баннер отображался в эти периоды, чтобы любой посетитель сайта мог увидеть, что часы приёма сейчас идут, и присоединиться, если захочет.

[gormus (Osman Görmüş)]

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

Таким образом, для каждого баннера можно задать только один график с датой и временем начала и окончания.

То, о чём вы спрашиваете, требует более сложной функции планирования, которую «Уведомительные баннеры» не предоставляют.

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

Настоятельно рекомендуем протестировать этот сценарий перед запуском в рабочей среде.

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

[Beth]

Спасибо за ваш отзыв!

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

Я также рассматривал плагин «Автоматизация» как альтернативный вариант, но автоматизация баннеров также поддерживает только действия в «конкретный момент времени», а не «повторяющиеся» действия.