Side Menu System 1.1

[ibaker]

ibaker submitted a new resource:

Side Menu System - This modification creates a side column menu system with Left or Right screen selection

This modification replaces the standard horizontal below header menu system with a side column menu system with the user being able to select its display on either the left or right of the screen.

It provides for a greater number of main menu items with increased real estate to display more of what your site may have to offer a user...stops the "Out of site, Out of mind" use of extra site features and sections you offer.

The modification includes 4 components:
1. A Custom User Field - to...

Read more about this resource...

 

[Matt C.]

I thought you moved to IPS.

 

[ibaker]

I still run an XF site at Whats Up Australia which is a strictly "Off Topic" resource for my main site, with no moderation (except for spammers)...helps to keep my main site clean and on topic

 

[ibaker]

ibaker updated Side Menu System with a new update entry:

Minor fixes

This update fixes a z-index level and removes a rogue div that has been found

Read the rest of this update entry...

 

[YAPResearch]

Wow this looks amazing. Considering I am new to xF I don't know if my skill level is up to completing something like this but just wanted to throw my support towards another australian and also wanted to thank you for your time in developing this!

 

[ShikiSuen]

To make this continuously available for XenForo 2.2.x, I am going to summarize the modifications required in the PAGE_CONTAINER:

1. Inser the following block at the end of the header block:

<xf:comment> IB added for side menu </xf:comment>
    <xf:css src="nav_side_menu.less" />

2. Inser the following block right before the <div class="p-pageWrapper" id="top">:

<xf:comment> IB added for side menu </xf:comment>
<xf:if is="$xf.visitor.Profile.custom_fields.menu_position">
    <div class="menu_right">
<xf:else />
    <div class="menu_left">
</xf:if>

3. Move the entire p-nav-scroller hScroller div section to the place right after the p-nav-opposite div section.
This removes one useless <xf:else />:



4. Search the entire <xf:if is="property('publicNavSticky') == 'primary'"> conditional section and replace it using the following:

<xf:comment> IB added block for side menu </xf:comment>
    <xf:if is="$xf.visitor.Profile.custom_fields.menu_position">
        <div class="p-navSticky p-navSticky--primary">
    <xf:else />
        <div class="p-navSticky side_left_nav p-navSticky--primary">
    </xf:if>
    {$navHtml|raw}
</div>
{$subNavHtml|raw}

5. Place the following content right between the {$ldJsonHtml|raw} and </body>:

<xf:comment> IB added block for side menu </xf:comment>
<xf:js>
  if($(".p-navSticky").hasClass("side_left_nav")){
        $("body").addClass("menu_position_left");
    }
    
$(window).scroll(function() {
  if ($(this).scrollTop() > 48){ 
     $('.p-sectionLinks').addClass("side_menu_sticky");
  }
  else{
    $('.p-sectionLinks').removeClass("side_menu_sticky");
  }
});
    
$("[data-xf-init='quick-search']").parent().addClass("side_search_menu");
</xf:js>

<xf:comment> IB added for side menu </xf:comment>
</div>

Things above are what I compared the templates for XenForo 2.1.x, and I am gonna use this to test whether this works for XF 2.2.x releases