Можете ли вы опубликовать ссылку на ваш сайт? Я подозреваю, что проблема вызвана стилями вашей темы.
2 лайка
Вот моя ссылка:
https://whois.nhachinhchu.org/t/bang-gia-xem-data-nha-chinh-chu/63389
1 лайк
Извините за прерывание текущей дискуссии. Нашёл что-то, в чём не уверен, было ли это уже сообщено.
Если в заголовке есть ссылка, то в оглавлении также отображается количество кликов:
2 лайка
После этого обновления я наблюдаю ошибку на страницах discourse-docs, где есть оглавление. Например, на этой странице на Meta оглавление не отображается, и в инструментах разработчика браузера я вижу ошибку:
На моём сайте также появляется баннер в верхней части страницы с сообщением: «Возможно, сообщения отображаются некорректно, так как один из декораторов содержимого сообщений на вашем сайте вызвал ошибку. Для получения дополнительной информации проверьте инструменты разработчика браузера».
3 лайка
Спасибо @simonk, я только что (2 минуты назад!) объединил исправление для этой проблемы. Пожалуйста, обновите компонент на вашем сайте и дайте знать, если баннер на вашем собственном сайте продолжает отображаться.
3 лайка
Спасибо за ответ! Ошибка исчезла, но оглавление (ToC) не отображается в версии страницы для discourse-docs. До вчерашнего обновления оглавление отображалось как в версии для discourse-docs, так и в «обычной» версии.
(Для меня это не срочно — я развернул обновление на тестовом сайте, а не на рабочем, так что то, что оно работает некорректно, не имеет значения)
Редактирование: Я использую версию 2.8.0.beta11 (42c71789f9), если это имеет какое-либо значение.
2 лайка
Да, я понимаю, что вы имеете в виду. К сожалению, мои изменения в оглавлении используют выходной порт в представлении темы, которого нет в документации. Разберусь с этим.
3 лайка
Сегодня внес ещё несколько изменений в компонент, они должны устранить проблемы, поднятые @mentalstring и @simonk. В твоём случае, Саймон, потребуется полная пересборка, так как нужно также обновить плагин документации.
@thaidb, скорее всего, твоя проблема будет решена после обновления компонента.
4 лайка
Огромное спасибо, я так счастлив, моя проблема решена. Спасибо ещё раз.
1 лайк
После полной пересборки я могу подтвердить, что оглавление (ToC) корректно отображается на странице discourse-docs — большое спасибо 
Я вижу, что вы также ограничили оглавление двумя уровнями. Учитывая горизонтальное пространство, это кажется разумным, однако это означает, что заголовки третьего уровня в оглавлении отображаются на том же уровне вложенности, что и их родительские заголовки.
То есть в данный момент этот текст:
# Первый заголовок
## Первый подзаголовок
### Дочерний элемент первого подзаголовка
### Дочерний элемент первого подзаголовка
## Второй подзаголовок
### Дочерний элемент второго подзаголовка
### Дочерний элемент второго подзаголовка
# Второй заголовок
генерирует следующее оглавление:
Не кажется ли вам, что было бы лучше полностью исключить из оглавления заголовки третьего уровня и ниже?
Кроме того, структура DOM выглядит не совсем правильно: каждый элемент второго уровня представляет собой тег <ul> с единственным вложенным тегом <li>:
4 лайка
Отличное замечание. Не уверен, как часто мы используем три и более уровня, но их можно вернуть; это не должно быть слишком сложно.
Опять отличная находка. Это была небольшая ошибка, она будет исправлена после слияния этого PR.
3 лайка
Если вам хочется предложить новые функции, возможно, максимальную глубину можно было бы контролировать через настройку… 
5 лайков
По моему опыту, функция оглавления работает только в первом сообщении, но не в последующих. Это так? Если да, то можно ли рассматривать мое замечание как запрос на новую функцию? Кстати, оглавление, даже в первом сообщении, — это действительно отличное дополнение. Р
Всем привет, у меня возникла проблема после последнего обновления этого замечательного компонента темы, но только на мобильных устройствах. При нажатии на кнопку оглавления слайдер с полным оглавлением не открывается.
Если я использую очень маленькое окно на рабочем столе, эта кнопка и слайдер работают отлично. Значит, проблема, вероятно, только в Android.
Вот лог на моём актуальном форуме (Discourse и TOC):
Сообщение
Uncaught TypeError: Cannot read properties of null (reading 'classList')
Url: https://iunctis.fr/theme-javascripts/671f772e071bd55050592ff8541b659afe421259.js?__ws=iunctis.fr
Line: 36
Column: 49
Window Location: https://iunctis.fr/t/le-mensuel-01-decembre-2021/9591
Backtrace
TypeError: Cannot read properties of null (reading 'classList')
at n.showTOCOverlay (https://iunctis.fr/theme-javascripts/671f772e071bd55050592ff8541b659afe421259.js?__ws=iunctis.fr:36:49)
at e.n._join (https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:412333)
at e.n.join (https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:409358)
at h (https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:273784)
at https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:65110
at a (https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:260923)
at https://iunctis.fr/assets/vendor-96a5eaa8d436066b954c21ae5afb7f504310945c679465a2f1ba46b429a95edf.js:36:65054
at n._triggerAction (https://iunctis.fr/assets/application-945e3f0cb654a8c23b30e86f5e955be5599a8330d68ce75e97b8228ad45ff6fd.js:1:1254524)
at n.click (https://iunctis.fr/assets/application-945e3f0cb654a8c23b30e86f5e955be5599a8330d68ce75e97b8228ad45ff6fd.js:1:1254160)
Env
HTTP HOSTS: iunctis.fr
Если я использую пользовательский агент Android в своей настольной версии Firefox, при нажатии на кнопку на этом форуме возникает следующая ошибка:
Uncaught TypeError: document.querySelector(...) is null
showTOCOverlay 4916e6ed2a984e00537fe797b799637f1a801ffe.js:374
_join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4033
join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3999
p _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2870
An _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:1147
o _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2785
An _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:1147
_triggerAction _application-2646ad3bbed41e42bb77806dc41fbea2.js:489
click _application-2646ad3bbed41e42bb77806dc41fbea2.js:488
trigger _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2560
n _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2422
_run _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4034
_join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4033
join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3999
p _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2870
handleEvent _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2574
o _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2785
handleEvent _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2574
handleEvent _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2499
setupHandler _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2524
dispatch _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:347
handle _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:342
add _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:342
Oe _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:339
each _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:123
each _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:116
Oe _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:339
on _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:358
initialize _application-2646ad3bbed41e42bb77806dc41fbea2.js:3354
initialize _application-2646ad3bbed41e42bb77806dc41fbea2.js:62
runInstanceInitializers _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2730
each _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4074
walk _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4064
each _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4056
topsort _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4056
_runInitializer _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2733
runInstanceInitializers _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2730
_bootSync _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2604
didBecomeReady _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2623
invoke _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3963
flush _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3955
flush _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3969
_end _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4032
end _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3988
_run _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4034
_join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:4033
join _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:3999
p _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2870
bind _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:2873
u _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:272
c _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:273
setTimeout handler*a/< _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:274
l _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:265
fireWith _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:266
fire _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:266
l _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:265
fireWith _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:266
ready _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:283
z _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:283
EventListener.handleEvent* _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:283
<anonymous> _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:109
<anonymous> _vendor-64dba8b874ef11bbef3b2bce2fbcf6cc.js:109
4916e6ed2a984e00537fe797b799637f1a801ffe.js:374:18
На моём телефоне версия Chrome 97.0.4692, если это поможет.
Только у меня такая проблема?
2 лайка
Это недавняя регрессия, вызванная изменением в ядре. У меня уже есть исправление в FIX: Restore outlet in mobile views by pmusaraj · Pull Request #15683 · discourse/discourse · GitHub. Как только оно будет объединено, вы сможете пересобрать свой сайт, и проблема должна быть решена. Извините за это.
На прошлой неделе я также вернул третий уровень отступов для заголовков в компоненте, как упоминал Саймон выше.
Я колеблюсь добавлять здесь настройку, так как подавляющее большинство случаев использования в ней не нуждаются. Кроме того, в компоненте есть классы для каждого уровня, поэтому, если вы хотите скрыть уровни 4 и 5, вы можете сделать это с помощью этого CSS:
li.d-toc-h4, li.d-toc-h5 {
display:none;
}
7 лайков
Всё объединено и работает отлично, спасибо!
5 лайков
Я заметил, что <div data-theme-toc="true"> </div> в начале темы создаёт лишние отступы. Например:
Я добавил это в свою тему, и проблема, похоже, решена:
// Элементы оглавления в начале поста создают лишнее
// пространство. Discourse устанавливает верхний отступ у первого
// дочернего элемента поста в ноль, но это не работает, когда
// оглавление является первым дочерним элементом. Вместо этого
// мы установим верхний отступ у элемента, следующего за оглавлением,
// в ноль.
div[data-theme-toc="true"] + * {
margin-top: 0px;
}
Возможно, что-то подобное нужно добавить в компонент?
7 лайков
Отличное замечание, я добавил это правило CSS в этот PR: UX: Keep core's top margin for first item in OP by pmusaraj · Pull Request #30 · discourse/DiscoTOC · GitHub
4 лайка
Раньше я решал эту проблему, перемещая код встраивания в конец поста. Это немного похоже на костыль, но работает.
1 лайк
У меня есть посты, в теле которых есть лишние DIV-элементы. Например, On Storytelling - Workbench - Podtalk Community
DIV, который запускает генерацию оглавления (TOC), находится внутри другого DIV-элемента, и TOC это замечает. Однако другие заголовки, находящиеся внутри DIV-элементов, похоже, игнорируются TOC.
…скриншот не идеален. Это H2 внутри произвольного DIV-элемента (только для стилизации), который не отображается в оглавлении.
…на скриншоте не показан <div>, который запускает TOC; он находится внутри DIV-элемента с необычной парой атрибут/значение…
Обновлено несколько часов спустя: Возможно, стоит использовать просто :scope h1, и т. д., вместо того чтобы требовать, чтобы заголовки были непосредственными потомками области видимости?
…также это упоминалось в марте 2021 года: DiscoTOC - automatic table of contents - #255
3 лайка