Лучшая стратегия поиска подходящего шаблона для редактирования?

Разработка
1

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

Я понимаю это так: независимо от того, делаю ли я это в области моей панели настройки или в отдельном репозитории GitHub, который буду использовать как тему, мне придётся:

  1. Найти правильный шаблон для редактирования.
  2. Воспроизвести весь шаблон там, где я выполняю кодирование (панель настройки, репозиторий и т. д.), и
  3. Внести желаемые изменения в шаблон.

Шаг 1 оказывается сложным. Как найти правильный шаблон для редактирования?

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

В качестве примера: допустим, я хочу добавить строку к каждому списку групп на странице индекса групп (аналог этой страницы). Где находится шаблон для этого? Мой лучший вариант — это шаблон карточки группы, но я не уверен, особенно потому что я только начинаю знакомство с Ember.

Есть ли более надёжный способ идентифицировать правильный шаблон?

2

Вы пробовали расширение браузера Ember?

Оно показывает шаблоны и компоненты:

image
image494×456 25.2 KB

3

Звучит отлично. Вы имеете в виду Ember Inspector?

4

Понял. Используя это, я не понимаю одного (вероятно, это связано с тем, что я новичок в Ember):

Если вы посмотрите на страницу групп Discourse, то у каждой записи группы есть название и количество пользователей.

С помощью инспектора Ember я вижу, что название берется из шаблона groups-info, но откуда берется group-user-count? (в инспекторе Ember, кажется, нет соответствующей записи)

5
6

Спасибо. Я вижу, что group-user-count находится на 55-й строке.

Получается, что если я захочу, например, добавить строку прямо перед строкой group-user-count, мне придется скопировать все 100 строк этого файла index.hbs в свой код и вставить их вот так:
<script type="text/x-handlebars" data-template-name="groups/index">
[100 строк здесь]
</script>

7
  • Обычно вы проверяете наличие подходящего места для плагина и используете его.
  • Вы можете попытаться найти элементы с помощью jQuery, но это не сработает, если вы пытаетесь изменить итеративный элемент.

Если вы не можете сделать ни то, ни другое:

  • обратитесь к команде Discourse с просьбой добавить место для плагина, предоставив обоснование;
  • замените весь шаблон своим собственным, как вы предлагаете.
8

Вы имеете в виду изменение кода в окружающих аутлетах? (например, components/group-info)

РЕДАКТИРОВАНИЕ: Извините, я перепутал шаблоны и плагин-аутлеты. Я понимаю, что плагин-аутлеты — это строки в коде Discourse (например, {{plugin-outlet name="topic-above-post-stream" args=(hash model=model)}), которые команда Discourse разместила там как якорь, который можно использовать для изменения кода.

9

РЕДАКТИРОВАНО: Переместил это продолжение сюда, так как это касается немного другой проблемы.