nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Is it possible to (re)move the Favo[u]rites button in the hub?

Julia_vanRavenswaaij

Is it possible to (re)move the Favo[u]rites button in the hub? It's really annoying and blocks my content. I can't find anything about it in the documentation.

There doesn't seem to be an option to change it in the editor, and I've tried injecting the following custom CSS to no avail.

.hub-tooltip-wrapper > button.btn-info { display: none !important; }

button[aria-label="Add to Favorites"] { display: none; }

image.png

AndyShoemaker_0-1743433563239.png

Trouver plus de publications taguées avec

Accepted answers

JustinPrather

Hi @Julia_vanRavenswaaij –

Currently there is no adjustable setting within a Hub site to hide the favorites option in the toolbar.

I'll take this request to our team for consideration.

We discourage using CSS to override the display of Hub elements, as we could change underlying code, and CSS overrides could cause unknown display problems. However, with that risk, your second line using the `aria-label` will work if you add the `important` flag.

All comments

JustinPrather

Hi @Julia_vanRavenswaaij –

Currently there is no adjustable setting within a Hub site to hide the favorites option in the toolbar.

I'll take this request to our team for consideration.

Julia_vanRavenswaaij

That works perfectly, thank you !

PortWatchIMF

Hello, In addition to the original question, in the mobile view the star button becomes a full div at the bottom of the page, taking considerable amount of space. It would be helpful to have the option to disable it without the additional custom CSS. Many thanks

Georamaadmin

Hi @Julia_vanRavenswaaij and @JustinPrather,

I've been experiencing some UI issues, too due the new Favorite button is placed just in front of some custom buttons. I've tried to add the CSS code below, but with no results.

.hub-tooltip-wrapper > button.btn-info { display: none !important; }

button[aria-label="Add to Favorites"] { display: none !important; }

Did you add the code in the Custom CSS Header area in attach?

Thanks,

Custom CSS.png

Georamaadmin

Hi @Julia_vanRavenswaaij and @JustinPrather,

In addition to my last post, I've used AGO Assistant to securely perform some changes, but It didn't work. The button continues annoying the users as showed in attach. I noticed Hub was updated in February 3rd. Does the solution contine running for you?

Thanks,

Favorite Button.png

JustinPrather

Hi @PortWatchIMF –

Thank you for the additional feedback. I'm capturing it for our team.

JustinPrather

Hi @Georamaadmin –

The better place to add code is to your Footer, wrapped in a <style> tag.

<style>

</style>

ZLittle

(disclaimer: I think I'm talking about the same thing here, apologies if I'm not)

Thank you for taking the request to the team. I want to strongly emphasize how insanely annoying this is. The blue bar with the favorite, share, etc. buttons is constantly in the way. It's so in the way that it prevents a user from accessing anything that may be behind it. I strongly urge Esri to prioritize fixing this poor UX/UI issue.

JustinPrather

The CSS demonstrated above should work across anything displaying on a Hub site.

ZLittle

I concur. As a user, I should not need to add code to simply hide, move, remove, etc. buttons that are covering content. It should be an easy to find and easy to use setting.

Georamaadmin

Thanks for the response @JustinPrather. That worked fine!

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.