Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Snazzy for center boxes

Snazzy for center boxes

Locked

Views: 2,577

Results 1 to 20 of 21
This thread is locked. New replies are disabled.
5 Jan 2009, 2:51 PM
#1
cla74 avatar

cla74

New Zenner

Join Date:
May 2008
Location:
Italy
Posts:
83
Plugin Contributions:
0

Snazzy for center boxes

Hi all
Can someone help me to apply snazzy rounded corners to center boxes such featured products box and specials box?
which tempalte i have to modify??
Thanx

5 Jan 2009, 4:45 PM
#2
kobra avatar

kobra

Black Belt

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

Re: Snazzy for center boxes

I believe there are a couple of the free templates that use this to some extent. You can check how they have done it

5 Jan 2009, 4:47 PM
#3
cla74 avatar

cla74

New Zenner

Join Date:
May 2008
Location:
Italy
Posts:
83
Plugin Contributions:
0

Re: Snazzy for center boxes

Can you tell me where i can found them?

5 Jan 2009, 5:09 PM
#4
stevesh avatar

stevesh

Black Belt

Join Date:
Feb 2005
Location:
Lansing, Michigan USA
Posts:
19,793
Plugin Contributions:
2

Re: Snazzy for center boxes

http://(sorry, site offline)

5 Jan 2009, 5:12 PM
#5
cla74 avatar

cla74

New Zenner

Join Date:
May 2008
Location:
Italy
Posts:
83
Plugin Contributions:
0

Re: Snazzy for center boxes

Sorry,but there arent templates look like what im sayng!!!
Dont you know how can i do that??

5 Jan 2009, 7:39 PM
#6
kobra avatar

kobra

Black Belt

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

Re: Snazzy for center boxes

NiftyZen uses css rounded corners for the main wrapper and you can see how they applied it - then move this to the center column an use snazzy in a similar manner

5 Jan 2009, 7:42 PM
#7
cla74 avatar

cla74

New Zenner

Join Date:
May 2008
Location:
Italy
Posts:
83
Plugin Contributions:
0

Re: Snazzy for center boxes

Sorry,where i can find NiftyZen??

5 Jan 2009, 7:46 PM
#8
kobra avatar

kobra

Black Belt

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

Re: Snazzy for center boxes

Sorry,where i can find NiftyZen??
How about the free software add ons link at the top of this page

5 Jan 2009, 7:48 PM
#9
cla74 avatar

cla74

New Zenner

Join Date:
May 2008
Location:
Italy
Posts:
83
Plugin Contributions:
0

Re: Snazzy for center boxes

kobra:

How about the free software add ons link at the top of this page
Sorry:blush:

5 Jan 2009, 7:52 PM
#10
fairestcape avatar

fairestcape

Totally Zenned

Join Date:
Mar 2008
Location:
Cape Town & London (depends on the season)
Posts:
2,957
Plugin Contributions:
0

Re: Snazzy for center boxes

I just create image(s) with rounded corners and then call them via a declaration in the stylesheet. While I did not do this for centre column boxes, I did it for sideboxes on one site (https://www.edutrade.co.uk) but as kobra points out, just apply the principle to centre boxes.

5 Jan 2009, 7:54 PM
#11
cla74 avatar

cla74

New Zenner

Join Date:
May 2008
Location:
Italy
Posts:
83
Plugin Contributions:
0

Re: Snazzy for center boxes

fairestcape:

I just create image(s) with rounded corners and then call them via a declaration in the stylesheet. While I did not do this for centre column boxes, I did it for sideboxes on one site (https://www.edutrade.co.uk) but as kobra points out, just apply the principle to centre boxes.
Ok,but i dont know which files to use to apply snazzy!?!

5 Jan 2009, 7:58 PM
#12
fairestcape avatar

fairestcape

Totally Zenned

Join Date:
Mar 2008
Location:
Cape Town & London (depends on the season)
Posts:
2,957
Plugin Contributions:
0

Re: Snazzy for center boxes

I'm not familiar with "snazzy" . What are "snazzy" rounded corners... do you have a URL example?

5 Jan 2009, 8:01 PM
#13
kobra avatar

kobra

Black Belt

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

Re: Snazzy for center boxes

cla74:

Ok,but i dont know which files to use to apply snazzy!?!
As we can not in a forum environment write your code nor know exactly what it is you are wanting....this is why we are pointing you to other resources so you can see/visualize at the file level how others have done similar things. It will be up to you to learn from their application how to apply as you want

5 Jan 2009, 8:03 PM
#14
cla74 avatar

cla74

New Zenner

Join Date:
May 2008
Location:
Italy
Posts:
83
Plugin Contributions:
0

Re: Snazzy for center boxes

kobra:

As we can not in a forum environment write your code nor know exactly what it is you are wanting....this is why we are pointing you to other resources so you can see/visualize at the file level how others have done similar things. It will be up to you to learn from their application how to apply as you want
I want center boxes such featured products box and special box to be rounded.

5 Jan 2009, 8:06 PM
#15
kobra avatar

kobra

Black Belt

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

Re: Snazzy for center boxes

Again - Look to how others have accomplished similar things

5 Jan 2009, 8:10 PM
#16
cla74 avatar

cla74

New Zenner

Join Date:
May 2008
Location:
Italy
Posts:
83
Plugin Contributions:
0

Re: Snazzy for center boxes

kobra:

Again - Look to how others have accomplished similar things
I've already searched!!Nothing for center boxes

5 Jan 2009, 8:12 PM
#17
kobra avatar

kobra

Black Belt

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

Re: Snazzy for center boxes

From my post #6

KoBra:

NiftyZen uses css rounded corners for the main wrapper and you can see how they applied it - then move this to the center column an use snazzy in a similar manner
Get creative!

5 Jan 2009, 8:18 PM
#18
fairestcape avatar

fairestcape

Totally Zenned

Join Date:
Mar 2008
Location:
Cape Town & London (depends on the season)
Posts:
2,957
Plugin Contributions:
0

Re: Snazzy for center boxes

OK, so I think you are trying to embed this stuff:

Css

#xsnazzy h1, #xsnazzy h2, #xsnazzy p {margin:0 10px; letter-spacing:1px;}
#xsnazzy h1 {font-size:2.5em; color:#fff;}
#xsnazzy h2 {font-size:2em;color:#06a; border:0;}
#xsnazzy p {padding-bottom:0.5em;}
#xsnazzy h2 {padding-top:0.5em;}
#xsnazzy {background: transparent; margin:1em;}

.xtop, .xbottom {display:block; background:transparent; font-size:1px;}
.xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;}
.xb1, .xb2, .xb3 {height:1px;}
.xb2, .xb3, .xb4 {background:#d4d4d4; border-left:1px solid #08c; border-right:1px solid #08c;}
.xb1 {margin:0 5px; background:#08c;}
.xb2 {margin:0 3px; border-width:0 2px;}
.xb3 {margin:0 2px;}
.xb4 {height:2px; margin:0 1px;}

.xboxcontent {display:block; background:#d4d4d4; border:0 solid #08c; border-width:0 1px;}

Html

<div id="xsnazzy">
<b class="xtop"><b class="xb1"></b><b class="xb2"></b><b class="xb3"></b><b class="xb4"></b></b>
<div class="xboxcontent">

CENTREBOX CONTENT HERE

</div>
<b class="xbottom"><b class="xb4"></b><b class="xb3"></b><b class="xb2"></b><b class="xb1"></b></b>
</div>

Am I on the right track?

5 Jan 2009, 8:29 PM
#19
cla74 avatar

cla74

New Zenner

Join Date:
May 2008
Location:
Italy
Posts:
83
Plugin Contributions:
0

Re: Snazzy for center boxes

fairestcape:

OK, so I think you are trying to embed this stuff:

Css

#xsnazzy h1, #xsnazzy h2, #xsnazzy p {margin:0 10px; letter-spacing:1px;}
#xsnazzy h1 {font-size:2.5em; color:#fff;}
#xsnazzy h2 {font-size:2em;color:#06a; border:0;}
#xsnazzy p {padding-bottom:0.5em;}
#xsnazzy h2 {padding-top:0.5em;}
#xsnazzy {background: transparent; margin:1em;}

.xtop, .xbottom {display:block; background:transparent; font-size:1px;}
.xb1, .xb2, .xb3, .xb4 {display:block; overflow:hidden;}
.xb1, .xb2, .xb3 {height:1px;}
.xb2, .xb3, .xb4 {background:#d4d4d4; border-left:1px solid #08c; border-right:1px solid #08c;}
.xb1 {margin:0 5px; background:#08c;}
.xb2 {margin:0 3px; border-width:0 2px;}
.xb3 {margin:0 2px;}
.xb4 {height:2px; margin:0 1px;}

.xboxcontent {display:block; background:#d4d4d4; border:0 solid #08c; border-width:0 1px;}

> 
> **Html**
> 
> ```
<div id="xsnazzy">
<b class="xtop"><b class="xb1"></b><b class="xb2"></b><b class="xb3"></b><b class="xb4"></b></b>
<div class="xboxcontent">

CENTREBOX CONTENT HERE

</div>
<b class="xbottom"><b class="xb4"></b><b class="xb3"></b><b class="xb2"></b><b class="xb1"></b></b>
</div>

Am I on the right track?
Ok you are on the right path :clap:
But where is its template?

5 Jan 2009, 9:22 PM
#20
fairestcape avatar

fairestcape

Totally Zenned

Join Date:
Mar 2008
Location:
Cape Town &amp; London (depends on the season)
Posts:
2,957
Plugin Contributions:
0

Re: Snazzy for center boxes

NiftyZen template uses exactly the same principle, so my advice is to download that template and see how the css is applied.

To apply the same feature to centre boxes, there are a number of TPL files that will need editing - and each one may have a different structure, but you could start by looking at the code that drives:

tpl_modules_specials_default.php

and this may give you pointers on where to add the extra div classes and ID's.