Hi!
I have a Custom HTML/CSS header configured for Hub.
I need to add a menu link that links to an app shared with a group and visible only if the user is signed.
For the Standard Header I managed to make this work and it is pretty easy, but fort he Custom one seems to be more complicated, hopefully not impossible.
First of all: is it even possible to the best of your knowledge?
As, per my attempt, I interrogated ChatGPT and it suggests to modify the HTML with this class
<li class="private-link" style="display: none;">
modify the CSS with this:
.private-link { display: none;
add this JavaScript caller to the HTML, but when I do so, the javascript disappears from the text an in fact also the menu link disappears because it take the display:none class.
Actually to the best of my knowledge, JavaScript is not supported at all.
<script> async function checkUserAuth() { const portalUrl = "https://geogovmt.maps.arcgis.com/sharing/rest/community/self"; try { const response = await fetch(portalUrl, { credentials: "include" }); const user = await response.json(); if (user.username) { // User is signed in, show the private menu link document.querySelectorAll(".private-link").forEach(link => { link.style.display = "block"; }); } } catch (error) { console.error("Error checking authentication:", error); } } // Run the function when the page loads document.addEventListener("DOMContentLoaded", checkUserAuth); </script>
Thanks!
