Could you please post the script for the quick link navigation, as per the solution given by the community members, I found that there is a problem, it's not fixed on the side and the formatting is not right, it's not aligned.
Based on the solution given in Problem https://meta.answer.dev/questions/D1xc/how-can-i-display-quick-links-in-the-side-nav.
Thank you!
Below is a complete example including navigation selection style. You can choose the part you need to use according to the situation.
<script>
const htmlstr = `<div class="py-2 px-3 mt-3 small fw-bold quick-link">Quick Links</div>
<a class="nav-link" href="/link1">
link name
</a>
<a class="nav-link" href="/link2">
link name
</a>`;
window.onload = function () {
const navUser = document.querySelector('#sideNav a[href="/users"]');
const navQuick = document.querySelector("#sideNav .quick-link");
if (navUser && !navQuick) {
navUser.insertAdjacentHTML("afterend", htmlstr);
}
};
const timer = setInterval(() => {
const navUser = document.querySelector('#sideNav a[href="/users"]');
const navQuick = document.querySelector("#sideNav .quick-link");
if (navUser && !navQuick) {
navUser.insertAdjacentHTML("afterend", htmlstr);
}
// If you don't need to keep the selected style, you can remove the following code
// nav active style start
const links = document.querySelectorAll('#sideNav a[href^="/tags/"]');
links.forEach((link) => {
const href = link.getAttribute("href");
const currentPathname = window.location.pathname;
if (href === currentPathname) {
link.classList.add("active");
} else {
link.classList.remove("active");
}
});
}, 500);
// nav active style end
window.addEventListener("beforeunload", function (event) {
clearInterval(timer);
});
</script>
