• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.2 Trying to add drop down in tabs. Problem.

#1
I am trying to add dropdown menu in the tabs. menus work fine in every situation, but when I am on page Members. Then all new menus and Members look like this and break. I simply copied the whole members drop down menu code. Can you point me if I can do something to fix this.
Code:
<!-- members -->
        <xen:if is="{$tabs.members}">
            <li class="navTab members {xen:if $tabs.members.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="{$tabs.members.href}" class="navLink">{$tabs.members.title}</a>
                <a href="{$tabs.members.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$tabs.members.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} membersTabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>{$tabs.members.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    <ul class="secondaryContent blockLinksList">
                    <xen:hook name="navigation_tabs_members">
                        <li><a href="{xen:link members}">{xen:phrase notable_members}</a></li>
                        <xen:if is="{$xenOptions.enableMemberList}"><li><a href="{xen:link members/list}">{xen:phrase registered_members}</a></li></xen:if>
                        <li><a href="{xen:link online}">{xen:phrase current_visitors}</a></li>
                        <xen:if is="{$xenOptions.enableNewsFeed}"><li><a href="{xen:link recent-activity}">{xen:phrase recent_activity}</a></li></xen:if>
                    </xen:hook>
                    </ul>
                </div>
            </li>
        </xen:if>
       
        <!-- betting menu -->
        <xen:if is="{$tabs.members}">
            <li class="navTab members {xen:if $tabs.members.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="#" class="navLink">Bookmaker Reviews</a>
                <a href="{$tabs.members.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$tabs.members.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} membersTabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>Bookmakers</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    <ul class="secondaryContent blockLinksList">
                    <xen:hook name="navigation_tabs_members">
                        <li><a href="http://www.w3schools.com">Visit W3Schools</a></li>
                        <li><a href="http://www.w3schools.com">Visit W3Schools</a></li>
                        <li><a href="http://www.w3schools.com">Visit W3Schools</a></li>
                        <li><a href="http://www.w3schools.com">Visit W3Schools</a></li>       
                                            </xen:hook>
                    </ul>
                </div>
            </li>
        </xen:if>
 
        <!-- betting menu1 -->
        <xen:if is="{$tabs.members}">
            <li class="navTab members {xen:if $tabs.members.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
                <a href="#" class="navLink">Live Scores</a>
                <a href="{$tabs.members.href}" class="SplitCtrl" rel="Menu"></a>
               
                <div class="{xen:if {$tabs.members.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} membersTabLinks">
                    <div class="primaryContent menuHeader">
                        <h3>Live Scores</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    <ul class="secondaryContent blockLinksList">
                    <xen:hook name="navigation_tabs_members">
                        <li><a href="http://www.w3schools.com">Visit W3Schools</a></li>
                        <li><a href="http://www.w3schools.com">Visit W3Schools</a></li>
                        <li><a href="http://www.w3schools.com">Visit W3Schools</a></li>
                        <li><a href="http://www.w3schools.com">Visit W3Schools</a></li>       
                                            </xen:hook>
                    </ul>
                </div>
            </li>
        </xen:if>
Untitled.jpg
 

EQnoble

Well-known member
#4
You can create a Link Forum node which is stock included in xf and just put the url in which you want it redirected to
linkForum.png
When you install nodes as tabs you get many more options when creating or editing nodes.


This is the same page with an older version of nat (newer ones have more options)
natnode.png


In this example I added a 'link forum' type of node (which links to your previous post in this thread) , made it not display in the node list and the parent node in the example (titled bbcodes) is set to display as a tab in the navigation and display the children. Since the children are set to not display in the node list but are set to show up in the navigation I end up with a custom tab with a custom menu.


In your case...you could create a bunch of link forums with one acting as a parent to the rest and you make the parent whatever you want and the children will be the links in the menu.
 
#5
That is very good tutorial, thank you very much. It is simple, but requires addon, if I cant find other solution I will make it your way. Thank you agian!
 

Jake Bunce

XenForo moderator
Staff member
#6
You copied the members tab to use as a template for new tabs, but you didn't change the ids of your new tabs. You are still using {$tabs.members}, the 'members' class, and {xen:if $tabs.members.selected...}. Those all must be changed to differentiate between the tabs.