• Hi all,

    I googled like crazy for an answer to my problem or something similar but couldn’t find anything that would help, so gonna try it here.

    What am I trying to do?
    The website i’m creating will be using multiple a tab navigation on the top of the page. Each tab will show content for a specific group of people, ie. men or women. Each tab will show a different menu with pages in it, this is working if i assign pages to the corresponding tab page. Now the problem i’m having is with the pages that I want to show in all of the tabs. I want the selected tab to stay highlighted, and the corresponding menu to stay when going to a page that doesn’t have the corresponding tab as a parent (since it must be available to the other tabs too).

    What have I tried?
    I have tried to check if the page has a parent, if so then select that tab. If the page does not have a parent use the previous parent and select that tab. This way the tab should stay highlighted even though the page doesn’t have a specific parent.

    What I don’t want?
    I don’t want to make different versions of each page for each tab available. This way I would have to edit the same thing multiple times for each copy of the page.

    What would be the best way to get the result i’m looking for?

    I hope this is clear enough, and I hope someone can help me with this.

    Thanks in advance!

    Greetings,

    Wversluys

    ps. If you need more information let me know and ill update the question.

    EDIT*

    Here are some screens of the problem, first screen shows a working tab with the correct navigation shown (parent: the top-level parent of the page shown, wich determines the navigation shown in the bar).
    Screen 1

    The second screen shows a page without a parent (thus available to multiple tabs). This also shows and empty navigation bar (except from the page itself).
    Screen 2

Viewing 15 replies - 1 through 15 (of 15 total)
  • What would be the best way to get the result i’m looking for?

    Try looking at the classes generated in your menu and then use CSS.

    Thread Starter wversluys

    (@wversluys)

    Hi Esmi,

    Thanks for the quick response!

    I already used CSS to modify the tabs (.current-page-ancestor and .current-page-parent).

    The problem is, without assigning a parent to some pages I won’t be able to keep a menu item highlighted. And it’s not possible to assign multiple parents to a page/post (as far as I know). I’ll update my question with some screens to visualize my problem.

    You’d probably be better off creating a custom menu. That way, the menu items would have parent and ancestor classes based on their menu positions as opposed to their page attributes.

    Thread Starter wversluys

    (@wversluys)

    The menu’s I am using are all custom menu’s, the parent and ancestor classes are working as intended. What doesn’t work is: keeping the last parent tab selected if the current page does not have a parent.

    Is there a way to save the last parent as a global variable? Tried to declare a global variable in functions.php but I couldn’t access it later on (tried it in header.php).

    keeping the last parent tab selected if the current page does not have a parent.

    Can you post a link to a page demonstrating this?

    Thread Starter wversluys

    (@wversluys)

    Here is a link to a sample website (same template as the website im working on)
    Link

    It would help if there were some sub-menu items on that page.

    Thread Starter wversluys

    (@wversluys)

    The tabs in the top-left corner is basicly the main navigation, the navigation bar under the logo will be the sub-navigation of the selected tab.

    I want the pages that don’t have a parent to keep the last parent active (so keeping the last selected tab active).

    So, (for example) “Page without Parent” should keep the “Men” tab active, yes?

    Thread Starter wversluys

    (@wversluys)

    When coming from one of the men pages, yes. When coming from one of the women pages the ‘women’ tab should stay active.

    What you might be able to do is check the page referrer and then, based on the value of that page, add a class of “men” or “women” to the top tab’s ul element via wp_nav_menu. That way, you should be able to target the appropriate menu item <li> using CSS.

    Thread Starter wversluys

    (@wversluys)

    Thanks for the suggestion, i’ll look into it!

    Also just thought of another way, using the $_SESSION variable to store the last known parent, although this wouldn’t work if people disabled cookies right?

    I’ll give them both a try and will come back if one of these fixed it or not ??

    Thanks for the replies so far Esmi!

    although this wouldn’t work if people disabled cookies right?

    Correct. You’ve also got to bear in mind someone being dropped into an underlying page via Google or another referrer. I had to do something similar on a site a few months back and it was pretty hellish (although I did have the benefit of a firm page hierarchy). It’s not the kind of scenario that can be handled easily in WordPress.

    Thread Starter wversluys

    (@wversluys)

    Yeh I was afraid of that, i’m gonna give it a go with the page referrer. Thanks alot for your help!

    No problem. ??

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘Assign a page/post to multiple parents’ is closed to new replies.