CSS3 Buttons [support thread]

[remops]

Thanks again!

Learning something

Can you point me at an article or thread that may help in creating/changing these to css type?

Thanks

[lat9]

You can learn about CSS selectors at http://www.w3schools.com/cssref/css_selectors.asp. Once you've got a selector defined, you would apply CSS properties similar to those set in the stylesheet_css_buttons.css file.

[remops]

I have the wishlist plugin installed and the button works fine if the css buttons are turned off. If I turn the buttons on the css button adds the item to the cart instead of the wishlist. I created the button below. Any ideas on the code to get it to submit to the wishlist?

Thanks

input.cssButton.wishlist_add {
 background-color: #EB7A17; 
 width: 140px;-moz-border-radius:3px;
  -webkit-border-radius:3px;
  border-radius:3px;
  display:inline-block;
  font-family:Verdana;
  font-size:20px;
  font-weight:bold;
  margin: 0;
  padding:3px 8px;
  text-decoration:none;
  color: #FAF6F5;  /* Text color for submit buttons */}
  
input.cssButtonHover.wishlist_add { 
background-color: #F09443;
width:140px; 
font-size:20px;
color: #FAF6F5;  /* Text color for submit buttons */}

[remops]

This is the wishlist html markup
That may help

Thanks

<input type="image" value="yes" name="wishlist" title=" Add to Wish List " alt="Add to Wish List" src="includes/templates/all_business/buttons/english/wishlist_add.gif">

and if I turn on the css buttons this is what the button html markup is

<input type="submit" name="wishlist" value="Add to Wish List" onmouseout="this.className='cssButton submit_button button  wishlist_add'" onmouseover="this.className='cssButtonHover  wishlist_add wishlist_addHover'" class="cssButton submit_button button  wishlist_add">

[lat9]

This is the wishlist html markup
That may help

Thanks

<input type="image" value="yes" name="wishlist" title=" Add to Wish List " alt="Add to Wish List" src="includes/templates/all_business/buttons/english/wishlist_add.gif">

and if I turn on the css buttons this is what the button html markup is

<input type="submit" name="wishlist" value="Add to Wish List" onmouseout="this.className='cssButton submit_button button  wishlist_add'" onmouseover="this.className='cssButtonHover  wishlist_add wishlist_addHover'" class="cssButton submit_button button  wishlist_add">

Well , I fixed that a couple of months ago and never uploaded the changes. Let me get v1.0.3 packaged and uploaded and then I'll post the change to get this working.

[lat9]

v1.0.3 has been submitted to the plugins (available here when approved: http://www.zen-cart.com/downloads.php?do=file&id=1386), providing a fix for:

If the name attribute is included in the $parameters for a submit-type button, need to "emulate" the return from an <input type="image" /> type button press by adding _x to the name specified. The solution is based on this thread in the Zen Cart forums.

[lat9]

Well , I fixed that a couple of months ago and never uploaded the changes. Let me get v1.0.3 packaged and uploaded and then I'll post the change to get this working.

Following is the change to the zenCssButton function in /includes/functions/html_output.php to provide the emulation required to allow the Wish List button to operate properly:

    if ($type == 'submit'){
// form input button
//-bof-v1.0.3a
      if ($parameters != '') {
        // If the input parameters include a "name" attribute, need to emulate an <input type="image" /> return value
        // by adding a _x to the name parameter (thanks to paulm for providing the fix for Zen Cart v1.3.6!).  
        if (preg_match('/name="([a-zA-Z0-9\-_]+)"/', $parameters, $matches)) {
          $parameters = str_replace('name="' . $matches[1], 'name="' . $matches[1] . '_x', $parameters);
        }
        // If the input parameters include a "value" attribute, remove it since that attribute will be set to the input
        // text string.
        if (preg_match('/(value="[a-zA-Z0=9\-_]+")/', $parameters, $matches)) {
          $parameters = str_replace($matches[1], '', $parameters);
        }
      }
//-eof-v1.0.3a
      $css_button = '<input class="' . $mouse_out_class . '" ' . $css_button_js . ' type="submit" value="' .$text . '"' . $tooltip . $parameters . ' />';
    }

[remops]

Great job

Its working!