New Template Creation Help

Hello,

I am really sorry to ask this, but i'm in desperate need of help!

I know basic HTML etc. and want to build a template for zen cart to use for my online shop. I bought one from template monster, which I don't mind customizing, but I dont know which files change what, and how to change the layouts of all of the pages (eg product info, the index page, creating sideboxes, shopping cart etc).

I like a lot of white space - I think it helps make things clear and gives a professional image.

Can someone help me? I would love a step-by-step guide on how to create a template, but this may be asking too much.

Also:

• Is it possible to create a sidebox used for customer login?
• Can you have flash sideboxes?

Thank you so much for any help.

Nick.

I'm afraid that a step by step guide to creating a template would be a very large document littered with "it depends" statements, since Zen Cart is so flexible that you can do pretty well anything with it. That can make it seem daunting at first, but a joy to work with once you get over the initial learning curve.

There's lots of information available in the FAQ and Wiki. Not necessarily presented in the easiest of ways to use, but there's also lots of folks here happy to help fill in the gaps.

Unfortunately you're now starting from the best of places, as Template Monster templates are very atypical. Basically they re-write much of the basic template and do so in a rather poor way, rending some of the advice in the FAQ and the forum invalid. When that happens we will be able to advise only that you take your chances with Template Monster's support team.

Your other two questions though are much easier to address. Yes can can have a login sidebox. There's an add-in module in the downloads area specifically for this. There's also no reason why you shouldn't embed flash in a sidebox. There's a blank sidebox add-in, also in the downloads area, and a good wiki entry on embedding flash.

Thank you so much for your reply!

I was looking at another cart today, Avactis, only to discover that the functionality of the cart itself is terrible compared to Zen, but it is much more easy to customize the layout etc.

They have a library of 'tags' that call up certain functions, for example, if I writ a particular 'tag' in the HTML, it will pop in the shopping cart function - does Zen have any functionality like this?

I have the ability to create a site in dreamweaver quite easily, but obviously need to give the components functionality - is it possible to create a zen site using dreamweaver?

In your opinion, where should I start? Which file do i need to edit to change the appearance of the main page? And how do I then keep the design of all subsequent pages consistent?

Is there a way to edit the way in which products ae displayed on the main page? For example, as a list, or a grid?

I'm so sorry to trouble you!

Recent well-constructed applications such WordPress and Drupal also use the approach that you describe, where chunks of functionality are made available through tags or php variables to be inserted into HTML templates.

Some of the more recent e-commerce carts have also adopted this approach. And with good reason. It's a helpful and intuitive approach for template builders. I'd personally love to see Zen Cart move more this way.

However, there is a drawback. As you have observed these carts tend to be a bit lacking in functionality. It's also unclear how well that approach would work in a truly heavyweight cart like Zen Cart, and the development team are evolving a rather more sophisticated approach to page building to cope with this challenge.

Nevertheless there is already has an analogous approach in Zen Cart in its use of template modules. If you look in the template_default/templates folder you will see a range of files that start "tpl_module" and are used to include blocks of functionality such as product listings or additional images.

Thanks again.

Is there some kind of guide that tells you which of these tpl files changes what? And which file to you think I should change first? (ie, which file changes the appearance of the main page layout wise?)

Does the stylesheet only change colours and fonts?

I basically want to replicate the look and functionality of:

http://demo.avactis.com/1.6.0/flowers/

(minus the flowers :) ) But with Zen Cart. would this be hard to do? I just like how clear and well organised everything is.

One more thing, can you have the functionality of a zen sidebox, not in a sidebox? For example, on the link above, the shopping cart is in a table below the header. Could I draw a table and put the code from the sidebox shopping cart file into the table?

Thanks so much!

Sorry, one thing i forgot to put in above :)

If I want to do a clean install of Zen Cart on my server, is there a way to back up the customers who have registered, so that they do not have to register again?

Thanks.

Nick_Sonick:

Thanks again.

Is there some kind of guide that tells you which of these tpl files changes what? And which file to you think I should change first? (ie, which file changes the appearance of the main page layout wise?)

Does the stylesheet only change colours and fonts?

I basically want to replicate the look and functionality of:

http://demo.avactis.com/1.6.0/flowers/

(minus the flowers :) ) But with Zen Cart. would this be hard to do? I just like how clear and well organised everything is.

One more thing, can you have the functionality of a zen sidebox, not in a sidebox? For example, on the link above, the shopping cart is in a table below the header. Could I draw a table and put the code from the sidebox shopping cart file into the table?

Thanks so much!There's nothing that explains that, but I don't think there really needs to be. The filenames themselves are pretty self-explanatory. The one's that you would start with are in the common folder and called tpl_header.php and tpl_footer.php. The tpl_main_page.php file (which deals with everything in between, wouldn't need changing for that design.

Apart from possibly amending the order in which some elements are drawn in the header, the main change that I can see would be add the shopping cart in header mod and most everything else would be done through Admin switches, language files for text and the stylesheet (quite a lot of stylesheet work) and no, it does way more than just control colors and fonts.

Have to say I was shocked that avactis would use a modern approach to templating, but then ruin it by having it produce oodles of nested tables. Theirs is certainly not a ring into which I (or most other self-respecting web designers nowadays) would throw my hat.

Nick_Sonick:

Sorry, one thing i forgot to put in above :)

If I want to do a clean install of Zen Cart on my server, is there a way to back up the customers who have registered, so that they do not have to register again?

Thanks.Are those customers from a Zen Cart or another cart?

Thank you again for your guru-like knowledge :)

The customers I want to back up are in my current installation of Zen Cart. I was enquiring as I want to tidy up my server and SQL database.

Thanks!

Unless you have reason to believe that there is something wrong with your database (unlikely), I'd just do a backup using Backup MySQL Database and then restore that into your sparkling new Zen Cart. Even if it's from an earlier version (from your earlier posts again unlikely) the upgrade would be straightforward.

If you are feeling more confident and just want to keep the customer tables for restoration to the new database, you could do this through whatever means your web host offers for managing MySQL databases (usually phpMyAdmin) and ensure that you backup and restore the following three tables together: customers, customer_info and address_book.

Thank you so much for your help!

You have been so great. I'm gonna try on a test server modifying the template files, and hopefully It'll go live soon!

My current site is https://www.sonicksolaire.co.uk, more functional than stunning, I just want it more clear, concise, and easier to use.

I'm sorry Nick. This is going to be a bit less than helpful.

Your site is based on Template Monster template #15120, a template that for a while didn't even work on Template Monster's own demo site.

You have two problems - firstly your licence probably doesn't allow you to run it on two different sites (I don't know this for sure, but that would usually be the case), and secondly it's badly broken in Internet Explorer 6 and 7. I'd recommend cleaning it up before proliferating it, unless (I write hopefully) your intention is to ditch it and begin the new site from a better starting point.

See, I work on a Mac using Safari, I didn't even know the site did not work on IE!!!

Do you think it's wise to close the site for maintenance?

It was my intention to now write a new template from scratch, what is the best starting point? Maybe the classic green template? How easy is it to create my own sideboxes etc if I know html and have dreamweaver?

Im so sorry to be a pest!

The layout's screwed up. It probably "works" in a functional sense (haven't really tested that), but the right hand column collapses into the center which is then long and thin.

Unless you're doing oodles of business on it anyway, I'd take it down.

How hard a sidebox is to create depends on how much you want to do with it. You can get the base structure from the blank sidebox mod or the editable sidebox mod. If you want to manipulate data, you may need PHP as well.

You're not being a pest. There'd be no point in me coming here to answer questions if people didn't ask them. :wink:

:P

Okay. Im going to install a fresh zen cart on another site of mine, and start by editing the default template - is this the best thing to do?

Sorry, I knew I'd missed out something from my previous response. That was it.

Yes, start from the template_default. Although it looks worse at the outset, that draws attention to things that you should be changing anyway. But I'm sure you're not planning to edit the template_default. Rather you will be copying the files you want to change to your own template and editing them there - yes?

Yeah, that's what I was going to do.

So I basically copy all the files from template_default into a new folder with my template name, set that as my template then edit the files?

No, no, no, no, no. That's what Template Monster do. You don't want to be making that rookie error.

What you do is create a template directory called includes/templates/sonick with just a copy of the template_default/template_info.php file (which you edit appropriately)and another called includes/languages/english/sonick with nothing at all in it.

Then each time you need to make a change to a file that you haven't changed before, you drag it into the folders (or equivalent subfolders below then (e.g. templates/sonick/css for the stylesheet.css). The files you copy will over-ride the ones in template_default. Files you don't need to change will be found in template_default - hence the name.

Ah, okay.

So once I make the directories, do I select the template 'Sonick' from my admin menu, and if I need to change, say, the header, copy the tpl header file into my templates/sonick directory and edit it?

Why does the 'English' directory I make have nothing in it?

Now you're talking.

The english folder only starts with nothing in it. Pretty quickly you'll be adding a header.php, meta_tags.php and probably an index.php too.

I missed one out - it's conceivable that you wouldn't want to copy your english.php to includes/languages/sonick/english.php - you're bound to have changes to that one.