Simple Zen + my screenshot design possible?

I ask this unsure if this is asking too much or not. I am new to php and have been working on a site design on my nights/weekends for a startup jewelry business. I designed this and hoped to make it fit the zen-cart as best as possible.

Anyway, Simple zen seemed to be the best template to begin with but I'm a bit lost and look for help from others that have been down this same path. I want to strip the zen down to the basics and keep the aesthetics high. I have seen a few zenners out there that have nice jewelry site. I'm not making enough money out of this deal to warrant every waking breath, but I do want a job done well too. Anyway. Applicable links, faq's that will work with what I'm doing will be awesome. Here's how far I've gotten currently. Obviously I have some work ahead of me. The business side is working, but we're not taking orders yet.

http://www.thatsbeadiful.com/store

First I would suggest that you turn off the new products among any others on the main page

admin > config > index listing > Show New Products on Main Page > set to "0"

Then If you have a bit of html savvy, edit your defines_main_page.php file through the admin > tools > defines page editor > main_page.php.

This will accept most all html commands.

You can use the slick text wrap approach or just create a table for the text left aligned and one for the images next to it

Well the client today said, where are the new products @ so they'd like to keep them. Now just to figure out how you can say only have the 3 newest products, 2, 5 etc

That is also settable in the admin

Absolutely doable. Its quite my opinion that anything is doable in zen cart... just a matter of whether or not you are capable of doing it. Personally, what I would do is make that WHOLE top of the site, including the NECKLACES BRACELETS EARRINGS CONTACT FAQ section the logo.gif.

Then, I'd make those links work via an image map.

So then all you have left is the body background, the center content (I'd break up that rounded box into three images, top curve, left and right sides, bottom curve), and the footer.

Not too complicated at all, IMO. :D

I have jumped in headfirst doing this on and off nights & weekends. I'm primarily a photographer learning php. Totally related right? Well, sounds like you guys are really helpful and I'm doing a lot of reading. Trying to mod this simple_zen template to fit my application. Main thing is the drop down menus. They want em, & I can't cleanly set them up. Apple_zen is a decent template I noticed, but it didn't work when I chose it. I think the busy weekend with some bad things happening have messed up my progress.

Image Map, I'll search it to see what you're talking about but feel free to reply what that is.
You can see my personal site/blog/portfolio in the works... https://www.andydonnan.com

b16_madman:

Apple_zen is a decent template I noticed, but it didn't work when I chose it.

What do you mean by "it didn't work when I chose it"?

You'll probably get better descriptions of what an image map is from google than from me. :D

Hey I'm sorry all I said was "it didn't work" I'm going to redownload that template and give it another shot and download a fresh V of the simple zen. First off thanks for these templates. And your help.

Image maps, oh it means that a image can have several links to several sections. I really like the fact that she can add more categories later on without anyone needing to edit an image map. They haven't complained with the categories yet, but definitely an idea.
The logo.gif I want to span across the 750px width or maybe it's 745px i've forgotten. Anyway, that logo will have a link or 2 or 3 but all those cat's unless it was a drop down could get cluttered.

For the disclaimer/aboutus/privacy policy etc. I want to put all that in a simple footer link. Well I"m going to work on it for a while and see what I come up with.

b16_madman:

Hey I'm sorry all I said was "it didn't work" I'm going to redownload that template and give it another shot and download a fresh V of the simple zen. First off thanks for these templates. And your help.

Image maps, oh it means that a image can have several links to several sections. I really like the fact that she can add more categories later on without anyone needing to edit an image map. They haven't complained with the categories yet, but definitely an idea.
The logo.gif I want to span across the 750px width or maybe it's 745px i've forgotten. Anyway, that logo will have a link or 2 or 3 but all those cat's unless it was a drop down could get cluttered.

For the disclaimer/aboutus/privacy policy etc. I want to put all that in a simple footer link. Well I"m going to work on it for a while and see what I come up with.

I got your PM about apple zen, didn't know who you were or what you were talking about, till I saw that this thread was updated. So you have a pm from me basically going "HUH?". LOL

There's nothing wrong with the apple zen template, you have an extra </div> in your site.

If you remove this extra closing div (i'm not sure what' file it's off hand, but the surrounding HTML should help narrow down where its at -perhaps includes/YOUR_TEMPLATE/common/tpl_main_page.php or includes/YOUR_TEMPLATE/templates/tpl_index_default.php) :

</div>

Hey thanks. Did you get the chance to see it while I had applezen live? I went ahead and kept along with the simple_zen template though. working on it right now actually. do you have msn or aim? b16madman is my aim and msn is [email protected]
I have to add you first though for it to work.
I've added in the header image as logo.gif. I'd like it to be .jpg though really, but to edit what filename it calls that's outside of the templates right? somewhere else...
Also, I like the idea of the image maps, so I told in the stylesheet

#logo {
width:750px;
float:left;
}
I'd like to get that shadow.gif to work with my 750px by 150px header image...maybe, yeah i do haha. I tried this with no luck. Have the shadow image right under each of the dynamic categories & have a bit more of the black head to go into the main categories. That would mean that all of the categories can't sit on top of beadiful betty's head.

#logoWrapper {
background: url(../images/shadow.gif) repeat-x bottom;
height:155px;
width:750px;
}

Next is just to get those categories listing in a nicer font (in my opinion) & move those nice icons provided back up into the header.

Taking a lil break, your help is amazing.

Alright. I'm further down the road when it comes to finishing this site, but my clients are getting antsy and I'm growing tired of the site... just kidding, I just want to get this up and working.
Problems:
visually ie7 screws up the category names at the top, no suprise, but it works fine in all other browsers I believe (safari, firefox etc)
I was speaking with jettrue about how to aleviate the vertical issue and I modified in the css this:
#navCatTabsWrapper {
margin: 0em;
font-weight: italic;
width: 100%;
font-size:1.5em;
position:relative;
top:-20px;
}
I also may just go with putting up graphic buttons instead for it to go better with the site theme. The easy way is to edit the tpl_header.php, but once I'm inside it I don't want to mess up the php code and break the site. Is this the div I'll need to edit?

Checkout issues: my client wants paypal as an option, but also wants people to not have to sign up with paypal to buy an item, that's feasible within paypal right as well? Anyway, hope to finish this thing up by the weekend.

b16_madman:

Alright. I'm further down the road when it comes to finishing this site, but my clients are getting antsy and I'm growing tired of the site... just kidding, I just want to get this up and working.
Problems:
visually ie7 screws up the category names at the top, no suprise, but it works fine in all other browsers I believe (safari, firefox etc)
I was speaking with jettrue about how to aleviate the vertical issue and I modified in the css this:
#navCatTabsWrapper {
margin: 0em;
font-weight: italic;
width: 100%;
font-size:1.5em;
position:relative;
top:-20px;
}
I also may just go with putting up graphic buttons instead for it to go better with the site theme. The easy way is to edit the tpl_header.php, but once I'm inside it I don't want to mess up the php code and break the site. Is this the div I'll need to edit?

<div id="headerWrapper">

Checkout issues: my client wants paypal as an option, but also wants people to not have to sign up with paypal to buy an item, that's feasible within paypal right as well? Anyway, hope to finish this thing up by the weekend.

Hi There!

I was thinking about this further, and I think if I were you, I'd do it graphically. I'd redesign the logo with the category images and all, so just one big image. Then you can use an image map in the header to get the category links to work. Then you can just turn off the navcattabs all together.

TADA!

I'd like a thin black line around each tab, so taht when it's on that page that the black line forms around it to better set it off from each other, that is horizontal, but ehh, they're not paying for perfection.
Drop a line on how to do what i'm envisioning if you care