Функция главной страницы

:discourse2: Сводка Homepage Feature отображает до 5 тем с изображениями на главной странице вашего сообщества.
:eyeglasses: Предпросмотр Предпросмотр в Discourse Theme Creator
:hammer_and_wrench: Ссылка на репозиторий https://github.com/discourse/discourse-homepage-feature-component
:open_book: Новичок в темах Discourse? Руководство для начинающих по использованию тем Discourse

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

Возможности

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

:iphone: Мобильные устройства и небольшие экраны

По умолчанию он будет скрывать темы, пока на мобильных устройствах не останется только одна.

Вы можете изменить это поведение по умолчанию, включив show all always (показывать все всегда). Это сделает компонент прокручиваемым по горизонтали на небольших экранах (< 1000 пикселей).
На самых маленьких экранах (< 600 пикселей) у вас есть возможность расположить темы в столбец, изменив настройку mobile style (мобильный стиль).

Настройки

Имя Описание
featured tag Установите тег(и), из которых будут выбираться темы. Темы, соответствующие любому из выбранных тегов, будут отображаться.
number of topics Отображать до 5 тем при максимальной ширине
max number of topics Максимальное количество тем. Если установлено выше, чем number of topics, отображаются стрелки для пролистывания тем.
pages loop Если включена пагинация (max number of topics > number of topics), прокрутка за последнюю страницу возвращает к первой.
hide featured tag Если включено (по умолчанию), теги, установленные выше, скрыты от обычных пользователей при просмотре тем. Сотрудники все еще могут их видеть.
show on Где отображается компонент: homepage, страницы top_menu (страницы, установленные в настройках верхнего меню сайта) или all страницы.
show for Кто видит компонент: everyone, только logged_in пользователи или только logged_out (анонимные) посетители.
make collapsible Сделать весь компонент сворачиваемым
show title отображает текст, установленный ниже (заголовок всегда отображается, когда включен make_collapsible)
title text текст для заголовка, если вы хотите локализовать его, используйте перевод featured_topic_title
sort by created отключите, чтобы сортировать по последним ответам
show all always По умолчанию количество отображаемых тем уменьшается с размером экрана, до 1 на мобильных устройствах. Включение этой настройки покажет все темы на любом размере экрана.
hide closed topics Скрыть закрытые темы из списка
always link to first post Всегда ссылаться на первый пост в теме, даже если он уже был прочитан
mobile style Если включен show_all_always, темы будут отображаться с горизонтальной прокруткой по умолчанию. Вы можете изменить это поведение на небольших экранах и выбрать расположение в столбец для экранов меньше 600 пикселей.
featured content position Расширенная разработка тем: это изменяет плагин-выход для компонента
featured image sizes Измененные варианты изображений (WIDTHxHEIGHT), доступные для тем. Браузер загружает самый маленький, который помещается в слот при текущем размере экрана и плотности пикселей, экономя трафик. Укажите несколько размеров, покрывающих стандартные и высококачественные экраны.
Перевод По умолчанию
featured_topic_title

:discourse2: Хостинг у нас? Компоненты темы доступны для использования в наших тарифах Pro, Business и Enterprise.

89 лайков

Ребята, это эпично! Огромное спасибо. Это было бы отличным дополнением к ядру.

1 лайк

«Избранные темы» в мобильной версии не должно быть во множественном числе.

3 лайка

Это замечательно. Хотя я уже использую компонент «Избранная тема», но и эта идея неплоха.

Есть предложение: а что если сделать этот компонент работающим также со ссылками, а не только с тегами? Возможно, тогда мы сможем связывать содержимое с категориями и/или разделом «Топ» (для обозначения трендов), на мой взгляд. С этим можно будет реализовать функцию «Трендовые темы» на главной странице, как это сделано на Reddit. Что вы думаете об этом, @awesomerobot?

Отличный компонент, спасибо! Небольшая просьба по улучшению: было бы здорово, если бы вы могли настраивать количество тем на десктопе и мобильных устройствах, а также отображать автора поста под изображением…

4 лайка

Я думаю, нужно добавить слайд для темы «судно», потому что на мобильных устройствах видна только одна тема.

Кнопка для темы «судно».

1 лайк

Возможно, у ваших тем нет изображения?

Отличный компонент! Он придает главной странице приятный вид. Можно ли показывать на мобильных устройствах также 3 темы? Возможно, с помощью слайдера? А также, можно ли отображать рекомендуемые темы по категориям?

3 лайка

Очень хороший компонент :+1:

Поддерживаю предложение добавить автора. Также было бы здорово:

  • сделать так, чтобы ссылка на изображение всегда вела на самый свежий пост (как в заголовке)
  • иметь возможность выбрать альтернативную раскладку, например вариант из одного из постов выше: новейшая тема слева, а более старые — справа, меньшего размера
  • скрывать заголовок компонента, если выбран пустой заголовок
  • реализовать горизонтальную прокрутку на мобильных устройствах (либо с помощью небольших иконок внизу, либо боковых стрелок), чтобы было доступно три или четыре темы
3 лайка

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

По какой-то причине карточки пользователей, похоже, не учитывают, что компонент увеличивает высоту страницы.

Вот скриншот из предпросмотра темы: когда я нажимаю на профиль пользователя, появляется карточка. Как видно, карточка пользователя, похоже, не знает о выделенных темах:

Я уже несколько раз пытался исправить это, но не понимаю, почему высота компонента не учитывается при расчёте позиционирования карточки пользователя.

Спасибо!

2 лайка

Я только что выпустил обновление, которое исправляет это.

Ранее реализованный мной подход мешал схлопыванию отступов, что приводило к ошибке в расчёте верхнего позиционирования карточек пользователей. Это кратко описано здесь: Mastering margin collapsing - CSS | MDN. Проблема была связана с пунктом «Нет контента, разделяющего родительский элемент и его потомков».

9 лайков

Отличное дополнение к теме!

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

Привет, @awesomerobot! Этот компонент темы просто потрясающий. Однако я хотел бы узнать, возможно ли сделать так, чтобы в мобильной версии отображался не один элемент, а слайдер из трёх рекомендуемых тем, которые видны на главной странице. Мне кажется, это придаст главной странице отличный вид. Также было бы здорово, если бы можно было добавлять рекомендуемые темы на каждую страницу категории. Надеюсь, вы сможете дать обратную связь, и большое спасибо за эту работу!

3 лайка

Мне удалось применить несколько трюков с CSS, и теперь на мобильном устройстве можно прокручивать! Но только по вертикали. Не знаю, как сделать горизонтальную прокрутку :smiley:

1 лайк

Отличный компонент!
Единственный нюанс: на моём форуме в мобильной версии под основным контентом слишком много свободного пространства.

Подскажите, можно ли это как-то исправить или хотя бы отключить это отображение в мобильной версии?
Спасибо!

2 лайка

Спасибо, это очень приятно.
Можно ли сделать так, чтобы на мобильном отображалось 3 элемента в режиме слайдера?

Ещё одна крутая функция: если вы заходите в категорию или тег, можно фильтровать ваши «избранные» теги и показывать их конкретно для этого тега или категории.

В любом случае это действительно здорово. Спасибо.

1 лайк

Это странно, у меня с моей стороны такого большого пространства не видно… возможно, у вас установлены другие темы, которые могут быть причиной этого? (кстати, в качестве примечания: это похоже на десктопный вид на мобильном устройстве, а не на мобильный вид)

Вот мой тест без включения других тем:

1 лайк

Здравствуйте,
Вчера у трёх постов отлично отображались миниатюры (два из них не содержали изображений, а были связаны с видео на YouTube). Система успешно извлекла миниатюры, и всё работало корректно.

Сегодня внезапно миниатюры перестали отображаться для двух постов с видео на YouTube. Известна ли какая-либо проблема в этой связи?

https://www.tournamust.com/

Мне не известно о каких-либо проблемах, но я не тестировал этот компонент с встроенным видео. Я посмотрю и проверю, нет ли чего-то очевидного.