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

[Hristo Avramov]

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.

<!-- 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>

 

[EQnoble]

I would undo that and check out Nodes as Tabs ( http://xenforo.com/community/resources/nodes-as-tabs.9/ )

It will allow you to easily create your own tabs and links and such. Then from there you customize the look you are trying to achieve.

That's my best advice for you without knowing better what you are trying to do in entirety.

 

[Hristo Avramov]

Thank you but some of the things are unachievable, I want to link to topics, not nodes. Is that possible with this mod?

 

[EQnoble]

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

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)



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.

 

[Hristo Avramov]

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]

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.

 

[Hristo Avramov]

Does it matter what I change them to?

 

[Jeremy]

No, but they need to be unique to your tab.