announcementBar on homepage only

[peterpeterparker]

Hi,

Is there a way to configure the announcementBar to appear only on the homepage?

I used this nice feature to display the message "If you like Juno, star it on GitHub!" on the related website, but I feel it would also be nice to also not display it when browsing the documentation.

[slorber]

You can swizzle the @theme/AnnouncementBar component and make it render null/false when it's not on the homepage.

const {pathname} = useLocation()
const isHomePage = pathname === "/"
if (!isHomePage) {
  return null;
}

Or you can swizzle @theme/Layout, add a prop such as noAnnouncementBar={true} to hide it conditionally, or using the location pathname like above.

You can also hide it with CSS, although it will remain in the DOM tree on pages that don't need it.

As you can see, you have many options to do that 😄

[peterpeterparker]

That's great @slorber, thanks!