public

Hack Woocommerce to add product custom fields - updated

  • Download Gist
woocommerce_template_functions.php
PHP
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52
<form action="<?php echo esc_url( $_product->add_to_cart_url() ); ?>" class="variations_form cart" method="post">
<table class="variations" cellspacing="0">
<tbody>
<?php foreach ($attributes as $name => $options) : ?>
<tr>
<td><label for="<?php echo sanitize_title($name); ?>"><?php echo $woocommerce->attribute_label($name); ?></label></td>
 
// START HACK HERE
 
<?php if(is_array($options) && $options[0] == "CUSTOM_TEXT") : ?>
<td> <input type="text" id="<?php echo esc_attr( sanitize_title($name) ); ?>" name="attribute_<?php echo sanitize_title($name); ?>"/></td>
<?php else: ?>
<td><select id="<?php echo esc_attr( sanitize_title($name) ); ?>" name="attribute_<?php echo sanitize_title($name); ?>">
<option value=""><?php echo __('Choose an option', 'woothemes') ?>&hellip;</option>
<?php if(is_array($options)) : ?>
<?php
// Get terms if this is a taxonomy - ordered
if (taxonomy_exists(sanitize_title($name))) :
$args = array('menu_order' => 'ASC');
$terms = get_terms( sanitize_title($name), $args );
foreach ($terms as $term) :
if (!in_array($term->slug, $options)) continue;
echo '<option value="'.$term->slug.'">'.$term->name.'</option>';
endforeach;
else :
foreach ($options as $option) :
echo '<option value="'.$option.'">'.$option.'</option>';
endforeach;
endif;
?>
<?php endif;?>
</td>
<?php endif;?>
 
// END HACK HERE
 
</tr>
<?php endforeach;?>
</tbody>
</table>
<div class="single_variation_wrap" style="display:none;">
<div class="single_variation"></div>
<div class="variations_button">
<input type="hidden" name="variation_id" value="" />
<div class="quantity"><input name="quantity" value="1" size="4" title="Qty" class="input-text qty text" maxlength="12" /></div>
<button type="submit" class="button alt"><?php _e('Add to cart', 'woothemes'); ?></button>
</div>
</div>
<div><input type="hidden" name="product_id" value="<?php echo esc_attr( $post->ID ); ?>" /></div>
<?php do_action('woocommerce_add_to_cart_form'); ?>
</form>

Hi,

I did not found the woocommerce_template_functions.php in my WP + Woocommerce setup. Could you please elaborate where to paste the above mention code? I will be thankful to you. Thanks

I need this very urgently to add an custom text field on the single product page just above the add to cart where customers will add special instruction during add to cart. plz let me know how to use this code. Thanks !

In the current version of WooCommerce, the relevant file to update with this hack is "woocommerce/templates/single-product/add-to-cart/variable.php" (which you can copy under your own theme at "{your_theme}/woocommerce/single-product/add-to-cart/variable.php" in order to override it without the risk of a WooCommerce update blowing away your changes.

At least in the current version, though, this hack is only half the battle: you also have to extend https://github.com/woothemes/woocommerce/blob/master/assets/js/frontend/add-to-cart-variation.js to have it recognize that the input has been "fulfilled" so that it will show the "Add to Cart" button. The script is only looking at select elements right now, so this variation will never be fulfilled without updating the JavaScript.

Just compared this script with version 2.0.3 script and it looks different. Seems this script is not updated.

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.