Home » discuss » Public forums » iMIS Community

Left / secondary navigation in side bar panel - Aspen theme

Posted May 29th, 2012 by jonathan_kirwan
|

I'm working with the Aspen / member theme to create a new WCM website, and have realised that these themes come without the side bar content / navigation that you would find in templates 1600 and below.

So i'm trying to find a way to include the side bar / left navigation into the master page?

ASI docs seems to suggest that you can customise your theme by adding "<asi:PageSubNav>" to your master page.http://docs.imis.com/15.2/index.htm#!definingnavigationareasandbreadcrumbareas1.htm though unfortunately i cannot get this to work.

Any adivce on how to do this would be much appreciated.

Thanks, Jon.

‹ WCM 1700 Template Sidebar questionEntity type __Table__ does not have an identity property and can't be updated. ›
login or register to post comments | printer friendly version

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.

What version?

On December 17th, 2012 Andrea Robertson says:

Hi Jon,

I might be able to help you, but the number of steps might be different depending on what version of iMIS you have. Are you working with 15.2 or 15.2.1?

Thanks,
Andrea

EDIT: Please note, the steps in the comments below should only be followed if you are on a version of iMIS BEFORE 15.2.10. In the 15.2.10 release we included a new and improved left navigation control, and the documentation for it can be found here: Displaying Hierarchical Sub-Navigation

login or register to post comments

15.2.1.3282

On May 29th, 2012 Scott Rowan says:

Hi Jon,

We were using forest and aspen and I did the following to get left navigation.

Navigated to the Net\Templates\Masterpages folder on the server, and found the forest.master file.

I made a backup of it just in case anything went wrong.

I then edited the forest.master file and found the following secition:-

                <div id="masterSideBarPanel" class="yui-b">
                    <asp:ContentPlaceHolder ID="SideBarPlaceHolder" runat="server">
                    </asp:ContentPlaceHolder>
                </div>
 

 I changed it to:-

 <div id="masterSideBarPanel" class="yui-b">
                    <asp:ContentPlaceHolder ID="SideBarPlaceHolder" runat="server">
                            <asp:ContentPlaceHolder ID="PageSubNavigationPlaceHolder" runat="server">
                                <asi:PageSubNav id="Secondary" runat="server" NavigationPaneCode="1"
                                StartingNodeOffset="1" StartFromCurrentNode="true"
                                StartingNodeOffsetAutoSet="true" SelectDefaultNode="false" />
                            </asp:ContentPlaceHolder>
                    </asp:ContentPlaceHolder>
                </div>

I then republished the website and sitemap and the secondary nav showed.

Hope that helps?

Regards,

Scott

login or register to post comments

don't forget to register the tag

On May 31st, 2012 etarasew says:

I believe, you'll also need to register the PageSubNav tag (I don't think it's added by the forest.master file)

<%@ Register TagPrefix="asi" TagName="PageSubNav" Src="~/AsiCommon/Controls/Navigation/PageSubNav.ascx" %>

login or register to post comments

Thanks

On May 31st, 2012 Scott Rowan says:

Good pickup - forgot I did that bit as well.

login or register to post comments

This is correct for 15.2.1+.

On May 31st, 2012 Andrea Robertson says:

This is correct for 15.2.1+. The only difference for 15.2 is that you will need to change around some of the YUI css class structure.

You may also notice at the bottom of the masterpage there is javascript to dynamically change the layout to use a 1 or 2 column layout:

// if there is something in the side bar this converts the layout to 2 columns
if ($('masterSideBarPanel').children.length != 0) {
$('masterWrapper').setAttribute("class", "yui-t2 HasSubNav");
}

If you will have a left nav that will display more often than not I would recommend reversing this script. You will have to set the masterWrapper to have the class "yui-t2" by default, then dynamically remove it if there are no left nav items.

// if there is nothing in the side bar this converts the layout to 1 column
if ($('masterSideBarPanel').children.length === 0) {
$('masterWrapper').removeAttribute("class");
}

login or register to post comments

jQuery ID selector

On May 31st, 2012 etarasew says:

don't you need the hash/pound to select the ID? so you'd need to use

// if there is something in the side bar this converts the layout to 2 columns
if ($('#masterSideBarPanel').children.length != 0) {
$('#masterWrapper').setAttribute("class", "yui-t2 HasSubNav");
}
OR
// if there is nothing in the side bar this converts the layout to 1 column
if ($('#masterSideBarPanel').children.length === 0) {
$('#masterWrapper').removeAttribute("class");
}

also, you might want to consider using .addClass or .removeClass instead of .setAttribute (in the event that your layout might already have a class on the #masterWrapper div)

of course, none of this is working for me, I've started a new thread inquiring about jQuery not working for me, if anyone has ideas... http://www.imiscommunity.com/jquery_not_working_in_wcm

login or register to post comments

ID selector

On June 1st, 2012 Andrea Robertson says:

You're right that you should use the '#' when selecting by id, but oddly I get better results when I don't use it... Same with using .addClass and .removeClass - these would be ideal, but I had lots of difficulty implementing them, especially in IE; I got better results with .setAttribute and .removeAttribute, which are out-of-the-box JavaScript functions.

login or register to post comments

Hi everyone, Firstly thanks

On June 11th, 2012 jonathan_kirwan says:

Hi everyone,

Firstly thanks very much for the responses.

Following this advice, I have been able to successfully include the sub navigation now.

I do have one remaining problem though and that is that my sub navigation is getting included on pages where I have no sub nav items to return such as the home page.
This creates a big empty space which causes problems for the layout.

I can see that the Javascript in the footer should fix this but I think I must be writing this incorrectly. This is copied directly from my edited master page.

// if there is something in the side bar this converts the layout to 2 columns
if ($('masterSideBarPanel').children.length != 0) {
$('masterWrapper').setAttribute("class", "yui-t2 HasSubNav");
}
// if there is nothing in the side bar this converts the layout to 1 column
if ($('#masterSideBarPanel').children.length === 0) {
$('#masterWrapper').removeAttribute("class");
}

Thanks, Jon.

login or register to post comments

Also, Hi Andrea - the

On June 11th, 2012 jonathan_kirwan says:

Also, Hi Andrea - the version i'm using is 15.2.1.3282.

login or register to post comments

Left / secondary navigation in side bar panel - Aspen theme

On June 13th, 2012 jonathan_kirwan says:

Okay I have cobbled together a fix for this problem. It's not a perfect solution and only temporary until the site I am working on is upgraded to 15.2.5 where I believe this issue has been fixed. The problem I found was with the jQuery at the bottom of the master page (I should also say that I'm not experienced with jQuery whatsoever. I'm trying to learn the basics of it now so to any experts the solution will probably look like a hack job).

Firstly, i added in a script to jQuery. I know that there is a script already but for some reason my script is not executed without adding this second script in. I could tell this by debugging with Chrome developer tools and seeing that $ was undefined.

Then I changed the condition to count the children table elements rather than div.

And finally changed 'setAttribute' and 'removeAttribute' to 'addClass' and 'removeClass' instead. I could not get the attribute methods to work. I also found lots of examples of other developers having trouble getting these functions to work e.g. http://stackoverflow.com/questions/5781355/setting-an-attribute-named-re....

<script src=/iMIS15/AsiCommon/Scripts/Jquery/jquery.js type=text/javascript></script>
<script type="text/javascript">
var n = $("#masterSideBarPanel > div > table").length;
if (n>=1) {
$('#masterWrapper').addClass("yui-t2 HasSubNav");
}
else if (n<1) {
$('#masterWrapper').removeClass('yui-t2 HasSubNav').addClass('noclass');
}

login or register to post comments

streamlined

On July 16th, 2012 etarasew says:

Jonathan,

Thanks for this workaround, adding the table check fixed it for me (have a client who's requesting the sidebar and the ASI version of the script was always showing the a length of 2, no matter what the number of sub nav pages).

I streamlined it a little bit, figured there were only a few pages that I did not want the sidebar, so I added the class of yui-t3 (wanted a wider sidebar) to #masterWrapper and used the following logic:

// if there is NOTHING in the side bar this converts the layout to 1 column
if (jQuery("#masterSideBarPanel > div > table").length === 0) {
jQuery("#masterWrapper").removeClass("yui-t3");
}

  1. because there was already the yui-t3 class, no need to add the 'else'
  2. I had to use jQuery instead of $
  3. I couldn't use single quotes in the selector, needed double quotes
  4. used the removeClass because there was another class on the #masterWrapper div that I didn't want to eliminate
  5. I did not need to add the additional script to load the jQuery library
login or register to post comments

So close but not there yet - conditional left nav

On December 12th, 2012 jennifer_strawn says:

// THIS ONE STILL KEEPS A SPACE EVEN IF NO SUB NAV if there is something in the side bar this converts the layout to 2 columns

if ($('masterSideBarPanel').children.length != 0) {'masterWrapper').setAttribute("class", "yui-t2 HasSubNav");

// THIS ONE DOES SUPPRESS ON THE HOME PAGE AND OTHER WITH NO SUB NAV BUT IF THERE IS SUBNAV IT PUTS THE SUBNAV IN THE SAME SECTION AS THE PRINT/EMAIL ICONS ABOVE ALL THE OTHER CONTENT // if there is nothing in the side bar this converts the layout to 1 column //if ($('#masterSideBarPanel').children.length === 0) {

 

// $('#masterWrapper').removeAttribute("class");

 

//}

I tried above jQuery suggestion but it does the same. So the left nav is right under the primary nav but then the rest of the page starts below the end of the subnav.

What am I missing? Thanks for your help!

Jennifer Strawn
Accounting & Association Software Group

 

 

 

$(

}

 

 

Thank you for these posts! I am building a site on 15.2.5.3815 using the Forest/Birch combination. I have modified the SubNav section as noted in these posts but I'm still having issues suppressing the subnav when there isn't any (like on the home page). I have this code at the end of the master page - you can see my notes in caps below.

 

 

 

 

 

 

login or register to post comments

15.2.1

On December 12th, 2012 etarasew says:

The client that I did this for is currently on 15.2.1 (soon to be upgraded to 15.2.15 - potentially today), but this is how it was done:

<script type="text/javascript">
/*** sidebar fixes***/
// if there is NOTHING in the side bar this converts the layout to 1 column
if (jQuery("#masterSideBarPanel > ul > li").length === 0) {
jQuery("#masterWrapper").removeClass("yui-t3");
jQuery("#masterSideBarPanel").css("display", "none");
}
</script>

it works. there's a quick distortion (sidebar loads, then disappears as the jQuery runs) when the homepage loads, but it's not really noticeable unless you know about it.

Also, I've not had success using the $ shortcut, I've always needed to replace those with jQuery calls in WCM.

login or register to post comments