This code adds a custom field to your single product edit screens enabling you to add custom content like a sub heading on:
- Shop page archives like your shop and product category & tag archive pages
- Single product pages
![](https://wpsites.net/wp-content/uploads/2024/07/SHOP-PAGE-ARCHIVES-455x300.png)
![](https://wpsites.net/wp-content/uploads/2024/07/single-product-page-sub-heading-580x300.png)
All you need to do is edit your single product page and enter a sub heading in your new custom field named Sub Heading.
![](https://wpsites.net/wp-content/uploads/2024/07/sub-heading-custom-field-600x241.png)
Copy and paste the following PHP code to the end of your child themes functions.php file or code snippets plugin.
add_action('woocommerce_product_options_general_product_data', 'custom_woocommerce_product_fields');
function custom_woocommerce_product_fields() {
woocommerce_wp_text_input([
'id' => '_custom_field',
'label' => __('Sub Heading', 'woocommerce'),
'desc_tip' => 'true',
'description' => __('Enter the value for your Sub Heading.', 'woocommerce'),
]);
}
add_action('woocommerce_process_product_meta', 'save_custom_woocommerce_product_fields');
function save_custom_woocommerce_product_fields($post_id) {
$custom_field_value = isset($_POST['_custom_field']) ? sanitize_text_field($_POST['_custom_field']) : '';
update_post_meta($post_id, '_custom_field', $custom_field_value);
}
add_action('woocommerce_single_product_summary', 'display_custom_field_single_product', 25);
function display_custom_field_single_product() {
global $product;
$custom_field_value = get_post_meta($product->get_id(), '_custom_field', true);
if ($custom_field_value) {
echo '<p class="sub-heading">' . esc_html($custom_field_value) . '</p>';
}
}
add_action('woocommerce_after_shop_loop_item_title', 'display_custom_field_archive_page', 15);
function display_custom_field_archive_page() {
global $product;
$custom_field_value = get_post_meta($product->get_id(), '_custom_field', true);
if ($custom_field_value) {
echo '<p class="sub-heading">' . esc_html($custom_field_value) . '</p>';
}
}
Center Sub Heading On Archive Pages
Use this CSS to center your fields content on shop page archives.
.archive .sub-heading {
text-align: center;
}
You can modify or extend this code to do anything you like.
Need More Coding Help?
Was This Tutorial Helpful?