1. Home
  2. Knowledge Base
  3. WooCommerce Product Add-Ons Ultimate
  4. Overriding Templates
  1. Home
  2. Knowledge Base
  3. Advanced
  4. Overriding Templates

Overriding Templates

You can use your own version of the field templates by duplicating files from the plugins template/frontend folder and creating your own product-extras folder in your theme or child theme. The plugin will look for any templates in theme folders before using its default templates.

Example templates

Here are some example templates.

Table layout for text field

<?php
/**
* A text field template
* @since 2.0.0
* @package WooCommerce Product Add-Ons Ultimate
* @see https://pluginrepublic.com/documentation/overriding-templates/ for more details
*/
// Exit if accessed directly
if( ! defined( 'ABSPATH' ) ) {
exit;
}
?>
<table>
<tbody>
<tr>
<td>
<?php echo pewc_field_label( $item, $id ); ?>
</td>
<td>
<?php $attributes = pewc_get_text_field_attributes( $item ); ?>
<input type="text" class="pewc-form-field" id="<?php echo esc_attr( $id ); ?>" name="<?php echo esc_attr( $id ); ?>" <?php echo $attributes; ?> value="<?php echo esc_attr( $value ); ?>">
</td>
</tr>
</tbody>
</table>
view raw text.php hosted with ❤ by GitHub

Table layout for products field

This example also pulls in additional child product data, like the SKU:

<?php
/**
* A products field template
* Ensure that the 'Products Quantities' field is set to 'One Only'
* @since 2.2.0
* @package WooCommerce Product Add Ons Ultimate
*/
// Exit if accessed directly
if( ! defined( 'ABSPATH' ) ) {
exit;
}
echo pewc_field_label( $item, $id );
if( isset( $item['child_products'] ) ) {
$layout = $item['products_layout'];
$index = 0;
// Set the allow_none parameter according to whether the field is required or not
// allow_none means that child products can be deleted from the cart without deleting the parent product
$allow_none = empty( $item['required'] ) ? true : false;
// This is the custom layout
$number_columns = ( isset( $item['number_columns'] ) ) ? $item['number_columns'] : 3;
$checkboxes_wrapper_classes = array(
'pewc-checkboxes-images-wrapper',
'child-product-wrapper'
);
$checkboxes_wrapper_classes[] = 'pewc-columns-' . intval( $number_columns );
if( ! empty( $item['hide_labels'] ) ) {
$checkboxes_wrapper_classes[] = 'pewc-hide-labels';
}
if( ! empty( $item['products_quantities'] ) ) {
$products_quantities = ! empty( $item['products_quantities'] ) ? $item['products_quantities'] : '';
$checkboxes_wrapper_classes[] = 'products-quantities-' . $item['products_quantities'];
} ?>
<table class="<?php echo join( ' ', $checkboxes_wrapper_classes ); ?>" data-products-quantities="<?php echo esc_attr( $item['products_quantities'] ); ?>">
<?php foreach( $item['child_products'] as $child_product_id ) {
$child_product = wc_get_product( $child_product_id );
$price = pewc_maybe_include_tax( $child_product, $child_product->get_price() );
$price = wc_price( $price );
// Check stock availability
$disabled = '';
if( ! $child_product->is_purchasable() || ! $child_product->is_in_stock() ) {
$disabled = 'disabled';
}
// Check available stock if stock is managed
$available_stock = '';
if( $child_product->managing_stock() ) {
$available_stock = $child_product->get_stock_quantity();
}
$name = get_the_title( $child_product_id );
$field_name = $id . '_child_product';
$checkbox_id = $id . '_' . $child_product_id;
$wrapper_classes = array(
'pewc-checkbox-image-wrapper'
);
if( $disabled ) {
$wrapper_classes[] = 'pewc-checkbox-disabled';
}
$checked = ( $value == $id ) ? 'checked="checked"' : '';
$quantity_field = '';
if( $products_quantities == 'independent' ) {
// Add a quantity field for each child checkbox
// The name format is {$id}_child_quantity_{$child_product_id}
// Where $id is the field ID and $child_product_id is the child product ID
$quantity_field = sprintf(
'<input type="number" min="0" step="1" max="%s" class="pewc-form-field pewc-child-quantity-field" name="%s" value="0" %s>',
$available_stock,
esc_attr( $id ) . '_child_quantity_' . esc_attr( $child_product_id ),
$disabled
);
}
$option_cost = pewc_maybe_include_tax( $child_product, $child_product->get_price() );
// Start the row
$table_row = '<tr>';
// Add a thumbnail
$image_url = ( get_post_thumbnail_id( $child_product_id ) ) ? wp_get_attachment_url( get_post_thumbnail_id( $child_product_id ) ) : wc_placeholder_img_src();
// Setting a width and height here
$image = '<img style="max-width: 50px; height: auto;" src="' . esc_url( $image_url ) . '">';
$table_row .= sprintf(
'<td>%s</td>',
$image
);
// Add a checkbox in the first column
$table_row .= sprintf(
'<td><input data-option-cost="%s" type="checkbox" name="%s[]" id="%s" class="pewc-checkbox-form-field" value="%s" %s %s></td>',
esc_attr( $option_cost ),
esc_attr( $field_name ),
esc_attr( $checkbox_id ),
esc_attr( $child_product_id ),
esc_attr( $checked ),
esc_attr( $disabled )
);
// Add the child product name
$table_row .= sprintf(
'<td class="%s"><label for="%s">%s</label></td>',
join( ' ', $wrapper_classes ),
esc_attr( $checkbox_id ),
$name
);
// Example column to get child product meta, e.g. SKU
$sku = $child_product->get_sku();
$table_row .= sprintf(
'<td>%s</td>',
$sku
);
// Price column
$table_row .= sprintf(
'<td>%s</td>',
$price
);
$table_row .= '</row>';
echo $table_row;
} ?>
</table><!-- .pewc-radio-images-wrapper -->
<input type="hidden" name="<?php echo esc_attr( $id ); ?>_quantities" value="<?php echo esc_attr( $item['products_quantities'] ); ?>">
<?php $allow_none = ! empty( $item['allow_none'] ) ? 1 : 0; ?>
<input type="hidden" name="<?php echo esc_attr( $id ); ?>_allow_none" value="<?php echo esc_attr( $allow_none ); ?>">
<?php }
view raw products.php hosted with ❤ by GitHub

Table layout for checkbox group field

<?php
/**
* A checkbox field template
* @see https://pluginrepublic.com/documentation/overriding-templates/
* @since 2.0.0
* @package WooCommerce Product Add-Ons Ultimate
*/
// Exit if accessed directly
if( ! defined( 'ABSPATH' ) ) {
exit;
}
// Labels are used with the inputs
echo pewc_field_label( $item, $id );
if( isset( $item['field_options'] ) ) {
$index = 0; ?>
<table class="pewc-checkbox-group-wrapper">
<?php foreach( $item['field_options'] as $key=>$option_value ) {
$classes = array( 'pewc-checkbox-form-field' );
$name = esc_html( $option_value['value'] );
$option_percentage = '';
// Set price differently if percentage is enabled
if( pewc_is_pro() && isset( $item['field_percentage'] ) && ! empty( $option_value['price'] ) ) {
// Set the option price as a percentage of the product price
$product_price = $product->get_price();
$option_price = ( floatval( $option_value['price'] ) / 100 ) * $product_price;
$option_price = pewc_maybe_include_tax( $product, $option_price );
$option_percentage = floatval( $option_value['price'] );
$classes[] = 'pewc-option-has-percentage';
} else {
$option_price = ! empty( $option_value['price'] ) ? pewc_maybe_include_tax( $product, $option_value['price'] ) : 0;
}
if( ! empty( $option_price ) ) {
$name .= ' - <span class="pewc-option-cost-label">' . pewc_get_semi_formatted_raw_price( $option_price ) . '</span>';
}
$radio_id = $id . '_' . strtolower( str_replace( ' ', '_', $option_value['value'] ) );
$checked = ( is_array( $value ) && in_array( $option_value['value'], $value ) ) ? 'checked="checked"' : '';
$row = '<tr>';
// Checkbox first
$row .= sprintf(
'<td><input data-option-cost="%s" data-option-percentage="%s" type="checkbox" name="%s[]" id="%s" class="%s" value="%s" %s></td>',
esc_attr( $option_price ),
esc_attr( $option_percentage ),
esc_attr( $id ),
esc_attr( $radio_id ),
join( ' ', $classes ),
esc_attr( $option_value['value'] ),
esc_attr( $checked )
);
$row .= sprintf(
'<td><label class="pewc-checkbox-form-label" for="%s">%s</label></td>',
esc_attr( $radio_id ),
$name
);
// echo apply_filters( 'pewc_filter_checkbox_group_field', $radio, $radio_id, $option_price, $id, $name, $option_value, $item );
}
echo $row; ?>
</table>
<?php }
view raw checkbox-group.php hosted with ❤ by GitHub

Was this article helpful?

Related Articles