필터링된 토픽 목록

[gormus (Osman Görmüş)]

	요약	필터를 사용하여 사용자 정의 주제 목록을 만들 수 있습니다. 생성된 목록은 선택된 플러그인 아웃렛에서 선택된 페이지에 표시할 수 있습니다.
	미리보기	Theme Creator
	저장소	https://github.com/gormus/discourse-filtered-topic-lists
	설치 가이드	테마 또는 테마 컴포넌트 설치 방법
	Discourse 테마 초보?	Discourse 테마 사용 입문가 가이드

이 테마 컴포넌트 설치

주제 필터를 사용하여 사용자 정의 주제 목록을 만들 수 있습니다. 목록은 선택된 페이지의 선택된 플러그인 아웃렛에 표시할 수 있습니다.

필요한 만큼 많은 수의 목록을 생성하고, 제목을 정의하며, 몇 개의 주제를 나열할지, 쿼리에 어떤 필터를 사용할지, 무엇보다도 어떤 페이지에 어디에 표시할지 설정할 수 있습니다.

실험적인 주제 목록 필터 기능과 지원되는 필터를 확인하세요:

토픽 목록 필터 기능

최근에 혁신적인 /filter 경로를 도입하여 주제 목록을 더 정교하게 필터링할 수 있게 되었습니다. 특히, 이는 검색과 필터링 모두를 위한 통합된 주제 필터링 언어로 나아가는 첫 번째 단계입니다. 또한, 주제 목록 필터링을 위한 전용 경로는 사이드바의 커스터마이징 기능을 향상시킵니다. 이제 사용자는 사이드바 내에 커스텀 섹션 링크로 링크를 포함시킬 수 있습니다. 작동 방식 /filter에는 사용자가 주제 목록을 필터링하기 위한 쿼리 문자열을 입력할 수 있는 입력 필드가 있습니다. 예를 들어, category:documentation tag:how-to+email은 Documentation 카테고리에 속하고 how-to 및 email 태그가 모두 지정된 주제를 필터링합니다. 현재 지원되는 필터 목록은 다음과 같습니다: status:open 닫히거나 아카이브되지 않은 주제 status:closed 닫힌 주제 status:public 읽기 제한이 없는 주제 (예: 보안 카테…

설정

• 제목: 선택 가능한 제목 텍스트입니다. 제공되면 주제 목록 위에 표시됩니다.

• 길이: 표시할 주제 수입니다.

• 쿼리: 목록을 필터링할 쿼리입니다.

• 플러그인 아웃렛: 큐레이션된 주제 목록은 다음 플러그인 아웃렛/리전에 배치할 수 있습니다:

  • below-site-header
  • above-main-container
  • before-topic-list
  • after-topic-list
  • topic-list-bottom
  • main-outlet-bottom
  • before-main-outlet

• 표시 위치: 목록을 표시할 페이지입니다.

  • everywhere: /admin 페이지를 제외한 모든 페이지에 표시합니다.
  • homepage
  • top_menu: 활성화된 페이지에 대한 상단 메뉴 설정을 확인하세요.
  • categories: /categories 페이지.
  • latest: /latest 페이지.
  • top
  • new
  • unread
  • read
  • posted
  • bookmarks
  • hot
  • selected_categories:
  • selected_tags

• 선택된 카테고리: 표시 위치 설정이 selected_categories로 설정되면 이 필드에서 선택된 카테고리가 사용됩니다. 주제 목록은 해당 카테고리 페이지에서만 표시됩니다.

• 선택된 태그: 표시 위치 설정이 selected_tags로 설정되면 이 필드에서 선택된 태그가 사용됩니다. 주제 목록은 해당 태그 페이지에서만 표시됩니다.

플러그인 아웃렛

사용 가능한 모든 플러그인 아웃렛은 주위 빨간 점선으로 표시되어 렌더링됩니다.

영감

Featured Lists 테마 컴포넌트에서 영감을 받았습니다. 하지만 결국 제 프로젝트에는 더 유연하고 주관적이지 않은 솔루션이 필요했습니다.

반드시 확인해 보세요:

추천 목록

Summary Create and feature custom topic lists Repository Manuel Kostka / Discourse / Components / Featured Lists · GitLab Install Guide How to install a theme or theme component New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component The component lets you filter custom topic lists and showcase them on your forum. Default look [image] Settings Editor [image] Stylin…

[Heliosurge (Dan DeMontmorency)]

This is pretty cool

Does it use the same targetable classes so you can style your component?

Could you add a couple of samples of custom lists in a couple of outlets?

Thanks

[gormus (Osman Görmüş)]

@Heliosurge

Does it use the same targetable classes so you can style your component?

Yes, the filtered topic list tables use the same CSS classes as the main topic-list table. Additionally, there are wrapping DIV elements with classes which would help you customize the topic-list tables in any plugin-outlet.

Below you can see the hierarchy, and note that the .topic-list is the default identifier for the TABLE element. You can also target specific plugin-outlet to apply different styles if you need; see the second code block;

.filtered-topics-list {
    &__wrapper {
    }

    &__header {
        h2 {
        }
    }

    &__content.topic-list {
    }
}

.filtered-topics-list {
    &.below-site-header,
    &.above-main-container,
    &.before-topic-list,
    &.after-topic-list,
    &.topic-list-bottom,
    &.main-outlet-bottom,
    &.before-main-outlet {

        &__wrapper {
        }

        &__header {
            h2 {
            }
        }

        &__content.topic-list {
        }
    }
}

@Heliosurge

Could you add a couple of samples of custom lists in a couple of outlets?

I don’t have a demo site to show you that, but I shared a screenshot displaying all available plugin-outlets with various filtered topic lists.

Please ignore the red dashed rules around them, I only added them to highlight tables, and the regions they are in.

[bekircem]

I’m using /latest as the homepage. I added latest topics from specific categories to my homepage with this component, but I want to remove the standard and infinite scrolling Discourse’s latest topic component. I did this with CSS, but it’s affecting other pages as well. Is it possible to target latest topics component with CSS selectors only the homepage?

[manuel (Manuel Kostka)]

I believe you need to query the route and add a custom class using javascript. Here’s an example you could follow:

https://gitlab.com/manuelkostka/discourse/helpers/css-classes/-/blob/main/javascripts/discourse/api-initializers/css-classes.js?ref_type=heads

[jrgong]

Found a bug (or expectded behaviour?):

setting Default List Filter: no subcategories in a category prevents any filtered topic lists to be displayed in any of the outlets.

Tested on latest stable 3.3.1.

[gormus (Osman Görmüş)]

Hi @jrgong could you share a screenshot of your preset?

[jrgong]

Sent you a PM with my preset

[jrgong]

One more question: What would be the best way to hide the core topic list when displaying the filtered list in a specific category?

The only way that I found via CSS, is to target the span tag, but it might trigger on different occasions:

span + table.topic-list.topic-thumbnails-grid {
  display: none;
}

[gormus (Osman Görmüş)]

@jrgong

setting Default List Filter: no subcategories in a category prevents any filtered topic lists to be displayed in any of the outlets.

Hi @jrgong I can confirm your findings.

Steps to reproduce:

1. Create a category and subcategory. i.e Top Level Category and Top Level Category > Sub Category
2. Edit Top Level Category settings (/c/top-level-category/edit/settings)
3. Under Appearance, find the Default List Filter setting.
4. Change the value from all topics to no subcategories
5. Configure a new preset in Filtered Topics Lists component to list its content on those both top level and sub categories;
   1. Set Show on = selected_categories
   2. Set Selected categories = Top Level Category, Sub Category
   3. Set Plugin Outlet = (any)
6. View each category pages

What is expected?

Both category pages to show the configured preset results on selected plugin outlet.

What is found?

1. Any category with Default List Filter = no subcategories setting, doesn’t show the Filtered Topics Lists; whether it has any subcategories or not.
2. However, if Show on = everywhere is set, the Filtered Topics List is displayed in selected outlet.

Similar issues:

Routing issue when adjusting topic list filters

There is currently a routing bug reproducible under fairly specific conditions: Prerequisites Category with a subcategory Default List Filter category setting should be “no subcategories” for the parent category Solved plugin installed show_filter_by_solved_status site setting enabled enable solved globally or at least for the involved categories Repro steps Change the solved/unsolved filter from the default of “all” to “solved” Change the subcategory filter from the default of “none”…

Events: If subcategories hidden, so is the events calendar

If you have an events_calendar_categories set in that category’s settings set Default List Filter to be no subcategories then the events calendar is not displayed. I discovered this when making a subcategory to house expired events (as an alternative to deleting them).

[MihirR (Mihir)]

When I add a custom field, let’s say a filter named X, with 10 recent topics, and when those 10 topics are scrolled through, and let’s say Latest starts and if one or more of those topics are still there, they get shown in both. Is there a way to hide them from the latest or the filter?

[agemo]

Great plugin functionality!

Q: Plugin Outlet : before-main-outlet

How do we get this to display, I don’t see it. Do I need to enable/disable something in the standard theme for it to inhabit the right side of the screen as per layton gfx?

[agemo]

Hmm I found it or at least spotted it briefly, as it is appearing at the bottom of the infinite scroll, not on the right side as anticipated or expected from the visual guide.

[Hyteller]

오브젝트 설정 편집기에서 설정을 저장한 후, 해당 컴포넌트의 관리자 페이지에서 페이지가 무한히 복제되었습니다.

[Moin]

브라우저 콘솔에 표시된 오류는 원인을 파악하는 데 도움이 될 수 있습니다.