Navigation treeview or flyout menus?

This forum is where we'll mirror posts that are of value to the community so they may be more easily found.
User avatar
compunerdy
Admiral (ADM)
Admiral (ADM)
Posts: 1276
Joined: Sun Nov 18, 2007 3:55 pm

Post by compunerdy » Thu Feb 28, 2008 8:40 am

So..is it the category display page or the tree code that makes it work differently?

User avatar
jmestep
AbleCommerce Angel
Posts: 8164
Joined: Sun Feb 29, 2004 8:04 pm
Location: Dayton, OH
Contact:

Post by jmestep » Thu Feb 28, 2008 9:31 am

It is the tree code that makes it different.
Sorry, but the site I'm working on is on my own computer, so I can't send a link.
Judy Estep
Web Developer
jestep@web2market.com
http://www.web2market.com
708-653-3100 x209
New search report plugin for business intelligence:
http://www.web2market.com/Search-Report ... -P154.aspx

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

Compunerdy

Post by Jinx » Thu Feb 28, 2008 9:57 am

What are you looking for your navigation to do?

Check this site out (http://www.etillastuffedanimals.com)is this what you want it to do? Or what exactly do you want... Sorry things are slow for me this morning.

User avatar
cerami2
Lieutenant Commander (LCDR)
Lieutenant Commander (LCDR)
Posts: 103
Joined: Thu Nov 08, 2007 5:29 am
Location: Plymouth MN
Contact:

missing gifs were do I find them

Post by cerami2 » Fri Feb 29, 2008 4:42 am

were do i find the images folder.gif,folders.gif ect for this menu

thanks
Joe

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

Image Folder

Post by Jinx » Fri Feb 29, 2008 7:13 am

Inside the image folder in your theme you can create a folder called CategoryTreeView and place your collapse and expand images in there. Remember though you have to point to the correct image directory in the CategoryTreeView.ascx file that you should have placed in your Custom folder inside the ConLib directory.

User avatar
jmestep
AbleCommerce Angel
Posts: 8164
Joined: Sun Feb 29, 2004 8:04 pm
Location: Dayton, OH
Contact:

Post by jmestep » Tue Mar 04, 2008 6:38 pm

Jinx--
How did you get the NodeWrap=true to work?
When I put it into the code in this topic from Bumbles, it doesn't show up as one of the properties of the

<ComponentArt:TreeView id="TreeView1"
Width="200px"
DragAndDropEnabled="false"

etc.....

When I look at the code in the admin CatalogTreeView.aspx, the format is different and it can be used in the asp:TreeView.
Did you change Bumbles' code to accomodate that?

<%--
<ComponentArt:TreeView id="CategoryTreeView" runat="server" EnableViewState="true">
</ComponentArt:TreeView>
--%>

<asp:TreeView ID="CategoryTreeView" runat="server" EnableViewState="true" OnSelectedNodeChanged="CategoryTreeView_SelectedNodeChanged" ImageSet="Simple" ShowLines="true" NodeWrap="true">
</asp:TreeView>
Judy Estep
Web Developer
jestep@web2market.com
http://www.web2market.com
708-653-3100 x209
New search report plugin for business intelligence:
http://www.web2market.com/Search-Report ... -P154.aspx

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

Yes

Post by Jinx » Wed Mar 05, 2008 6:53 am

I went to the Component Art website and saw that variable with the list of variables that component art had listed for TreeView so I just added it with the other variables that where being used in Bumbles code and it just worked. Ill list my code below... Nevermind our file server is down right now. I can post my code here within the next half hour if you like.

User avatar
jmestep
AbleCommerce Angel
Posts: 8164
Joined: Sun Feb 29, 2004 8:04 pm
Location: Dayton, OH
Contact:

Post by jmestep » Wed Mar 05, 2008 12:09 pm

Yes, please do. I looked on the Component Art site earlier and couldn't find it.
Judy Estep
Web Developer
jestep@web2market.com
http://www.web2market.com
708-653-3100 x209
New search report plugin for business intelligence:
http://www.web2market.com/Search-Report ... -P154.aspx

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

OK

Post by Jinx » Wed Mar 05, 2008 1:10 pm

OK, in my CategoryTreeView.ascx file that is located in my Custom folder in the ConLib Directory I have this code...

<asp>
<asp>
<h2><asp></asp></h2>
</asp>
<asp>
<ComponentArt>
<Templates>
<ComponentArt>
<Template>
<b><DataBinder></b>
</Template>
</ComponentArt>
</Templates>
</ComponentArt>
</asp>
</asp>

By looking above you can see where I put the nodewrap..

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

Darn

Post by Jinx » Wed Mar 05, 2008 1:11 pm

I screwed up my code Let me repost in a quote or something

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

Code

Post by Jinx » Wed Mar 05, 2008 1:12 pm

Code: Select all

<asp> 
    <asp> 
       <h2><asp></asp></h2> 
    </asp> 
   <asp> 
        <ComponentArt> 
            <Templates> 
                <ComponentArt> 
                    <Template> 
                        <b><DataBinder></b> 
                    </Template> 
                </ComponentArt> 
            </Templates> 
        </ComponentArt> 
    </asp> 
</asp>

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

CODE

Post by Jinx » Wed Mar 05, 2008 1:13 pm

<asp:Panel ID="MainPanel" runat="server" CssClass="section">
<asp:Panel ID="HeaderPanel" runat="server" CssClass="header">
<h2><asp:Localize ID="HeaderTextLabel" runat="server" Text="Categories"></asp:Localize></h2>
</asp:Panel>
<asp:Panel ID="TreePanel" runat="server" CssClass="content">
<ComponentArt:TreeView id="TreeView1" width="192"
DragAndDropEnabled="false"
NodeEditingEnabled="false"
KeyboardEnabled="true"
CssClass="CatTreeView"
NodeCssClass="CatTreeNode"
SelectedNodeCssClass="CatSelectedTreeNode"
HoverNodeCssClass="CatHoverTreeNode"
NodeIndent="10"
NodeWrap="true"
ShowLines="false"
EnableViewState="false"
runat="server">
<Templates>
<ComponentArt:NavigationCustomTemplate id="SelectedCategoryTemplate">
<Template>
<b><%# DataBinder.Eval(Container.DataItem, "Text") %></b>
</Template>
</ComponentArt:NavigationCustomTemplate>
</Templates>
</ComponentArt:TreeView>
</asp:Panel>
</asp:Panel>

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

Notice

Post by Jinx » Wed Mar 05, 2008 1:14 pm

Notice I set the width of the component as well as setting the nodewrap

User avatar
jmestep
AbleCommerce Angel
Posts: 8164
Joined: Sun Feb 29, 2004 8:04 pm
Location: Dayton, OH
Contact:

Post by jmestep » Wed Mar 05, 2008 1:50 pm

Thanks. I have put it in,but VS 2005 still has green squiggly. We'll see how it does anyway.
Judy Estep
Web Developer
jestep@web2market.com
http://www.web2market.com
708-653-3100 x209
New search report plugin for business intelligence:
http://www.web2market.com/Search-Report ... -P154.aspx

sjdj
Ensign (ENS)
Ensign (ENS)
Posts: 16
Joined: Mon Feb 09, 2004 12:51 pm

Product images are replacing folders.gif & folder.gif im

Post by sjdj » Fri Mar 07, 2008 7:30 am

I have installed the /ConLib/Custom/CategoryTreeView.ascx that was developed and provided by Compunerdy and Bumbles and it is working well except for one thing... small product images are replacing the folders.gif and folder.gif images. Do you have any idea how that is happening?

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

Judy

Post by Jinx » Fri Mar 07, 2008 7:55 am

Judy might be able to help better here as I actually don't like the folder icons so I disabled them so my actual text links control the opening of folder structure. The only advice I have is make sure you are pointing to the proper graphics in your custom/categorytreeview.ascx file. Double check that path so you know you have input it correctly. Anything you want to add Judy?

User avatar
jmestep
AbleCommerce Angel
Posts: 8164
Joined: Sun Feb 29, 2004 8:04 pm
Location: Dayton, OH
Contact:

Post by jmestep » Fri Mar 07, 2008 10:01 am

I changed the images in the code like this:
CollapseImageUrl=""

I think what you might we seeing are images you put into the thumbnail field for the category.
Judy Estep
Web Developer
jestep@web2market.com
http://www.web2market.com
708-653-3100 x209
New search report plugin for business intelligence:
http://www.web2market.com/Search-Report ... -P154.aspx

Bumbles
Ensign (ENS)
Ensign (ENS)
Posts: 14
Joined: Mon Dec 10, 2007 1:43 am

Re: Product images are replacing folders.gif & folder.gi

Post by Bumbles » Fri Mar 07, 2008 2:42 pm

sjdj wrote:... small product images are replacing the folders.gif and folder.gif images. Do you have any idea how that is happening?
As Judy said, it's the images you put into the thumbnail field for the category. If you don't want this, then in /ConLib/Custom/CategoryTreeView.ascx, search for the line that says:

Code: Select all

node.ImageUrl = subcat.ThumbnailUrl;
and remove it.

User avatar
jmestep
AbleCommerce Angel
Posts: 8164
Joined: Sun Feb 29, 2004 8:04 pm
Location: Dayton, OH
Contact:

Post by jmestep » Fri Mar 07, 2008 3:27 pm

Can one of you guys who is smarter than I am tell me the difference between Bumbles' tree view and the one in the Able admin--Catalog/CategoryTree.aspx?
I'm trying to use the Able one because I can get the long category names to wrap in there and I can't in the custom one.
Bumbles' has code like this:

Code: Select all

   <asp:Panel ID="TreePanel" runat="server" CssClass="content">
      
        <ComponentArt:TreeView id="TreeView1"
            
            Width="220px"
            DragAndDropEnabled="false"
            NodeEditingEnabled="false"
            KeyboardEnabled="true"
            CssClass="CatTreeView"
            NodeCssClass="CatTreeNode"
            SelectedNodeCssClass="CatSelectedTreeNode"
            HoverNodeCssClass="CatHoverTreeNode"
            DefaultImageWidth="16"
            DefaultImageHeight="16"
            ExpandCollapseImageWidth="15"
            ExpandSelectedPath="true"
            ExpandCollapseImageHeight="15"
            NodeIndent="8"
            ItemSpacing="3"
            NodeLabelPadding="3"
            CollapseImageUrl=""
            ExpandImageUrl=""
            ParentNodeImageUrl=""
            LeafNodeImageUrl=""
            ShowLines="false"
            EnableViewState="false"
            runat="server">
            <Templates>
                <ComponentArt:NavigationCustomTemplate id="SelectedCategoryTemplate">
                    <Template>
                        <b><%# DataBinder.Eval(Container.DataItem, "Text") %></b>
                    </Template>
                </ComponentArt:NavigationCustomTemplate>
            </Templates>
        </ComponentArt:TreeView>
    </asp:Panel>
</asp:Panel>
and the Able one has code like this and I can't use all the features that Bumbles' has- this shows a couple of properties I could change. There is no asp:Panel that wraps it either:

Code: Select all

<%-- 
<ComponentArt:TreeView id="CategoryTreeView" runat="server" EnableViewState="true">
</ComponentArt:TreeView>
--%>

 <asp:TreeView ID="CategoryTreeView" 
            runat="server" EnableViewState="false" 
            OnSelectedNodeChanged="CategoryTreeView_SelectedNodeChanged" 
            ImageSet="Simple" 
            ShowLines="false" 
            NodeWrap="true"
            Width="220px"
            CssClass="CatTreeView"
            NodeIndent="8"
            CollapseImageUrl=""
            ExpandImageUrl=""
            
>
</asp:TreeView>
Judy Estep
Web Developer
jestep@web2market.com
http://www.web2market.com
708-653-3100 x209
New search report plugin for business intelligence:
http://www.web2market.com/Search-Report ... -P154.aspx

User avatar
jmestep
AbleCommerce Angel
Posts: 8164
Joined: Sun Feb 29, 2004 8:04 pm
Location: Dayton, OH
Contact:

Post by jmestep » Sat Mar 08, 2008 8:40 am

Has anyone had any problem using the component as far as an error message about it being the trial version? I'm getting a message that it is the demo version and please reload the page and you can purchase here.
I had a trial version on my computer a couple of years ago, so maybe that is what is happening?
Judy Estep
Web Developer
jestep@web2market.com
http://www.web2market.com
708-653-3100 x209
New search report plugin for business intelligence:
http://www.web2market.com/Search-Report ... -P154.aspx

Bumbles
Ensign (ENS)
Ensign (ENS)
Posts: 14
Joined: Mon Dec 10, 2007 1:43 am

Post by Bumbles » Sat Mar 08, 2008 11:47 am

Judy, it might be a similar problem to the one you had with the icons. For some reason the properties when set directly didn't work, but when set in code they did (I should really try and figure out what's the cause of that). For now you could try modifying the InitializeCategoryTree method.

Somewhere after the line:

Code: Select all

TreeView1.ImagesBaseUrl = "/App_Themes/" + Page.Theme + "/images/CategoryTreeView/";
add something like:

Code: Select all

TreeView1.NodeWrap = true;
I haven't tested this so don't know for sure if it will work, but it's worth a try. If this works, then any other properties that you want to set on the treeview component should be set in the same way.

I've never had any messages about being on a trial/demo version so can't help there, sorry.

User avatar
jmestep
AbleCommerce Angel
Posts: 8164
Joined: Sun Feb 29, 2004 8:04 pm
Location: Dayton, OH
Contact:

Post by jmestep » Sat Mar 08, 2008 12:09 pm

Thanks, I tried that and it didn't like it there either.
I think I figured out what my problem was with the component message above. I found a file in my bin folder called ComponentArt.Web.UI.dll.refresh and I deleted that so the menu is OK so far.
Judy Estep
Web Developer
jestep@web2market.com
http://www.web2market.com
708-653-3100 x209
New search report plugin for business intelligence:
http://www.web2market.com/Search-Report ... -P154.aspx

User avatar
bha
Lieutenant, Jr. Grade (LT JG)
Lieutenant, Jr. Grade (LT JG)
Posts: 44
Joined: Tue Mar 11, 2008 6:04 pm

Very Nice!

Post by bha » Thu Mar 13, 2008 3:14 pm

Thanks for sharing. Very Clean. Excellent instructions and performs stellarly.

User avatar
Jinx
Lieutenant (LT)
Lieutenant (LT)
Posts: 56
Joined: Thu Sep 28, 2006 8:09 pm
Location: Omaha, NE
Contact:

Code Issue

Post by Jinx » Mon Mar 17, 2008 11:12 am

The code works excellent. I have found one big problem though. The Navigation uses Javascript and does not degrade if javascript is not enabled. The javascript to me personally is not an issue due to our stats showing almost 100% use of javascripts enabled for users but our SEO guy is railing me for integrating an AJAX navigation component. He says that google and other search engines HATE javascript and if you have javascript for navigation elements it is unable to spider through the links properly. We have google site map set up so it is finding its way but is this true for SEO purposes?

Will
Captain (CAPT)
Captain (CAPT)
Posts: 263
Joined: Fri Oct 05, 2007 8:02 am

Post by Will » Mon Mar 17, 2008 11:21 am

If it's the only way to navigate to your pages, it will probably hurt your ranking in Google and other search engines.

I wouldn't rely on the Google site map alone.

Post Reply