Need some help locating good tutorials, documentation, books

[RKS_213]

I just started using AbleCommerce at work. I have lots of experience with other carts but this one is a great deal more confusing. Jumping from one to the other I have picked it up relatively quickly, but everything here seems a little less intuitive than anything I've worked with before. For example, how do I create menu items? How do i create a menu, for that matter? In other carts I just have to create content, check a box to add it to the menu, specify which menu, done. now it appears on the site as a menu item. So far I haven't seen anything in the UI that resembles adding a menu item or whatnot.

Another thing that I haven't been able to figure out is if I need to use AbleCommerce specific tags when creating layouts. For example, all the sites I have now are already created in HTML and CSS. So if I have a sidebar, I have the id="sidebarRight" but am I supposed to be using a specific sidebar id so AbleCommerce will be able to find it and place content I tell it to place in the sidebar? It would be convenient if I could just burn all their stylesheets and just replace my own, then place my HTML into content body in content creation. But this doen't seem to work since there appears to be very specific ids needed to make AbleCommerce appear correctly.

So if you know of any books or expansive tutorial sites, I'd like to see them. I search a few bookstores on AbleCommerce books but nothing. I've found a pretty good theming guide that explains a lot, but it's focused on just replacing the CSS of another theme. That makes me think I'm supposed to go back through all of my HTML and change it to Able-specific ids like the question above.

Thanks for all your help.

[david-ebt]

You are looking in one of the best resources available for AbleCommerce - the forums. For example, if you search for MENU you'll see a lot of posts with different questions about creating menus. For example "flyout menu" or "vertical menu" will result in some specific types of menu posts.

You can also find good resources on the AbleCommerce help site (http://help.ablecommerce.com/) and wiki (http://wiki.ablecommerce.com).

AbleCommerce uses ASP.NET templates for layout. The layout defines if you have a one, two or three column layout. The customization section of the help guide can be found at http://help.ablecommerce.com/mergedProj ... _store.htm. You'll definitely benefit from reading the Customizing Your Store, Customizing your Pages and Scriptlet Management sections.

You'll also want to have some good tools for working with CSS from within your browser. Those tools will be of tremendous help when you're trying to adjust the look of an element on a page.

Once you've reviewed those materials, you're best place for more information is these forums.

Good luck!

[RKS_213]

Thanks. I have seen things about creating flyouts and dropdowns, etc, but just creating the simple navigation menu is not covered. Nor is disabling sidebars for certain pages, i.e. the homepage has no sidebars. These things are not in the Wiki, documentation here, or searching in the forums. At least not by the keywords I've used ("hide sidebar", "remove sidebar", "disable sidebar" etc and other logical phrases.)

What's more, despite putting in CSS resets, AbleCommerce is putting tables everywhere with their own CSS somewhere and mucking up my design with these sidebars and tables.

So in short I *think* I'm supposed to be creating my own menus and puttingthem in "Standard Header" under content. But I still haven't found a way to hide sidebars and prevent AbleCommerce from putting tables into my content regions.

Thanks.

[RKS_213]

Ok, so I have to create the page in the content area under admin, then go to the page and select "one column"? Why not just do it while creating?

[david-ebt]

Yes, that's what you need to do to create new pages. You can also make copies of an ASPX page (like the default.aspx) and make changes that way. We've done both. Some customizations are stored in the database and other things are stored in scriptlet files under App_Data/Scriptlets, so the new page creation process isn't a single step.

What other carts have you worked with? The PHP-based carts we've looked at had their files scattered all over the file system. We really like the .NET control mechanism used by Able. We can put our controls in the CUSTOM folder and not have to worry about them being overwritten by an update. We can make separate variations of a control for different clients/scenarios or extend a control with options - whichever is best at the moment.

Regarding the tables that you see in the HTML source of a page, those are usually put there by Microsoft. Many of their .NET controls (like the grid or repeater controls) render tables instead more CSS-friendly layouts. It can be a pain, but you can usually get to the specific element you want to adjust using CSS. We use FireFox and the Web Developer add-on to find out the full CSS path for an element. You can do the same thing with FireBug. I think the new web developer tool for IE9 will let you do the same thing.

[mouse_8b]

Here is a quick crash course:

Configuring your dispaly pages is a pretty handy thing to do. Display pages are .aspx files in the root directory. Able has a number of default ones, but its probably necessary to make some of your own. Each display page keeps up with its own Active Layout, Header, Footer, Content, and Left and Right Sidebars. All of those sections (Active Layout, Header, etc) pull from Scriptlets. Each page in your store that shares a display page will pull the same Scriptlets. So, for example, if you have a generic layout for all webpages on your site, you can simply set the "Display Page" or "Layout" field on the edit page, and all of the layout, header, footer, etc, that go with that display page will be applied to that webpage. On my site, there are 4 different types of webpages, so I have Webpage.aspx, Webpage2.aspx, Webpage3.aspx, and Webpage4.aspx in my home directory, and each of these use a different set of Active Layout, Header, Footer, Right and Left Sidebar. Use the "Edit Page" option at the bottom of your pages when viewing the site to set the Scriptlets for each display page. Also use Website > Default Page Styles in the Admin section to set the default display pages.

Note: when creating a new .aspx file (in your favorite text editor), at the bottom, there is a section to declare which Scriptlets to use with that page. That section is only useful the first time you run that .aspx page. If you change anything by browsing to the page and selecting "Edit Page" at the bottom, those changes will be saved in the database, and the bottom section of the .aspx file will be worthless. It took me a while to figure that out.

If you are going to make your own theme, then you will need your own folder under /App_Themes with a custom Scriptlets folder (/App_Themes/Your_Theme/Scriptlets/Custom). The theme folder also needs to hold your CSS, javascript, images, and anything else that is theme related. For heavy customizations, you may also need to customize ConLib controls. Put customized ConLIbs in /ConLib/Custom, and be sure to update the Scriptlet that calls the customized ConLib Control.

Able is a bit confusing at times, but once you wrap your head around it, it can be pretty powerful.

[RKS_213]

Thanks. I will look over both your recommendations. I will have to look over it all closer later.

[RKS_213]

How do you apply all changes you make to a specific type of layout across all pages? For example, we already have all the hundreds of products created but I just now finished the design and setting it to three column. How do I now get every product to accept the same layout etc for the one I just created. Right now, all the products are still set to one column and I don't think I'm supposed to go back through and manually set them all to three column.

Thanks.

[mouse_8b]

Admin > Website > Default Page Styles. As long as you left "Display Page" set to "Inherit" on the Edit Product page, all products should use the display page that you set as default.

[RKS_213]

I don't see a Default Page Styles in my list but I have some default page settings under Themes and Display Pages. Problem is I don't see anything to do with the three column layout I'm using. I have Category Display Page, roduct Display Page (and that only has Basic Product or Basic Product 2 but not the Three Column), and Webpage Display Page. All the products are set to have Basic Product page already, but they are all set for One Column under layout.

[mouse_8b]

Ah. It sounds like you are using a slightly older version of Able. The funtionality is the same, but I think they re-arranged that menu recently. But onto the issue at hand...

If I understand you correctly, you set your Active Layout, Header/Footer, and Sidebars, and now you need all the other products to follow suit.



Whichever display page you saved those settings to (the .aspx file listed in the upper right side of the "Edit Page" box) is the one that you should set in the default page settings. You wont see the options like "3 column" in the default page settings because those values go along with the display page. If you need more display pages than come with Able, copy the one of the .aspx pages in your site root, name it whatever you want, change the "title" attribute in the first line, and change the name and description. Now this page will have its own set of Active Layout, Header, Footer, Sidebars.

This is what the top of a display page .aspx file should look like:

Code: Select all

<%@ Page Language="C#" MasterPageFile="~/Layouts/Scriptlet.master" Inherits="CommerceBuilder.Web.UI.AbleCommercePage" Title="View Webpage" %>
<%@ Register Assembly="CommerceBuilder.Web" Namespace="CommerceBuilder.Web.UI.WebControls.WebParts" TagPrefix="cb" %>
<%-- 
<DisplayPage>
    <Name>Basic Webpage</Name>
    <NodeType>Webpage</NodeType>
    <Description>A basic display handler for webpages.  It shows the webpage content with standard headers and footers.</Description>
</DisplayPage>
--%>

[RKS_213]

Ok. Thanks for doing all that work. I wasn't looking down there on the "edit page" section. I was in the admin menu. I just tried it and it works just fine. Thanks for pointing that out to me as I'd probably have never gotten it today. That whole section there is one of the things that really gets on my nerves but once I start thinking about it more I probably won't miss as much.

Thanks again for your help.

[RKS_213]

[quote="david-ebt"Regarding the tables that you see in the HTML source of a page, those are usually put there by Microsoft. Many of their .NET controls (like the grid or repeater controls) render tables instead more CSS-friendly layouts. It can be a pain, but you can usually get to the specific element you want to adjust using CSS. We use FireFox and the Web Developer add-on to find out the full CSS path for an element. You can do the same thing with FireBug. I think the new web developer tool for IE9 will let you do the same thing.[/quote]

I use Firebug pretty regularly but after looking around, the tables are in AC scriptlets for their layout. Not to be mean, but you can get three columns without a table and they should have fixed that when the standard changed from tables to divs. I'm going through now and cutting all the tables from their layout scriptlets like three columns etc.

@AC

Maybe on your next rollout you should join the rest of the Internet in doing away with tables?

[mouse_8b]

If you have any questions about converting your tables to divs:
viewtopic.php?f=44&t=11968

The layouts are the easy part, you can whip up a layout from scratch pretty easily. When you start changing ConLibs is where the fun starts.

[RKS_213]

Thanks for that, Mouse. I just took a look at your site, and it looks good but in the content region all of your blocks are overlapping. I think you might have just tweaked something recently and didn't notice.

Thanks for all the help.