Извините за мою некомпетентность в этом вопросе, но как Discourse обрабатывает нажатие на ссылку в «гамбургер-меню»?
Контекст: Я использую сервис prerender.io для предоставления HTML-версии основного сайта (JS-версии сайта).
Ссылка на «гамбургер-меню» не работает.
Вы можете протестировать сайт, используя инструменты разработчика Chrome и изменив агент пользователя на Googlebot для смартфонов. При использовании пользовательского агента Googlebot вы фактически получаете HTML-версию, сгенерированную prerender.
Дополнительно: Согласно этой записи в блоге от prerender, могут возникать проблемы с кодом вроде:
`<a onclick="goTo('page')">Anchor</a>`
`<a href="javascript:goTo('page')">Anchor</a>`
`<span onclick="goTo('page')">Anchor</span>`
Все ссылки должны быть обернуты в теги <a></a> и определять целевой URL в атрибуте href, чтобы Google мог их найти и проследовать по ним.
Возможно, ссылка основного меню генерируется именно таким способом?
Буду очень признателен за любые идеи относительно решения.
Редактирование: Я пока отключил prerender для сайта (но оставил JS-версию для ботов). Удивительно, но Googlebot иногда корректно его рендерит. Также у меня нет проблем с меню при использовании Googlebot в качестве пользовательского агента в Chrome. Я продолжу тестирование в течение некоторого времени.
Приношу свои извинения, я сделал простой вопрос довольно запутанным…
Ссылки в меню, кажется, в порядке, моя проблема — это сама ссылка «гамбургер» — при рендеринге с prerender она просто не открывается.
Этот пост от @Johani был очень полезен при попытке диагностики.
Правильно ли я иду, изучая этот фрагмент кода (что касается функциональности при клике на меню-гамбургер)?
Меню добавляется в документ с помощью JavaScript при нажатии на кнопку, поэтому его непросто адаптировать для работы в HTML-версии сайта.
Вот место, где добавляется кнопка; вы можете увидеть, что у неё есть действие с именем toggleHamburger:
https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/header.js#L246
Действие toggleHamburger определено позже в том же файле, здесь:
https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/header.js#L483
toggleHamburger изменяет состояние hamburgerVisible, поэтому меню в конечном итоге добавляется с помощью panels.push(this.attach("hamburger-menu"));, что можно увидеть здесь:
https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/widgets/header.js#L379
Отличный ответ, @awesomerobot, уверен, сообщество это оценит.
Я изучу это, чтобы понять, стоит ли заниматься кастомной доработкой.
Ответ, который я получил от prerender.io, сводился к тому, что если используется «сложный JS», то, скорее всего, это не сработает. Не уверен, насколько хорошо они проанализировали ситуацию.