CSS buttons v2.x

[paulm]

Thanks Paul

A fixed version (2.61) is attached to this post, including your new admin stylesheet (added to extras/ folder) and some minor readme changes (to extras/css_hack.txt).

2.60 users only need to fix the typo, as explained by funky

[miriam_t]

Hi,

perhaps this is easy for you cracks?!

During installation of this cssbuttons.sql I got the following MySQL-Error:

INSERT INTO `configuration_group`
VALUES ( NULL , 'CSS Buttons', 'The settings for the CSS buttons are stored here (please also enable "admin :: Configuration :: Layout Settings :: CSS Buttons", else the search buttons will not be converted to css buttons).', @sortorder +1, 1
);

MySQL notices:
#1136 - Column count doesn't match value count at row 1

I think it is due to line 1 in the cssbuttons.sql:

SELECT @sortorder:=max(sort_order)
FROM configuration_group;

INSERT INTO `configuration_group` VALUES (NULL , 'CSS Buttons', 'The settings for the CSS buttons are stored here (please also enable "admin :: Configuration :: Layout Settings :: CSS Buttons", else the search buttons will not be converted to css buttons).', @sortorder+1, 1);
SELECT @cssbuttonsid:=max(configuration_group_id)
FROM configuration_group;

What should I change to fix this?

Thanks in advance!

Best regards,
Miriam

[paulm]

Can you replace the first part (up to #SELECT @cssbuttonsid;) of the sql by this

# "CSS buttons advanced" settings
# 2007/06/14
# use the Zen sql patch tool, and copy and paste into the text area

SELECT @sortorder:=max(sort_order)
FROM configuration_group;

INSERT INTO configuration_group (configuration_group_id, configuration_group_title, configuration_group_description, sort_order, visible)
VALUES (NULL , 'CSS Buttons', 'The settings for the CSS buttons are stored here (please also enable "admin :: Configuration :: Layout Settings :: CSS Buttons", else the search buttons will not be converted to css buttons).', @sortorder+1, 1);
SELECT @cssbuttonsid:=max(configuration_group_id)
FROM configuration_group;

?

And tell me if it helps?

[[email protected]]

Hi Paul,

I'm a novice zenner and have successfully installed, configured and customised your CSS-buttons_v2.34 and am very happy with the result. Thanks for the many months of work you have put into this.

The resulting CSS buttons are at www.clandonpottery.co.uk/Shop

What I can't work out is the origin of the CSS button text for 8 of my 18 CSS buttons. These are:

search. add selected item . tell a friend . refresh . add to basket . continue and confirm order.

I simply want to put a capital letter at the start of each but just cannot find the source of these texts. Can you direct me?

Also, I would like to substitute the DELETE button from the Shopping Cart for a CSS button but can't work out how to do this.

Your suggestions appreciated.

Regards,
Peter

[paulm]

Something I totally overlooked is that it may be smart to replace the "<input />" buttons code by "<button></button>". It would probably offer better and more flexible cross browser compatible layout control.

HTML <button> tag
Definition and Usage

Defines a push button. Inside a button element you can put content, like text or images. This is the difference between this element and buttons created with the input element.

(source http://www.w3schools.com/tags/tag_button.asp)

[jhs]

Hello,

I wonder if this contribution is able to do roll-over image buttons.
If yes, how to define them in the CSS?

Thanks

[robraymond]

Is there a reason why the text on my form buttons isn't centered vertically.

Here's one of my pages: http://excalibur.bc.ca/index.php?main_page=login

[robraymond]

Well I seem to have fixed it, I commented out:

line-height: 20px;
height: 20px;

Now everything looks great. Is there a reason why I need those lines? Will I run into a problem somewhere else?

Rob

[paulm]

Those lines were added to improve cross browser support in some cases (tested on IE6 and FF at the time). But if the size and alignment are OK now you can safely leave those lines commented out.

When you change the font-size or want to change the button height or padding, you might need to uncomment and adjust those settings.

(note that some buttons are links and others are inputs, both need to be checked)

[robraymond]

Thanks for the reply

It was input buttons I was having problems with, the link buttons were OK. Seems to be another IE bug, everything was fine in Firefox.

Rob