Случайный баннер

Фон

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

Как установить

:information_source: Краткое описание Добавляет баннер, случайно выбираемый из списка.
:hammer_and_wrench: Репозиторий GitHub - ScottMastro/discourse-randomized-banner: Randomized Discourse Banner Plugin · GitHub
:open_book: Руководство по установке Как установить плагины в Discourse


:down_arrow: ОБНОВИТЬ :down_arrow:


Параметры плагина

Изображения баннеров для случайного выбора включены в настройку banner images. Чтобы показать гостю (пользователю, не вошедшему в систему) уникальный статический баннер, добавьте его в настройку guest banner. Чтобы показать всем пользователям статический баннер, используйте настройку override banner.

Влияние на SEO

Поскольку случайная природа этого плагина делает баннер динамическим, наивная реализация может привести к тому, что случайный баннер будет загружен слишком поздно, что вызовет высокое значение Largest Contentful Paint (LCP) и может привести к Content Layout Shift (CLS).

Для LCP опция optimize lcp предварительно загружает баннер для гостей и замещающий баннер (если они существуют), чтобы они отображались быстрее. Случайные баннеры не предварительно загружаются, чтобы минимизировать загрузку неиспользуемых ресурсов. Важно держать размер файлов ваших баннеров небольшим, чтобы сократить время их загрузки.

ПРИМЕЧАНИЕ
Я поддерживаю уровень LCP на достаточном уровне на своём форуме, но стараюсь использовать баннеры размером менее 2 МБ и применяю CDN. Также я сделал баннер для гостей размером около 200 КБ. Однако я изменил реализацию плагина прямо перед написанием этого сообщения. LCP-проблем быть не должно, но гарантий нет. Я планирую отслеживать свой LCP. Пожалуйста, используйте с осторожностью.

Для CLS сдвиг контента предотвращается путём заранее определённого размера изображения в HTML. Заранее необходим параметр banner aspect ratio, чтобы отрисовать div, содержащий баннер. Поэтому все ваши случайные баннеры должны иметь примерно одинаковое соотношение сторон. Другие соотношения сторон будут учтены, но могут быть растянуты или сжаты.

11 лайков

Это отлично и, возможно, именно то, что я искал!

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

1 лайк

Это заполнит ширину на 100%, а параметр соотношения сторон определит высоту. Это необходимо для того, чтобы место под баннер могло быть зарезервировано ещё до его загрузки, чтобы страница не начинала внезапно сдвигаться.

Таким образом, вы можете изменить параметр соотношения сторон, чтобы уменьшить высоту.

2 лайка