Создание якорных ссылок процесс не сложный. Главное чтобы у нужного блока был указан id, далее через символ # указываем тот самый id и получаем якорную ссылку. Нужно иметь в виду, что если мы создаем якорную ссылку на блок с той же страницы где размещена ссылка, то, нам достаточно указать ссылку вида #id, а если ссылка (например, ссылка в меню) ведет на блок, размещенный на другой странице, то ее вид должен быть: https://название-сайта/страница/#id
Если якорная ссылка ведет на спойлер или таб, то спойлер не откроется. Для этого нужна имитация клика по спойлеру.
Долго искали решение в интернете. В основном всё сводится к смене класса у таба на activ с помощью JS или jQuery, но в нашем случае к табу и описанию в табе применялось несколько классов и рабочим решением в итоге оказалось это https://telegra.ph/Pri-perehode-po-yakornoj-ssylke-imitirovat-nazhatie-knopki-03-31
Этот скрипт "имитирует" нажатие таба или спойлера если зафиксировано нажатие на якорную ссылку и на странице существует "кнопка" с таким id. От себя добавили три последние строки, чтобы кроме "клика по табу" осуществлялась прокрутка к табу на уровне середины экрана. block: 'center'
можно поменять на block: 'start'
<script>
// Get all anchor links on the page
const anchors = document.querySelectorAll('a[href^="#"]');
// Add event listener for each anchor link
anchors.forEach(function (anchor) {
anchor.addEventListener('click', function (e) {
e.preventDefault(); // Prevent default behavior of the link
// Get the id of the button to which the anchor link is related
const targetId = this.getAttribute('href');
// Find the target button by its id
const targetButton = document.querySelector(targetId);
// If the button is found, click it
if (targetButton) {
targetButton.click();
targetButton.scrollIntoView({
behavior: 'smooth',
block: 'center',
});
}
});
});
</script>