Discourse Popular Tag Sidebar

This theme component displays a category’s most popular tags in a sticky sidebar on screens wider than 767px (most tablets and desktop devices).

:warning: You must enable the show filter by tag setting on your site for this theme component to work.

What can I do with this theme component?

  • Display 3-30 Popular tags in a sidebar for each category

  • Set the sidebar side to left or right

  • Prevent the sidebar from appearing in certain categories

  • Change the “Popular tags” header text

Custom CSS

Each sidebar is wrapped with a class that contains the category name, so for the UX category that would be .ux-sidebar. You can use these classes to style individual sidebars.

The html tag on pages with sidebars also has a class added so you can use html.custom-sidebar to apply styles on all pages that have a sidebar.

Install this theme component

43 лайка

Это сделало бы невероятно мощным инструментом навигации, если бы он показывал самые популярные элементы в каждой категории и на страницах тегов, и располагался бы в баннере или другом элементе в верхней части страницы.

3 лайка

Очень хорошая работа.

Я вижу боковую панель только на странице первой категории в списке категорий.

Как включить её для всех категорий?

1 лайк

Боковая панель тегов, отображаемая для родительской категории, включает теги как родительской, так и дочерних категорий. Чтобы включить её для всех категорий и подкатегорий, необходимо изменить код здесь: discourse-popular-tag-sidebar/desktop/header.html at master · awesomerobot/discourse-popular-tag-sidebar · GitHub.

2 лайка

Сейчас это отображается только для первой категории на странице категорий.

Так, какую часть кода мне нужно изменить и как сделать так, чтобы это работало на всех страницах?

Пожалуйста, помогите с подробностями. Извините и спасибо.

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

Она появляется только в первой категории списка категорий. Ни в какой другой. Пожалуйста, помогите.

2 лайка

Можно ли отобразить это над списком тем?

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

image

3 лайка

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

3 лайка

Да, у меня тоже эта проблема. Есть ли решение?

Я вижу, что сейчас это работает на страницах категорий. Но можно ли заставить это работать на странице «Последние темы»?

Можете описать эту проблему чуть подробнее? Боковая панель отображается только для одной категории и ни для какой другой?

Есть ли во всех категориях, которые вы проверяете, темы с более чем тремя тегами? Боковая панель не будет отображаться, если в конкретной категории меньше трёх тегов.

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

1 лайк

Вопрос.. когда я нажимаю на тег в боковой панели тегов, URL-адрес выглядит так: https://www.example.id/tags/c/sub-categoriy/Tags-name

Проблем нет, когда я кликаю напрямую (на той же странице), но если я нажимаю правой кнопкой мыши и открываю в новой вкладке, появляется сообщение: «Ой! Эта страница не существует или является приватной».

Почему формат URL не такой, как у обычных ссылок на теги: https://www.example.id/tags/tag-name?

Ещё один вопрос: как добавить пробел между текстом (тегом), не 1 или 1,5 (не уверен), а 2.

Спасибо большое.

1 лайк

Я добавил возможность опционально отображать боковую панель тегов на страницах верхнего меню (последние, популярные, новые и т. д.). По умолчанию она отключена; вы можете включить её в настройках компонента темы.

Это была моя ошибка: я не учёл подкатегории и не переработал URL для их поддержки. Проблема исправлена.

Такой URL показывает все теги во всех категориях. Однако, когда вы находитесь внутри категории и кликаете на тег в боковой панели, я хотел, чтобы вы видели этот тег в контексте текущей категории.

Я не совсем понял, что вы имеете в виду. Не могли бы вы привести конкретный пример?

1 лайк

Вау… теперь всё работает, когда я открываю это в новой вкладке. Большое спасибо…

Извините за мой плохой английский :grinning:

«Добавить пробел» означает изменить межстрочный интервал (как в MS Word) на 2, который сейчас выглядит как 1 или 1,5, чтобы между тегами было больше места.

Также могу ли я изменить цвет текста тегов? С синего на серый.

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

Когда я прокручиваю страницу вниз, надпись «Популярные теги» исчезает, виден только список тегов.

image

Ещё раз… Большое спасибо за вашу помощь.

О, понятно. Вы можете добавить немного CSS в свою тему (администрирование > настройка > темы), например:

.tag-sidebar a:nth-of-type(2) {
    margin-top: 5px;
}

Аналогично для цвета текста:

.tag-sidebar a {
    color: red;
}

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

.topic-list.with-sidebar > .tag-sidebar {
  top: 120px;
}

Все это общие изменения CSS… Если вы хотите внести больше изменений в стиль, подобных этим, рекомендую изучить несколько руководств по CSS. Введение в CSS | MDN — хорошее бесплатное руководство!

5 лайков

Привет, у меня возникли проблемы на строке 31: discourse-popular-tag-sidebar/desktop/header.html at master · awesomerobot/discourse-popular-tag-sidebar · GitHub

Можешь помочь проверить эту ошибку?

В чём причина ограничения в 30 тегов?

Привет, Крис!
Мне интересно, не утеряна ли опция number_of_tags в этом коммите? :thinking:

2 лайка

Было бы здорово, если бы максимальное количество тегов увеличили до 100 и отображали их в виде облака тегов с адаптивной высотой, отсортированного по алфавиту. Иными словами, чем популярнее тег, тем крупнее его шрифт. «Топ-100» тегов.

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

Здравствуйте,

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

Спасибо

1 лайк

К сожалению, этот компонент конфликтует с Discourse Tag Sidebars. При включении обоих я получаю все теги, сжатые в одну строку, вот так:

А боковые панели тегов вообще не отображаются.

Это досадно, ведь они должны дополнять друг друга: список тегов для просмотра «все теги» (и, возможно, также «нет тегов») и боковая панель для конкретных тегов. На самом деле, возможно, их можно объединить в один компонент?

1 лайк