CSS based layout (tableless)
CSS based layout (tableless)
Is it possible to have an ablecommerce store that doesn't use tables for it's layout (site structure)?
If so, can I see some demonstration(s) of such stores to see the capabilities - if there are any out there?
I've only managed to find table based sites so far.
Advice and pointers on skinning a tableless layout would also be very welcome.
Cheers,
Rob
If so, can I see some demonstration(s) of such stores to see the capabilities - if there are any out there?
I've only managed to find table based sites so far.
Advice and pointers on skinning a tableless layout would also be very welcome.
Cheers,
Rob
-
- Lieutenant (LT)
- Posts: 78
- Joined: Wed Mar 05, 2008 11:27 am
Re: CSS based layout (tableless)
Out of the box, I don't think there's any tableless layouts included. You can override the standard templates, but its probably a lot of work and isn't upgradable. Even if you did, you would still have to restructure all of the user controls in the ConLib directory. Many of them use tables to display data. I'm hoping this will change in future releases.
Re: CSS based layout (tableless)
Current layout of AbleCommerce makes use of tables for structuring and there is no div based structure available out of the box. In order to accomplish a div based template you would need to customize all store pages, scriptlets and ConLib controls those are making use of tables for formatting.
-
- Ensign (ENS)
- Posts: 9
- Joined: Tue Jun 22, 2010 2:13 pm
Re: CSS based layout (tableless)
I seriously would like to see Able Commerce to modify their UI to support DIV and CSS layouts versus using HTML Table tags which are very outdated. Most of the popular ecommerce toolkits have switched to using themes/skins that use modern standards with DIV tags and CSS controlling the layout.
Please consider this recommendation as this is one main sticking point from switching to your platform.
Thanks
Please consider this recommendation as this is one main sticking point from switching to your platform.
Thanks
- clevername
- Lieutenant (LT)
- Posts: 54
- Joined: Tue Jan 11, 2011 8:54 am
Re: CSS based layout (tableless)
It is not a very easy thing to change a lot of the design to table less. But the main problem I found in doing that is most programmers that you have help with you site every now and then, don't necessarily know the ins and outs of CSS well enough to accomplish somethings without tables.
And I agree that their table design is rather out dated but for how sophisticated the cart is, the fact that the layout has tables is a very small drawback.
But there is nothing stopping you from changing the layout. A place to start would be the "Content and Layout" section under the Website link on the dashboard. You can see where the table layout is made for each style of page(one column, left sidebar, etc. ). I would copy one, rename it, and edit that new one in case you need to revert back. Then go to your desired theme (App_Themes) and you will need to change all of the CSS to reflect the new layout design. To do this I suggest copying style.css, rename it and use the new UpdatedStyle.css for all your new layout styles. I suggest this because the layout structure and design as a ripple effect. If you change one table or td style, it will show up in places you had no idea related. So I guess I am saying do it section by section so as not to mess up too much in the process, then go back and compress and compile your CSS if needed.
If you want to know more let me know.
And I agree that their table design is rather out dated but for how sophisticated the cart is, the fact that the layout has tables is a very small drawback.
But there is nothing stopping you from changing the layout. A place to start would be the "Content and Layout" section under the Website link on the dashboard. You can see where the table layout is made for each style of page(one column, left sidebar, etc. ). I would copy one, rename it, and edit that new one in case you need to revert back. Then go to your desired theme (App_Themes) and you will need to change all of the CSS to reflect the new layout design. To do this I suggest copying style.css, rename it and use the new UpdatedStyle.css for all your new layout styles. I suggest this because the layout structure and design as a ripple effect. If you change one table or td style, it will show up in places you had no idea related. So I guess I am saying do it section by section so as not to mess up too much in the process, then go back and compress and compile your CSS if needed.
If you want to know more let me know.
-
- Ensign (ENS)
- Posts: 9
- Joined: Tue Jun 22, 2010 2:13 pm
Re: CSS based layout (tableless)
Thanks for the information. I agree it could be done via CSS and modifying the theme however I have ran into issues with other programs modifying templates and themes and the upgrades would break our changes. Every upgrade would require us to modify the theme files again. Not sure if that is how AbleCommerce would work with changes to templates and upgrades, but it would be nice to see a more modern theme/template engine
Thanks
Thanks
-
- Commander (CMDR)
- Posts: 129
- Joined: Thu Oct 19, 2006 5:33 pm
Re: CSS based layout (tableless)
Another vote for table-less AbleCommerce. That's the main reason keeping me with other e-comm solutions for the time being.
- clevername
- Lieutenant (LT)
- Posts: 54
- Joined: Tue Jan 11, 2011 8:54 am
Re: CSS based layout (tableless)
OR you could hire a freelancer/Design company who is good with AbleCommerce
-
- Commander (CMDR)
- Posts: 129
- Joined: Thu Oct 19, 2006 5:33 pm
Re: CSS based layout (tableless)
I have no issues in creating skins or themes for AC, or any other ecommerce package for that matter. The point is not that you should find people good at working with tables, it's that *most* software packages have followed the trends of the web and gone to CSS-based layouts. To be able to completely redesign your site every 1-2 years with CSS would be great. With tables, you must break everything down and rebuild which is very inefficient.OR you could hire a freelancer/Design company who is good with AbleCommerce
I don't expect them to change this over night, but it would be nice to see them plan it for the near future.
- clevername
- Lieutenant (LT)
- Posts: 54
- Joined: Tue Jan 11, 2011 8:54 am
Re: CSS based layout (tableless)
I agree.. but as a freelance designer, you should support the cause lol.
I think the way they did the table layout was easier at the time of writing this software and to jump to CSS based would mean rewriting every bit of their code calling a table as well as all of there theme designs. It would be a hefty job, but I agree that it is a job that must be done.
I think the way they did the table layout was easier at the time of writing this software and to jump to CSS based would mean rewriting every bit of their code calling a table as well as all of there theme designs. It would be a hefty job, but I agree that it is a job that must be done.
Re: CSS based layout (tableless)
I have had success with a table-less site. It does take heavy customization of a lot of scriptlets and ConLib controls, but it will work. The scriptlet parts are pretty straightforward since its just messing with HTML. Editing ConLib controls are a bit more complicated, but I've worked out a process to convert TABLEd controls into DIVed controls. First step, open up the control's .ascx file. Use the find & replace feature of your favorite text editor to change all <table, <tr, <td, <th, </table, </tr, </td,</th, to <div and </div, respectively. Notice there are no closing tags ('>'), you don't want to skip over or overwrite any attributes the table tags may have had.
Once you have your DIV soup, you can start adding in your own CSS classes, deleting redundant DIVs, and generally making the control your own. DO NOT change any id attributes of any table (now div) tags; the code-behind files rely on these ids to do their fancy magics. Technically, there are some you can change, but make sure you know what you are doing first. If you need to move around ASP.NET tags, make sure you move the whole block. (<asp:xx>..</asp:xx>). Lastly, remember to save it in the custom folder!
You can look at http://www.barknpurr.com to see a DIV based theme that was professionally designed and I integrated. It has taken me a few days to integrate his DIV based layout into a new AC installation. It takes maybe an hour to set up a page worth's of scriptlets, and the rest of the time is wrestling with ConLib.
I hope this helps someone. It is a lot of work, but I do believe it is worth it.
Once you have your DIV soup, you can start adding in your own CSS classes, deleting redundant DIVs, and generally making the control your own. DO NOT change any id attributes of any table (now div) tags; the code-behind files rely on these ids to do their fancy magics. Technically, there are some you can change, but make sure you know what you are doing first. If you need to move around ASP.NET tags, make sure you move the whole block. (<asp:xx>..</asp:xx>). Lastly, remember to save it in the custom folder!
You can look at http://www.barknpurr.com to see a DIV based theme that was professionally designed and I integrated. It has taken me a few days to integrate his DIV based layout into a new AC installation. It takes maybe an hour to set up a page worth's of scriptlets, and the rest of the time is wrestling with ConLib.
I hope this helps someone. It is a lot of work, but I do believe it is worth it.
Last edited by mouse_8b on Mon Jan 09, 2012 3:49 pm, edited 1 time in total.
Re: CSS based layout (tableless)
>> I hope this helps someone. It is a lot of work, but I do believe it is worth it.
Just to let you know, this is VERY helpful.
Just to let you know, this is VERY helpful.
- deverill
- Lieutenant (LT)
- Posts: 64
- Joined: Tue Jan 06, 2009 11:58 am
- Location: Key West, FL
- Contact:
Re: CSS based layout (tableless)
Just remember that with the extensive customization of the conlibs you may have significant difficulty upgrading to the next version that makes changes to the conlibs. Our business rules and directors have required us to make changes to almost every conlib we use and it is painful to update.
Jim Sewell - Web Programmer
Trusted Tours & Attractions
Trusted Tours & Attractions