Select to view content in your preferred language

HubNavigation Question

3531
6
Jump to solution
04-01-2020 01:15 PM
MatthewKalcich
Frequent Contributor

Hi All,

Just a quick question... Is there an easy way to navigate through a HUB site? For example create book marks for specific sections and reference those book marks in a drop down at the top of the screen to quick navigate through a page? Just curious if this functionality exists 

Thanks,

Matt

0 Kudos
1 Solution

Accepted Solutions
by Anonymous User
Not applicable

You can look up how to do "anchor linking" on a site. 

Boils down to...

  • Put some HTML somewhere with the "anchor" using the HTML element's ID attribute.... `<div id="destination"></div>
  • Then make a link using your dropdown or custom HTML or the menu bar Katie links above...like <a href="#destination">My link</a>

These folks from Pennsylvania have done this on their main site

Bucks County 

View solution in original post

6 Replies
KatelynThompson
Esri Contributor

Hi Matt, 

Here are some resources on how to add menu links to a site's header:
Configure global navigation and menu links—ArcGIS Hub | Documentation 
Global Navigation: New Ways to Get Around and Brand your Sites with ArcGIS Hub and ArcGIS Enterprise... 


Note that any links, branding, etc added to your site's header will automatically be applied to any hub pages added to your site. This is useful for creating consistency between your site and any pages you may wish to add.

You may also find the Navbar Dropdown section of this guide useful for creating dropdown menus with HTML:

Coronavirus Response - Code Samples 

0 Kudos
by Anonymous User
Not applicable

You can look up how to do "anchor linking" on a site. 

Boils down to...

  • Put some HTML somewhere with the "anchor" using the HTML element's ID attribute.... `<div id="destination"></div>
  • Then make a link using your dropdown or custom HTML or the menu bar Katie links above...like <a href="#destination">My link</a>

These folks from Pennsylvania have done this on their main site

Bucks County 

JenniferSherry
Occasional Contributor

Hello-

I've begun to implement these anchor tags on our internal Hub site.  I'm finding when I click the link to the anchor, the beginning of the section that I'm jumping to is hidden behind the fixed site header.  I've dug around for a solution that would involve some sort of anchor padding that's equal to the height of the header, but I'm pretty new to this, so I haven't found something that works yet.  

Any thoughts?  I notice in the Bucks County example provided, the same thing happens.

Thanks in advance!

Jennifer

0 Kudos
by Anonymous User
Not applicable

offset for the height of the header is the way!

0 Kudos
BrettShaver
Frequent Contributor

Hi @Anonymous User  - is there any better documentation around how to do this?  Similar to StoryMap Navigation.  I'd probably be able to follow your ideas easily if I knew HTML.  This seems like it should be an easy out of the box concept to implement (again similar to story maps nav bar).  thanks!

0 Kudos
Samuel_McAuley
Occasional Contributor

Hi, I was trying to achieve exactly this and after a little trial and error this is how I got it to work. My use case is I added an FAQ to my site and want to jump to sections of that FAQ where it is grouped by theme.

Immediately above the section that you want to be able to quickly jump to add this into your html code:

<div id="Troubleshooting"></div>

You can give your own "Id" value to suit your page content.

Then to insert a link to that section, use this syntax:

<a href="#Troubleshooting">Troubleshooting</a>

And voila!

0 Kudos