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

XF 1.3 Changing SubNav Links

Discussion in 'Styling and Customization Questions' started by Eric J., Mar 12, 2014.

  1. Eric J.

    Eric J. Well-Known Member

    Hey there, I'm currently finishing up a design for a client and I'm a little stumped.

    http://i4.minus.com/iGn9kKnBFXsJJ.png

    In the gray bar in the header (The one that contains the user info), I'm aiming to change the links on the right side on a per page basis. For example, I want the links to be different on /apples/ and /oranges/. Is there any variable in the XF system that lets me do this easily when I create a new page in the pages system? Otherwise I can probably do some if statements in the main template checking which page it's currently on. Hoping to find a better way though. D:
     
  2. Russ

    Russ Well-Known Member

    Can't you use the body class that's added on each page?

    If I'm understanding correctly:

    .thread_vew .navTabs .navTab.selected .tabLinks a { color: #000; }
    .forum_view .navTabs .navTab.selected .tabLinks a { color: #FFF; }

    The extra class from the body would give the selector enough to override the default color.
     
  3. Eric J.

    Eric J. Well-Known Member

    Sorry I should have specified. I want to change the links completely, as in link to different pages.
     
    Russ likes this.
  4. Eric J.

    Eric J. Well-Known Member

    Still looking for help with this. D:
     
  5. Russ

    Russ Well-Known Member

    One method, if the pages will be apart of the navigation, Jakes nodes as tab add-on allows you to define custom sub nav links.

    The only other thing I can think of without an add-on would be to do a conditional in the navigation template to define the sub nav links(in side the forum tab since it's a page it would keep those sub-nav links).

    Or I'm completely over thinking an easy answer :D
     
  6. Russ

    Russ Well-Known Member

    So just as an example of one possibility which I guess it's working,

    ss1.jpg

    ss2.jpg


    Code:
    <xen:if is="{$tabs.forums}">
           <li class="navTab forums {xen:if $tabs.forums.selected, 'selected', 'Popup PopupControl PopupClosed'}">
           
             <a href="{$tabs.forums.href}" class="navLink">{$tabs.forums.title}</a>
             <a href="{$tabs.forums.href}" class="SplitCtrl" rel="Menu"></a>
    
             <xen:if is="{$quickNavSelected} == 'node-18'">
             <div class="{xen:if {$tabs.forums.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} forumsTabLinks">
               <div class="primaryContent menuHeader">
                 <h3>Page Title Here</h3>
                 <div class="muted">Description}</div>
               </div>
               <ul class="secondaryContent blockLinksList">
                 <li><a href="google">Google.com</a></li>
                 <li><a href="google">Google.com</a></li>
                 <li><a href="google">Google.com</a></li>
               </ul>
             </div>   
             <xen:else />
             <div class="{xen:if {$tabs.forums.selected}, 'tabLinks', 'Menu JsOnly tabMenu'} forumsTabLinks">
               <div class="primaryContent menuHeader">
                 <h3>{$tabs.forums.title}</h3>
                 <div class="muted">{xen:phrase quick_links}</div>
               </div>
               <ul class="secondaryContent blockLinksList">
               <xen:hook name="navigation_tabs_forums">
                 <xen:if is="{$visitor.user_id}"><li><a href="{xen:link 'forums/-/mark-read', $forum, 'date={$serverTime}'}" class="OverlayTrigger">{xen:phrase mark_forums_read}</a></li></xen:if>
                 <xen:if is="{$canSearch}"><li><a href="{xen:link search, '', 'type=post'}">{xen:phrase search_forums}</a></li></xen:if>
                 <xen:if is="{$visitor.user_id}">
                   <li><a href="{xen:link 'watched/forums'}">{xen:phrase watched_forums}</a></li>
                   <li><a href="{xen:link 'watched/threads'}">{xen:phrase watched_threads}</a></li>
                 </xen:if>
                 <li><a href="{xen:link 'find-new/posts'}" rel="nofollow">{xen:if $visitor.user_id, {xen:phrase new_posts}, {xen:phrase recent_posts}}</a></li>
               </xen:hook>
               </ul>
             </div>
             </xen:if>
           </li>
         </xen:if>
    
     
    Eric J. likes this.
  7. Eric J.

    Eric J. Well-Known Member

    Worked great, took a little tinkering since I separated the main tabs and sub navigation, but yeah definitely what I needed. For anyone else that might read this, it was this part specifically:

    Code:
    <xen:if is="{$quickNavSelected} == 'node-131'">
    // Desired navigation for specific page
    <xen:else />
    // Desired navigation for any other forum page
    </xen:if>
    Thanks a bunch Russ.
     
  8. Russ

    Russ Well-Known Member

    No problem, I think this would work for multiple pages:

    Code:
    <xen:if is="{$quickNavSelected} == 'node-18'">
    subnav
    <xen:elseif is="{$quickNavSelected} == 'node-19'" />
    subnav
    <xen:elseif is="{$quickNavSelected} == 'node-121'" />
    subnav
    <xen:elseif is="{$quickNavSelected} == 'node-129'" />
    subnav
    <xen:else />
    normal forum links
    </xen:if>
    
     

Share This Page