Soft round corners -2.... Where to put the CODE???

Hi, i have a friend who helping me with a new layout but his problems is to find were to add some code. He knows NOTHING about ZC but ALL about php--:thumbsup:

We want something like this sketch and have also figurate were to put some code by our self, see at the pictures below.

We would really appreciate if someone could point out were to look/change to make ZC to look like our sketch.

Sketch

And this is what we done till now....

Anyone :unsure:

If you have these as images and can slice them up, you can create and controll this from the stylesheet.css file.

For an example, get the future zen template in the downloads area. This has thebasic css code required and what you need to do is provide the correct image and name. Then style it with margins, background colors, padding etc

Yes, that is exactly what we have done and also messed little with tpl_box_default_right.php and tpl_box_default_left.php.

But where to make changes to make the white big center square ???? I know nothing about php ccs… And he does not have the time to ask questions here (holydays :yuck: ) so he helps me if i can find the in formations he needs… :wacko:

Not easy for me and for sure, not easy to answer for you.:unsure:

I have the "bits" but a lazy friend:thumbsup:

Thanks/
Peter

If you have the future zen template css find the entry for the title_bg.gif and alter this with your image, and if you want a vertical repeat etc

You would need to edit the CSS for the .centerColumn the easiest way to get which files exactly is to do a search for that element in admin/tools/developers toolkit. I believe ( don't quote me ) you might have to change a few template pages not just one to get the "effect" on all pages; But I know that would be a good start.

Kobra is pointing you in the right direction, but there's a key piece of information that we can't really tell from your screenshot and that's whether your layout is fixed width or has some degree of horizontal liquidity.

If it's fixed width the task is much easier and you wouldn't have any need to mess with the tpl_box_default_right.php and tpl_box_default_left.php. You would however need to insert some additional divs into tpl_main_page.php. Specifically 2 each around the main layout table and just inside the centercolumn table cell. Other than that it's background images in CSS using the sliding doors method.

BTW. Kobra is right that the futureZen template is the closest thing to this currently and points the way on some aspects, but it doesn't use the sliding doors method which is the best way to do this. So time to bite the bullet methinks. future Zen v1.2 will be along within the next couple of hours demonstrating this superior approach to background images.

Hehe - Thanks guys for your wisdom. Kuroi, i'm looking forwards to see you demonstrating Future-Zen's potential :yes: :yes:

PeterBKK:

Hehe - Thanks guys for your wisdom. Kuroi, i'm looking forwards to see you demonstrating Future-Zen's potential :yes: :yes:Apologies, it took longer than planned after my 3 year decided to help. However, she's now in bed and the new version is awaiting approval in the downloads section.

I'd been meaning to make these changes for some time since the sliding doors method is rather more flexible than that which I originally used for future Zen. It's also the right method for your design and, together with my earlier comment, will hopefully show you everything you need to achieve your design.

Sliding doors methods :unsure:
I have no idea what you ate talking about but i hope my php-friend does :huh:

Should we use your new FZ as a base? The shop can have a "fix" design with the same wideness as the Classis shop (760px).

I have never seen any ZC-shop with a picture behind the "shop area"... Is it possible?? For us it is not necessary as we only need to visualizing the frame around it. Or??? I ask because I planed to have a very light grey portrait like a “watermark” in the background.

Its hard for me to ask the right questions. I just know how i want it to look.

Note: The shop is going to wholesale baby clothes and accessories to stores and other wholesalers.

Anyone here who can help me to do this design?? I already have the squares (MM-fireworks). I can pay for it but not to much. I hade planed to open the shop now on friday but starts to get worried.

PeterBKK:

Sliding doors methods :unsure:
I have no idea what you ate talking about but i hope my php-friend does :huh:It's a CSS technique, so no particular reason that your php-expert friend should know it. But it simply consists of placing two background images one over the other so that as a box stretches they move apart and as it contracts one rides over the other, giving the impression of an expandable image.

PeterBKK:

Should we use your new FZ as a base? The shop can have a "fix" design with the same wideness as the Classis shop (760px).I suspect that you are currently using the classic template, which is intended for upgrading from earlier versions of Zen Cart and is not recommended for building new ones. The future Zen template is designed to engage the full power of the current version of Zen Cart, and version 1.2 is most of the way to what you want to achieve, so I would certainly recommend it as your starting point.

PeterBKK:

I have never seen any ZC-shop with a picture behind the "shop area"... Is it possible?? For us it is not necessary as we only need to visualizing the frame around it. Or??? I ask because I planed to have a very light grey portrait like a “watermark” in the background.This can be done, though you would need to think about happens as more or less information is added to the site. I suggest attaching your watermark to the major items within the center column such as new products or featured products rather than the center column shop area itself. Also would you be using product pictures with transparent backgrounds? Otherwise the watermark could end up being obscured in what I suspect might be a rather unattractive way.

Thanks for your answer. Are you able to see my two pictures???

The lower picture of the website has a picture on each side that repeats-x… Is that a sliding door?? How can that help us to make the 3D-frames around center???

The smaller squares are made sa your in FZ but we uses 4 different sets with 4 different colors… That took my friend 2 hour to make (he had to find how the system was build). But he has no idea were to put code for the BIG white square and the smaller one in the center that will display “New Products For July”, “Monthly Specials For July” and the productlistning…

PeterBKK:

Thanks for your answer. Are you able to see my two pictures???If you meanm the two pictures in your original post, then yes.

PeterBKK:

The lower picture of the website has a picture on each side that repeats-x… Is that a sliding door?? How can that help us to make the 3D-frames around center???No, that's a repeat. That's the approach used in the original version of future Zen, but would be more complicated than it needs to be to achieve your desired result.

PeterBKK:

The smaller squares are made sa your in FZ but we uses 4 different sets with 4 different colors… That took my friend 2 hour to make (he had to find how the system was build). But he has no idea where to put code for the BIG white square and the smaller one in the center that will display “New Products For July”, “Monthly Specials For July” and the productlistning…Having seen your site on a different thread, I suspect that your friend is trying to solve this by generating complex tables and embedding images in them. The HTML that is being produced is very well laid out, but much, much more complicated that it needs to be. My original post answered the question about where to put code for the big white square and the samller one, but it does assume that you or he know how to then use CSS to style that code.