/ Uncategorized

CSS3 Regular Expressions in osCommerce

The technique of styling your CSS with regular expressions can be used for any input field styling task, however it is meant to help you further individualize osCommerce, for e.g. after utilizing the Simple Template System (STS).

In osCommerce, usually you would go into the source files and alter them. If you want to change the style of your graphical buttons in your shopping card or the look of the form fields for the login or checkout you would go into catalog/includes/functions/html_output.php and give them a CSS Class identifier.

<input type="image" class="myNewClass" src="' . tep_output_string(..

I used a different approach utilizing CSS3 defining them directly in my sts_template.html file.


input[type="text"] {
/* some code /
input[type="button"],input[type="submit"] {
some code */

With this technique tampering with the html_output.php shouldn't be necessary anymore.

These selectors are only working in more advanced browsers and are called Simple attribute selectors. More advanced attribute selectors are using CSS3 regular expressions and work like this:

/* matches occurrences of the type attribute
where 'sub' is the beginning of the value */

/* matching string can be anywhere inside
the type attribute of input */

/* matches all values that end with 'mit'
of the type attribute inside input tags */

I hope this helps you with your commercial or any other project you are currently pursuing.

CSS3 Regular Expressions in osCommerce
Share this