CSS buttons v2.x

[Three Sisters]

Well, I guess I did something wrong. I installed the css button mod... did everything according to the readme.txt (so I thought) and the settings in admin>configuration>layout settings are not changed at all. I can't enable the "Automaticly load image buttons if found" because it's not there. And further more, I can't even turn off the css buttons. They are there regarless of whether I select yes or no under enable css-buttons. (I'm pretty sure that option has been available since I did a fresh ZenCart v1.3.6 install about a month ago.)

Should I re-run the sql patch that was mentioned in step one? I've gone back over all my steps checking and re-checking and that's the only thing I haven't done 'cause I'm not sure if it's OK to do that....

So, if you could spare the time to coach me I'd be forever grateful!

[Three Sisters]

Oh a couple more questions:

Does stylesheet_css_buttons_popups.css really belong in the extra folder and not in the yourtemplate/css folder?

And just to make sure I fully understand, the "catalog" folder was representive of whatever folder my ZenCart files were installed in, right? I know that is probably an obvious answer to most of you, but I am new to all of this and wouldn't want to miss something because of an ignorant assumption!

Smiles!

[Three Sisters]

I think I'm working too hard on this.... It was all right there in front of my eyes! Couln't see the forest for all the trees!

All you developer folk are great! Thanks for the great contrib!

[paulm]

Thanks for letting us know it works, and you already found the answers to your questions yourself! :-)

[hareslade]

Hi
Has anyone got a working site demo with this, so we can see how it looks?

Thanks

[paulm]

It does not really have a look (the look it currently does have is not very interesting). It's just another way to create buttons, handy if you don't like to create/use an image for every button.

You could say that the buttons become "little boxes" that are styled by CSS.

(Current versions of Zen Cart have this feature built in by default, this mod is meant to be an improvement of the build in version)

[maca2406]

Hi paulm.

I am testing their great contribution module, but I am having a problem with EZ Pages navigation Previous-Home-Next buttonsbuttons. Problem is that the buttons are aligned in the center in column form. I want to align them in the center but in horizontal form.

Original zencart stylesheet_css_buttons.css doesn't have this problem, although it has others that their excellent module solves .

I am using zencart 1.3.7 and 1.3.6 for testing and with both I obtain the same problem. Remove their stylesheet_css_buttons.css and problem resolved, but you will know, others problems become present.

Any idea.

Another queston: I add border to the buttons, but it are square corners buttons. Any form to make circular border buttons???

I modified the code a little for the border.

Thank you for your help.

[maca2406]

paulm

This is my modification to stylesheet_css_buttons.css, for if you need to know:

/* css buttons */
.cssButton, .cssButtonHover {
font: bold 1.1em Verdana, Arial, Helvetica, sans-serif;
/* to center the button texts vertically line-height and height need to be equal */
line-height: 1.5em;
height: 1.5em;
border: 2px outset #F4F4F4;
color: #4e387e;
background: #f0f1f0 !important; /* !important to retain the background color after auto form field coloring fix */
white-space: nowrap;
text-align: center;
cursor: pointer;
margin: 1px;
padding: 0 0.5em;
}
.cssButtonHover, a:hover .cssButton, input.cssButton:hover {
color: red;
background: #f0f1f0 !important;
}
/* bof some IE comp. stuff */
.cssButton, .cssButtonHover{
/* _width: 0; needed to stop IE adding "magic" padding to the input, _witdh is a hack that uses an IE bug */
/* to remove this hack move the width setting to an IE specific stylesheet */
_width: 0;
overflow: visible;
}
/* eof some IE comp. stuff */
span.cssButton, span.cssButtonHover{
/* added to get the right line-height */
display: block;
}
.navNextPrevWrapper span.cssButton, .navNextPrevWrapper span.cssButtonHover{
/* note that the diplay inline removes line-height from the element (depending on doctype settings) */
display: inline;
}
/* css popups */
.cssButtonLinkPopup strong, .cssButtonSubmitPopup strong{
display: none;
}
span.cssButtonLinkPopup, span.cssButtonSubmitPopup{
border-style: inset;
position: relative;
}
a:hover .cssButtonLinkPopup strong, span.cssButtonSubmitPopup:hover strong{
display: block;
position: absolute;
top: 2em;
left: 0;
color: black;
background: #fe3;
}
td .cssButton, td .cssButtonHover{
/* prevents buttons taking the full width of table cells */
display: inline;
}

[paulm]

An url could help, so I can see what happens.

[maca2406]

Sure.

This is my test site: http://test.tecnomallcr.com/

No code modification there. Please, enter to EZPages to see the problem with the: Previous-Continue-Next buttons, that are in column form

Thank you.