수정할 올바른 템플릿을 찾는 가장 좋은 전략은?

개발
1

저는 아직 Discourse를 사용하는 데 익숙하지 않지만, 커스터마이징을 위해 Discourse 위에서 코딩하는 방법에 대해 더 배우고 있습니다. 특정 페이지의 특정 위치에 코드를 삽입하는 가장 좋은 방법(일반적인 아웃렛 영역보다 더 정밀한 위치)을 배우고 있습니다. 해당 위치를 제어하는 템플릿을 오버라이드해야 하는 것 같습니다.

이는 제가 커스터마이징 대시보드의 영역에서 하든, 테마로 사용할 별도의 GitHub 저장소에서 하든, 다음을 수행해야 함을 의미합니다:

  1. 수정할 올바른 템플릿 찾기
  2. 코딩을 수행하는 곳(대시보드, 저장소 등)에서 템플릿 전체를 다시 출력하고
  3. 템플릿에 원하는 변경 사항을 적용

1단계가 장벽이 되고 있습니다. 수정할 올바른 템플릿을 어떻게 찾나요?

제가 파악한 바로는, Discourse 템플릿은 여기에 있으며, 수정하려는 “실제” 템플릿은 일반적으로 여기의 components 파일 안에 있는 것 같습니다.

예를 들어, 그룹 인덱스 페이지(예: 이 페이지)의 각 그룹 목록에 한 줄을 추가하고 싶다고 가정해 보겠습니다. 그 템플릿은 어디에 있나요? 제 추측으로는 group card 템플릿일 것 같지만, 특히 Ember를 처음 접하는 상태이므로 확신이 서지 않습니다.

올바른 템플릿을 식별할 수 있는 더 확실한 방법이 있을까요?

2

Ember 브라우저 확장 프로그램을 사용해 보셨나요?

이 확장 프로그램은 템플릿과 컴포넌트를 표시합니다:

image
image494×456 25.2 KB

3

그거 정말 좋네요. Ember Inspector를 말씀하시는 건가요?

4

알겠습니다. 사용하면서 한 가지 이해가 안 되는 부분이 있습니다(에임버를 처음 사용해서 그런 것 같습니다):

디스코스의 그룹 페이지를 보면, 각 그룹 항목에는 이름과 사용자 수가 표시됩니다.

에임버 인스펙터를 사용하면 이름이 groups-info 템플릿에서 온다는 것을 알 수 있지만, 그룹 사용자 수는 어디서 오는 것일까요? (에임버 인스펙터에 해당 항목이 없는 것 같습니다)

5
6

감사합니다. 55번째 줄에 group-user-count가 표시되는 것을 확인했습니다.

이것이 내가, 예를 들어, group-user-count 줄 바로 위에 한 줄을 추가하고 싶다면 해당 index.hbs 파일의 전체 100줄을 내 코드로 복사해서 다음과 같이 삽입해야 한다는 뜻인가요?
<script type="text/x-handlebars" data-template-name="groups/index">
[여기에 100줄]
</script>

7
  • 일반적으로 적합한 플러그인 아웃렛이 있는지 확인한 후 이를 사용합니다.
  • jQuery로 요소를 대상으로 지정해 볼 수 있지만, 반복적인 요소를 변경하려는 경우 작동하지 않습니다.

위 두 가지 방법 모두 사용할 수 없는 경우:

  • 정당성을 제시하며 Discourse 팀에 플러그인 아웃렛 추가를 요청합니다.
  • 제안하신 대로 전체 템플릿을 자체 템플릿으로 교체합니다.
8

주변 아웃렛(예: components/group-info)의 코드를 변경하라는 뜻인가요?

수정: 죄송합니다. 템플릿과 플러그인 아웃렛을 혼동했습니다. 플러그인 아웃렛은 디스코urs 팀이 코드를 변경할 수 있는 앵커로 사용하도록 디스코urs 코드에 넣어둔 라인(예: {{plugin-outlet name="topic-above-post-stream" args=(hash model=model)})이라는 점을 이해했습니다.

9

수정: 이 후속 질문은 약간 다른 문제와 관련이 있어 여기로 옮겼습니다.