Making 'Bar 2' appear when link in 'Bar 1' is clicked

Support
#1

Hi guys,

I am redesigning my site: http://albondogranch.com.staging.yourhost.co/ and what I am trying to do is based on the apple design that the tutorial was on. I have built 2 bars for the menu’s. Bar 1 contains the main nav and Bar 2 is the sub menu (well that is what I am trying to achieve). I don’t want a drop down and I only want Bar 2 to appear when a link is clicked in the main bar.

Hoping you can help me out and this is clear enough.

Cheers

Jonathan

#2

Hi Johnatan,

Unfortunately what you are trying to achieve is not possible out of the box.

The inline navbar above won’t have any relation with the navbar links or links on your second bar. It is independent of the second bar and this type of interaction would require some custom development.

If you need further help please provide your Pop-up authentication credentials.

Thank you

#3

Hi Joao,

Thanks for getting back to me. Excuse my ignorance but what are “Pop-up authentication credentials”?

Cheers,

Jonathan

#4

Hi Joao,

Just wondering if you could get back to me on this as I would like some help if it’s available.

Thank you!

Jonathan

#5

Hi There,

I was referring to this :

And remember, do not bump on your own thread as it pushes your thread to the end of the queue, luckily I had it open here :slight_smile:

#6

Hi Joao,

Sorry about that and thank you for getting back to me!

Please finds the attached details.

Cheers,

Jonathan

#7

Hey Jonathan,

To achieve the effect, you need to create and assign a header for each of your pages. This would be the setup:

  • Home Page - 1 Bar header containing the main menu. The main menu links to your pages.
  • Services Page - 2 Bar header containing the main menu in the first bar and sub-menu in the second bar.
  • For the rest of your pages, follow the same setup you’ve done for your Services page.

Thanks.

#8

Hi Joao,

Thanks for getting back to me.
I think you may have understood me or I didn’t communicate properly.
What I am trying to achieve is the current setup that apple has on their site. That being that when the page loads there is the main bar ‘Bar 1’. When you click on a link eg. SERVICES, ‘Bar 2’ then appears. This is the current setup in apple. It is not using the usual sub-menu setup.

So when you click on a link in ‘Bar 1’, ‘Bar 2’ appears with the sub menu and so on.

Cheers,

Jonathan

#9

Hey Jonathan,

We actually understood what you want and how the apple menu bars because we have re created that menu in our local testing servers. I think that you though that apple menu only has one menu but it is not. As matter of fact, @christian’s suggestion is exactly what is happening in apple menu. In the homepage, there is one menu exclusively for the homepage.

And when you click on the links above, you will be redirected to the next page with a different set of menus:

What you have seen in the apple menu is actual different set of menus for each pages. You just do not noticed that you are actually going to the next page because the page loading is pretty fast.

As @Christian suggested that you will create two sets of custom headers. The first header with your bar 1 will be used for the homepage. The second custom header which is more likely duplicated from the first header will be assign to several other page and also edit this header for you to add the second bar. This is how apple menus works.

_So when you click on a link in 'Bar 1', 'Bar 2' appears with the sub menu and so on._
What you wanted may not be possible as of this moment. It might need custom JS/CSS which is already a custom development and way beyond the scope of our support.

Hope this explains it all.

2 Likes
#10

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.