1. Home
  2. Docs
  3. WooCommerce Order Builder
  4. Actions and Filters
  5. wwob_change_product_items_display

wwob_change_product_items_display

Use this filter to completely alter how items are displayed on the product page.

The follow example will change display and render items without image.

add_filter( 'wwob_change_product_items_display', 'change_product_display', 5, 10 );
function change_product_display($content, $field, $form_id, $field_id, $i){
	
			$one = 1;
			$zero = 0;
			
				$one++;
				$zero++;
				
				$item_container_padding = wwob_get_option( 'item_container_padding' ) ? wwob_get_option( 'item_container_padding' ) : "20";
				
				$field_label = !empty($field['wwob_field_label']) ? $field['wwob_field_label'] : "Product ".$one;
				$requiredornot = !empty($field['wwob_field_isRequired']) ? $field['wwob_field_isRequired'] : "";
				$placeholder_max_input_select = !empty($field['wwob_field_maxSelect']) ? $field['wwob_field_maxSelect'] : "";
				$placeholder_min_input_select = !empty($field['wwob_field_minSelect']) ? $field['wwob_field_minSelect'] : "";
				$quanitity = !empty($field['wwob_field_quantity']) ? $field['wwob_field_quantity'] : "";
				$quota = !empty($field['wwob_field_quota']) ? $field['wwob_field_quota'] : "";
				$description = !empty($field['wwob_field_description']) ? $field['wwob_field_description'] : "";
				$additional_field = !empty($field['wwob_field_additional_field']) ? $field['wwob_field_additional_field'] : "";

				$requiredornot1 = "<span class='wwobfield_required'>*</span>";
				$requiredornot2 = !empty($requiredornot) ? $requiredornot1 : '';

				$disable_images = get_post_meta( $form_id, 'wwob_disable_images', true );
		
			
				$content= "";
				$content .= '<li id="field_'. $form_id .'_'. $field_id .'" class="wwobfield wwobform_hidden wwobfield_price wwobfield_price_'. $form_id .'_'. $field_id .' wwobfield_product_'. $form_id .'_'. $field_id .'">';
				$content .= "<label class='wwobfield_label'  ><h3>".$field_label." ".$requiredornot2."</h3></label><div class='wwobfield_description'><p>".$description."</p><h3>". $additional_field ."</h3></div>";
				$content .= '<div class="wwobinput_container wwobinput_container_checkbox extended-checkboxes"><ul quantity="'. $quanitity .'"  quota="'. $quota .'" minselect="'. $placeholder_min_input_select .'" maxselect="'. $placeholder_max_input_select .'" class="wwobfield_checkbox" id="input_'. $form_id .'_'. $field_id .'">';
				
	
				$index0 = 0;
				$index1 = 1;
				foreach ($field['wwob_product_field'] as $choice) {
					$number = $index0++;
					$number1 = $index1++;
					$product_id = $choice['product-id'];
					$item_name = $choice['product-name'];
					$price = !empty($choice['product-price']) ? $choice['product-price'] : "0";

					
					$symbol = get_woocommerce_currency_symbol();
					$sanitize_value = number_format($price, 2, '.', '');
					$sanitized_value = $symbol . $sanitize_value;

					$fieldid = 'item';


						$content .= "<li titletrigger ='". $form_id ."_". $field_id ."' class='wwobchoice_". $form_id ."_". $field_id ." wwobchoice_". $form_id ."_". $field_id ."_". $number1 ."'><input name='input_". $fieldid ."_". $i++ ."' type='checkbox' ". $fieldid ." class ='checkbox-meta' value='". $product_id ."' details='" . $sanitize_value . "|" . $item_name . "|" . $field_label . "' id='choice_". $form_id ."_". $field_id ."_". $number1 ."' tabindex='". $number1 ."'    />";
						$content .= '<label class= "wwob-checkbox-label wwob-checkbox-img" for="choice_'. $form_id .'_'. $field_id .'_'. $number1 .'" id="label_'. $form_id .'_'. $field_id .'_'. $number1 .'" price="'. $sanitized_value .'">';

						$content .='<div class="label-meta-container"><p class="wwob-item-name">' . $item_name . '</p><span class="wwobinput_price">'.$sanitized_value.'</span></div></label>';
						

						
						$content .= "</li>";
				}
				$content .= "</ul></div><div class='clear'></div>";
				$content .= "</li>";
				
	return $content;
}

Placement

This code should be placed in the functions.php file of your active theme.

Note

This filter should only be used to make a major adjustment to items display. If you’re looking to add extra data to your items, use the available actions instead.

Was this article helpful to you? Yes No