add dynamic variation description feature

assets/css/woocommerce.scss

@@ -523,6 +523,11 @@ p.demo_store {
 					color: rgba(desaturate($highlight, 75%), 0.5);
 				}
 			}
+			
+			.woocommerce-variation-description {
+				background-color: $secondary;
+				padding:2px 8px;
+			}
 		}
 	}
 

assets/js/frontend/add-to-cart-variation.js

@@ -37,6 +37,25 @@
 			return match;
 		};
 
+		$.fn.wc_variation_form.get_variation_description_html = function( form, selected_index ) {
+			var all_variations = form.data( 'product_variations' ),
+				var_description_html;
+
+			if ( selected_index > 0 ) {
+				// minus an index to account for first non selected option
+				selected_index--;
+
+				if ( all_variations[ selected_index ].hasOwnProperty( 'variation_description' ) ) {
+					var_description_html = '<p class="woocommerce-variation-description woocommerce-variation-description-' + 
+					all_variations[ selected_index ].variation_id + '">' + all_variations[ selected_index ].variation_description + '</p>';
+
+					return var_description_html;
+				}
+			}
+
+			return '';
+		};
+
 		// Unbind any existing events
 		this.unbind( 'check_variations update_variation_values found_variation' );
 		this.find( '.reset_variations' ).unbind( 'click' );
@@ -69,12 +88,22 @@
 			// Upon changing an option
 			.on( 'change', '.variations select', function( event ) {
 
-				$variation_form = $( this ).closest( '.variations_form' );
+				var $variation_form = $( this ).closest( '.variations_form' ),
+					var_description = $.fn.wc_variation_form.get_variation_description_html( $variation_form, this.selectedIndex );
 
-				if ( $variation_form.find( 'input.variation_id' ).length > 0 )
+				// remove variation description on change
+				$variation_form.find( '.variations' ).next( '.woocommerce-variation-description' ).remove();
+				
+				// display variation description
+				if ( var_description ) {
+					$variation_form.find( '.variations' ).after( var_description );
+				}
+
+				if ( $variation_form.find( 'input.variation_id' ).length > 0 ) {
 					$variation_form.find( 'input.variation_id' ).val( '' ).change();
-				else
+				} else {
 					$variation_form.find( 'input[name=variation_id]' ).val( '' ).change();
+				}
 
 				$variation_form
 					.trigger( 'woocommerce_variation_select_change' )

includes/admin/meta-boxes/class-wc-meta-box-product-data.php

@@ -775,7 +775,8 @@ class WC_Meta_Box_Product_Data {
 								'_manage_stock'          => '',
 								'_stock_status'          => '',
 								'_backorders'            => null,
-								'_tax_class'             => null
+								'_tax_class'             => null,
+								'_variation_description' => ''
 							);
 
 							foreach ( $variation_fields as $field => $value ) {
@@ -1315,6 +1316,8 @@ class WC_Meta_Box_Product_Data {
 			$variable_backorders            = isset( $_POST['variable_backorders'] ) ? $_POST['variable_backorders'] : array();
 			$variable_stock_status          = isset( $_POST['variable_stock_status'] ) ? $_POST['variable_stock_status'] : array();
 
+			$variable_description           = isset( $_POST['variable_description'] ) ? $_POST['variable_description'] : array();
+
 			$max_loop = max( array_keys( $_POST['variable_post_id'] ) );
 
 			for ( $i = 0; $i <= $max_loop; $i ++ ) {
@@ -1492,6 +1495,8 @@ class WC_Meta_Box_Product_Data {
 					update_post_meta( $variation_id, '_downloadable_files', '' );
 				}
 
+				update_post_meta( $variation_id, '_variation_description', sanitize_text_field( $variable_description[ $i ] ) );
+				
 				// Save shipping class
 				$variable_shipping_class[ $i ] = ! empty( $variable_shipping_class[ $i ] ) ? (int) $variable_shipping_class[ $i ] : '';
 				wp_set_object_terms( $variation_id, $variable_shipping_class[ $i ], 'product_shipping_class');

includes/admin/meta-boxes/views/html-variation-admin.php

@@ -186,6 +186,11 @@ extract( $variation_data );
 					?></select>
 					<?php endif; ?>
 				</p>
+
+				<p class="form-row form-row-full">
+					<label><?php _e( 'Variation Description:', 'woocommerce' ); ?></label>
+					<textarea name="variable_description[<?php echo $loop; ?>]" rows="3" style="width:100%;"><?php echo isset( $variation_data['_variation_description'] ) ? sanitize_text_field( $variation_data['_variation_description'] ) : ''; ?></textarea>
+				</p>
 			</div>
 			<div class="show_if_variation_downloadable" style="display: none;">
 				<div class="form-row form-row-full downloadable_files">

includes/class-wc-product-variable.php

@@ -495,6 +495,7 @@ class WC_Product_Variable extends WC_Product {
 				'is_downloadable'       => $variation->is_downloadable() ,
 				'is_virtual'            => $variation->is_virtual(),
 				'is_sold_individually'  => $variation->is_sold_individually() ? 'yes' : 'no',
+				'variation_description' => $variation->get_variation_description(),
 			), $this, $variation );
 		}
 

includes/class-wc-product-variation.php

@@ -661,4 +661,13 @@ class WC_Product_Variation extends WC_Product {
 
 		return sprintf( __( '%s – %s%s', 'woocommerce' ), $identifier, $this->get_title(), $extra_data );
 	}
+
+	/**
+	 * Get product variation description
+	 *
+	 * @return string
+	 */
+	public function get_variation_description() {
+		return get_post_meta( $this->variation_id, '_variation_description', true );
+	}
 }