Templating in CS Cart 3

I have successfully made a module that lets you get around the new grid system to create highly custom layouts with no bloat. While it is theoretically possible to create any layout with the grid system, it's function is questionable when you realize to achieve that for many many designs it is impossible to move them about freely and keep the design. This problem complicates with the fact to achieve many effects you'd have to use negative margins, lots of div wrappers and possibly relative and absolute positioning where a simple floated div structure or table would before have sufficed creating more markup, more css, and making it harder to maintain and increases complication in implementing a design.



If you are to make designs to consider the grid system it works great but for those that want the designer to have complete freedom in design I have made a module. I call it Easy Template. It's currently in it's alpha stage and I was wondering about user interesting in this module. I have it running on the current project I am working on and have permission contractually to resell this and other modules made for the project with exclusion of one.

Hi



you need to shoe either images or a demo site would be even better.



Is sounds good, but you know by yourself better, that designers need to see that live…



Fotis

Both of those have to wait until the project is live. I was just gauging an interest. Hopefully this is done in 3 weeks and I can publish it after that.

Link Removed

Well, it's finished and it works.



Live site using it: Link Removed

Hi



any backend images?



Fotis

Well I could screencap it in the admin menu but it is all in the template there's no configuring. You turn it on and you have new things available to you in the smarty templates for the store.



You can call a block at any point as long as it's setup for your page. You don't have to use the grid system basically. So you can put your block anywhere you desire in the template and have exact control over it.



Example:

The index.tpl in stock cs cart 3 has only {render_location} and a few things in the head and it uses the grid system to determine placement. However for advanced designs using the grid system is cumbersome at best.



Easy Template allows you to put blocks where you want them how you want them and call them based on name.



We call all blocks now with:

{“Block Name”|fn_easy_template_show_block:$blocks:'template/file.tpl'}



note the final part template/file.tpl is optional. It allows you to override what was given in the block manager in the admin and use whatever template file you desire. If none is specified it uses the default specified in the template manager. This is an addon for developers and designers who feel the grid system is far too cumbersome to achieve what they desire for a complicated or diverse layout but wish to maintain the benefits of using cs cart 3.



This is taken from the name in the stores blocks and design area.



So you can do things like:




{"Top Menu"|fn_easy_template_show_block:$blocks:''}





This would then show the top menu block as specified in the block manager in the cs cart admin using the template file specified there.



Search would use blocks/top_search.tpl and the easy template addon will assign all the necessary data to that template in a format you expect. It's made to make templating easier in the case where a grid layout will take a lot of work to implement via negative margins etc, or a case where you don't want your client moving around blocks that depend on certain orders to look right for your design and breaking the site.



Regards,

Chisum

Some images below as per request





The blocks page for the homepage:

Maybe I am missing the point. But your image looks identical to the default cs-cart 3.03 block system.

[quote name='Triplets' timestamp='1349475380' post='146482']

Maybe I am missing the point. But your image looks identical to the default cs-cart 3.03 block system.

[/quote]



Like I said above, it allows you to use blocks but without having your layout enforced by the Grid system. It goes back to a more cs cart 2.0 approach for templating while allowing you to use the benefits of cs cart 3.

But I like the grid system. Why move backwards when a new more modern way is introduced? Grid systems are taking over the Internet. Don't fight them. Learn how to use them correctly.



I also looked at your site and it looks like every other cs-cart site. Nothing there that couldn't be done with the grid system and css.



The one feature I would like to see is the ability to move grids. The current grid and block system works well, but movable grids in the cscart block GUI would take it to the next level.

[quote name='Triplets' timestamp='1349479154' post='146493']

But I like the grid system. Why move backwards when a new more modern way is introduced? Grid systems are taking over the Internet. Don't fight them. Learn how to use them correctly.



The one feature I would like to see is the ability to move grids. The current way works, but movable grids in the cscart block GUI would take it to the next level.

[/quote]



I'm glad it works for you but it doesn't work for everybody especially with designs as I described above. It's just… very limiting. And the ability to move blocks in a grid can break layouts then you have your customer accidentally moving a block that shouldn't be moved and it looks like crud. Like say you have a top nav or top bar that needs things in certain orders for them to fit together properly.



It is nice for a grid system to exist for people that can make use of it, people that won't be changing the design much just the css or making color schemes or something. Or people who enjoy blocky looking websites that don't have boxes that overflow into each others backgrounds for nice visual effects. But for those of us who want complete control and wish to make advanced designs the grid system simply adds too much time and bloat to development, maintenance and all else. I'm not alone in this feeling. Just newer doesn't mean always better. Check out this post on stack overflow if you are unconvinced still:

javascript - 960gs (Grid System) and best html/css practice - Stack Overflow



Particularly this reply:

“I think it's great for a basic layout, but if you're doing client work, I would encourage you to work with your own layout. That may be a 960 layout after all, but don't rely on it. Fluidity and flexibility are very important to clients”



These are the opinions of me and other professional web developers. This addon allows for more advanced layouts without the bloat of the 960 grid system. It doesn't do anything else but I made it from hand because I believed it was important and now I'm sharing it with others if they're interested. I haven't decided on pricing yet but I would like to polish it a bit first and then offer it to customers at a reasonable price. (Costing far less than it would take to develop it themselves). That's how these things work isn't it? I mean if the addon doesn't suit your need or needs that is fine you don't have to purchase it, it's here for those who can make use of it. If, on the grounds of policy, or philosophy you think this addon shouldn't exist I don't think that has a place on the forum here. I mean, if everyone agrees with you no one else will buy this addon or need it. And if they don't agree with you this addon is here if they choose to use it. I just don't think the grid system is reliable for advanced designs that is all.