Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Forcing zencart to display within my template

Forcing zencart to display within my template

Locked

Views: 667

Results 1 to 3 of 3
This thread is locked. New replies are disabled.
13 Jul 2009, 6:26 PM
#1
froman2686 avatar

froman2686

New Zenner

Join Date:
Jul 2009
Posts:
6
Plugin Contributions:
0

Forcing zencart to display within my template

Hey guys. I just finished a redesign of a client's website that has a fixed area for displaying content. While building the design, I just assumed I would be able to iframe the content and call it a day. I'm now learning, through various forum posts, that iframing zencart essentially breaks it.

I've attached the picture of the design below. What I want to do is use the whitespace of the paper on top of the folder to display the site: product listings, news, faqs, the forums, and of course, shopping cart and checkout processes. I love zen cart, and I spent a lot of time setting up the admin with the old site design (it's awful) so I'm willing and able to do some heavy lifting to get this working. I just don't know if I can without using iframes.

http://farm4.static.flickr.com/3510/3717832062_d40467f254_b.jpg
13 Jul 2009, 6:33 PM
#2
kobra avatar

kobra

Black Belt

Join Date:
Aug 2005
Location:
Arizona
Posts:
31,500
Plugin Contributions:
4

Re: Forcing zencart to display within my template

Yes, you can get 99% of this as a look...

It appears that you need no header or footer and will have to make most things in ZenCart transparent(css) so that your design shows through.

Make your design image a body background image mostly..

18 Jul 2009, 4:05 AM
#3
froman2686 avatar

froman2686

New Zenner

Join Date:
Jul 2009
Posts:
6
Plugin Contributions:
0

Re: Forcing zencart to display within my template

Okay, I've been able to get the background to display correctly. This site exists as one large, dynamically resized image, with the exception of the content which I have dynamically shaped into the whitespace using CSS calls. Everything appears good and works that way I want it to.

The major hurdle I've come across is the tab navigation. I cannot figure out any way to put the tabs where I want them, and dynamically resize/reposition them for all possible resolutions. I got them working at my own resolution in chrome, but once I view the site in a different browser, the tabs move out of alignment.

I've been using CSS top and left to position the tab. I attempted to use max-width to force the tab to resize, but it never moves in tandem with the rest of the folder (as in, it floats off of it to the top and left.)

At this point, I'm completely stumped. Javascript calls don't seem to work, because although they can resize the image dynamically, they can't move it to the correct position. I seem to need a way of having the tab aware of where the folder top is, and positioning itself appropriately. Anyone have any insights?