Announcement

Collapse
No announcement yet.

Having Different Nav Menu In Each Main Section

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Having Different Nav Menu In Each Main Section

    Hi
    I am trying to find out is there a way to have different nav menu on each main section layout.

    I am trying to get the same look as www.ebuyer.com As they have the top nav bar and if you click on one of the main section. It then bring up a side nav menu with all there sub sections.

    Any help is much appreciated
    Elliott - Weybridge Lights

    www.weybridgelights.co.uk

    #2
    It's certainly possible and relatively easy. You need to understand variables and how to set these at section level (give each option a name equivalent to the tab it's to control and select it on the corresponding TLS with 'use parent' enabled). Have a block running on the entiresectionlist which only shows sections from the active one (filter the entiresectionlist so it only shows sections that are level 2 and equal to the contents of the variable). For 10 tabs, you'd have 11 instances of the entiresectionlist running, one for each of the tabs and the 11th is for all other pages when you are not on a section.

    If you then want the selected tab or button to be highlighted when clicked, then you need to get involved with CSS and i'd recommend using a body id (variable) at section level, ideally the same variable that sets what section it is to keep things simple. The tabs or buttons use a background image via css, so when you are on the active page, you use the body id to override the position of the background image, thus making it look selected and the active one. Have one image for the tabs, that is the normal, hover and selected color all together in one image, you just move it around by css positioning then.

    Probably best to hand code the tabs or buttons across the top yourself, it'll be easier than using actinic and you can control the text and the order as you wish. These sections seldom change on any site so it is OK to hand code them.

    If you get really involved then you can also get the header on the list to change if you want. Remember you are running 11 instances of the code for the 10 tabs, so you can select whatever happens on each of those instances.

    Comment


      #3
      Thank you for explaining if for me.

      Hoping not be to cheeky.

      I can do the variables bit ok but i am stuck on what to put in the block. Any chance how and what to put in the block.

      Nice site by the way!
      Elliott - Weybridge Lights

      www.weybridgelights.co.uk

      Comment


        #4
        In the block you just need to select the entiresectionlist, it's a standard offering that actinic has already put in place. You then filter that list using a blockif, which checks for the variable name and that section level is 2. Do it in stages, get the block added first and working, then filter it to show section levels that are 2 and then finally filter it by the tab name.

        Comment


          #5
          You can do it with a single loop if you use some PHP outside the EntireSectionList to store the current top-section name.

          E.g. create a Section level variable called TopSectionGroup with its top level value set to "Other" and with Use Parent checked.

          For each top level Section set the value of this variable to something unique for this set of products (Books, Clothing, etc).

          Now the following code in your overall layout will display just the relevant Sections.
          Code:
          <actinic:block php="true">$currentsection = '<actinic:variable name="TopSectionGroup" encoding="perl" selectable="false" />';</actinic:block>
          <actinic:block type="EntireSectionList">
          	<actinic:block php="true">
          		if ( ($currentsection == '<actinic:variable name="TopSectionGroup" encoding="perl" selectable="false" />') && (<actinic:variable name="SectionLevel" encoding="perl" selectable="false" /> == 2) )
          			echo '<a href="<actinic:block if="%3cactinic%3avariable%20name%3d%22IsLoginPageSuppressed%22%20%2f%3e%20AND%0d%3cactinic%3avariable%20name%3d%22UnregCustomersAreNotAllowed%22%20%2f%3e" ><actinic:variable name="SectionPageName" /></actinic:block><actinic:block if="%28%3cactinic%3avariable%20name%3d%22IsLoginPageSuppressed%22%20%2f%3e%20%3d%3d%20false%29%20OR%0d%28%3cactinic%3avariable%20name%3d%22UnregCustomersAreNotAllowed%22%20%2f%3e%20%3d%3d%20false%29" ><actinic:variable name="SectionURL" /></actinic:block>" target="_self"><actinic:variable name='SectionName'/></a><br/>';
          	</actinic:block>
          </actinic:block>
          Norman - www.drillpine.biz
          Edinburgh, U K / Bitez, Turkey

          Comment


            #6
            Don't forget you'll also need to cater for pages that are not sections, but where you do want the top level menu showing, for instance in the cart and on brochure pages. I default to showing the TLS in this instance.

            Comment


              #7
              My bit of code will display nothing on non-section pages (and also on the store-top page). This should work fine for Elliot as he intends to have a horizontal list of top-level sections possibly hard-coded in.

              It would be easy to amend the code above to default to displaying the top-level Sections on all other pages.

              Just amend the if statement to be:
              Code:
              		if ( (($currentsection == '<actinic:variable name="TopSectionGroup" encoding="perl" selectable="false" />') && (<actinic:variable name="SectionLevel" encoding="perl" selectable="false" /> == 2)) 
              			|| (($currentsection == 'Other') && (<actinic:variable name="SectionLevel" encoding="perl" selectable="false" /> == 1))  )
              Norman - www.drillpine.biz
              Edinburgh, U K / Bitez, Turkey

              Comment


                #8
                Originally posted by NormanRouxel View Post
                You can do it with a single loop if you use some PHP outside the EntireSectionList to store the current top-section name.

                E.g. create a Section level variable called TopSectionGroup with its top level value set to "Other" and with Use Parent checked.

                For each top level Section set the value of this variable to something unique for this set of products (Books, Clothing, etc).

                Now the following code in your overall layout will display just the relevant Sections.
                Code:
                <actinic:block php="true">$currentsection = '<actinic:variable name="TopSectionGroup" encoding="perl" selectable="false" />';</actinic:block>
                <actinic:block type="EntireSectionList">
                	<actinic:block php="true">
                		if ( ($currentsection == '<actinic:variable name="TopSectionGroup" encoding="perl" selectable="false" />') && (<actinic:variable name="SectionLevel" encoding="perl" selectable="false" /> == 2) )
                			echo '<a href="<actinic:block if="%3cactinic%3avariable%20name%3d%22IsLoginPageSuppressed%22%20%2f%3e%20AND%0d%3cactinic%3avariable%20name%3d%22UnregCustomersAreNotAllowed%22%20%2f%3e" ><actinic:variable name="SectionPageName" /></actinic:block><actinic:block if="%28%3cactinic%3avariable%20name%3d%22IsLoginPageSuppressed%22%20%2f%3e%20%3d%3d%20false%29%20OR%0d%28%3cactinic%3avariable%20name%3d%22UnregCustomersAreNotAllowed%22%20%2f%3e%20%3d%3d%20false%29" ><actinic:variable name="SectionURL" /></actinic:block>" target="_self"><actinic:variable name='SectionName'/></a><br/>';
                	</actinic:block>
                </actinic:block>
                Thats works great if all your sections have sub section . On our site we have some sections that don't have sub sections.

                In the block you just need to select the entiresectionlist, it's a standard offering that actinic has already put in place. You then filter that list using a blockif, which checks for the variable name and that section level is 2. Do it in stages, get the block added first and working, then filter it to show section levels that are 2 and then finally filter it by the tab name.
                I need to look more into how to use blockif ect as lee lost me on how to do the blockif.

                I will report back when i read up on blockif
                Elliott - Weybridge Lights

                www.weybridgelights.co.uk

                Comment


                  #9
                  Thats works great if all your sections have sub section . On our site we have some sections that don't have sub sections.
                  So surely there's nothing needing to show then. Your OP was:
                  and if you click on one of the main section. It then bring up a side nav menu with all there sub sections.
                  Norman - www.drillpine.biz
                  Edinburgh, U K / Bitez, Turkey

                  Comment


                    #10
                    Originally posted by NormanRouxel View Post
                    My bit of code will display nothing on non-section pages (and also on the store-top page). This should work fine for Elliot as he intends to have a horizontal list of top-level sections possibly hard-coded in.

                    It would be easy to amend the code above to default to displaying the top-level Sections on all other pages.

                    Just amend the if statement to be:
                    Code:
                    		if ( (($currentsection == '<actinic:variable name="TopSectionGroup" encoding="perl" selectable="false" />') && (<actinic:variable name="SectionLevel" encoding="perl" selectable="false" /> == 2)) 
                    			|| (($currentsection == 'Other') && (<actinic:variable name="SectionLevel" encoding="perl" selectable="false" /> == 1))  )
                    That works great Norman. All i need to do is make it look good with CSS.

                    Thank Lee and Norman for all your HELP.
                    Elliott - Weybridge Lights

                    www.weybridgelights.co.uk

                    Comment


                      #11
                      Originally posted by NormanRouxel View Post
                      So surely there's nothing needing to show then. Your OP was:
                      I thought it would look better if there was some sort of menu on the pages that don't have sub sections.

                      I will have to play around with it more when i change me design to see what looks best.

                      Thanks Again
                      Elliott - Weybridge Lights

                      www.weybridgelights.co.uk

                      Comment


                        #12
                        Hi Again
                        I now has this working in actinic and it looks great. I am now trying to add the section name to the top of the list if there it a sub section and add Departments to the top off the list if there is not sub section or if no section is selected.

                        This is what i have so far.
                        Code:
                         <actinic:block if="%3cactinic%3avariable%20name%3d%22TopSectionGroup%22%20%2f%3e%3d%3dOther" >
                        <div class="sectionhead">Departments</div>
                        </actinic:block>
                         <actinic:block if="%3cactinic%3avariable%20name%3d%22SectionLevel%22%20%2f%3e%3d%3d1" >
                        <div class="sectionhead"><actinic:variable name="SectionName" /></div>
                        </actinic:block>
                        
                        <actinic:block php="true">$currentsection = '<actinic:variable name="TopSectionGroup" encoding="perl" selectable="false" />';</actinic:block>
                        <actinic:block type="EntireSectionList">
                        	<actinic:block php="true">
                        		if ( (($currentsection == '<actinic:variable name="TopSectionGroup" encoding="perl" selectable="false" />') && (<actinic:variable name="SectionLevel" encoding="perl" selectable="false" /> == 2)) 
                        			|| (($currentsection == 'Other') && (<actinic:variable name="SectionLevel" encoding="perl" selectable="false" /> == 1))  )
                        			echo '<a href="<actinic:block if="%3cactinic%3avariable%20name%3d%22IsLoginPageSuppressed%22%20%2f%3e%20AND%0d%3cactinic%3avariable%20name%3d%22UnregCustomersAreNotAllowed%22%20%2f%3e" ><actinic:variable name="SectionPageName" /></actinic:block><actinic:block if="%28%3cactinic%3avariable%20name%3d%22IsLoginPageSuppressed%22%20%2f%3e%20%3d%3d%20false%29%20OR%0d%28%3cactinic%3avariable%20name%3d%22UnregCustomersAreNotAllowed%22%20%2f%3e%20%3d%3d%20false%29" ><actinic:variable name="SectionURL" /></actinic:block>" target="_self"><actinic:variable name='SectionName'/></a><br/>';
                        	</actinic:block>
                        </actinic:block>
                        I am having a problems with the block if. I have the "Departments" text added to the top of the non sub section and if anything not selected. I also have the section name displaying on the section with sub sections.
                        But the section name is also displaying on the section with no sub section as well of the "Departments" text

                        I have add three photos to show what is going on.

                        If any one can help me, i would be very great full

                        Thanks
                        Attached Files
                        Elliott - Weybridge Lights

                        www.weybridgelights.co.uk

                        Comment


                          #13
                          You sort my wife out with 2 new bedroom lights cos i'm sick of looking and i'll do your menu - deal?

                          She wants lamps to match too, but happy to pay for them .

                          Comment


                            #14
                            Originally posted by leehack View Post
                            You sort my wife out with 2 new bedroom lights cos i'm sick of looking and i'll do your menu - deal?

                            She wants lamps to match too, but happy to pay for them .
                            I think I sorted it, but knowing me it's probably not the right way.
                            Code:
                             <actinic:block if="%3cactinic%3avariable%20name%3d%22TopSectionGroup%22%20%2f%3e%3d%3d%27Other%27" >
                            <div class="sectionhead">Departments</div>
                            </actinic:block>
                             <actinic:block if="%3cactinic%3avariable%20name%3d%22TopSectionGroup%22%20%2f%3e%20%3e%3d%201%20AND%20%3cactinic%3avariable%20name%3d%22TopSectionGroup%22%20%2f%3e%20%3c%3d%2020" >
                            <div class="sectionhead"><actinic:variable name="SectionName" /></div>
                            </actinic:block>
                            I will take you up on your offer. As your way will be a lot better then mine.

                            Send me a email to tell me what your wife would like or what sort of style and I will sort it out.

                            And you might be able to sort a anther problem out for me. (NOT WEB DESIGN)

                            Cheers
                            Elliott - Weybridge Lights

                            www.weybridgelights.co.uk

                            Comment

                            Working...
                            X