Adding a Custom Message to Product Pages in Woocommerce

Let’s say you want to add a custom message, like “Free shipping on orders over $50!”, to all your product pages, displayed below the product title. This can be done with a simple code snippet.

Step 1: Use a Child Theme

Before making any changes to your site, always use a child theme. Modifying your main theme’s code directly can cause issues during updates.

1. If you don’t have a child theme, create one or use a plugin like Child Theme Configurator.
2. Ensure your child theme is active.

Step 2: Add the Code Snippet

WooCommerce uses hooks to let developers add or modify content without editing core files. In this example, we’ll use the woocommerce_single_product_summaryhook.

Code Snippet:

Add the following code to your child theme’s functions.php file:

Step 3: Understand the Code

• add_action: Hooks the function to a specific WooCommerce action. In this case, we’re using woocommerce_single_product_summary, which controls the main product page layout.
• 15: Specifies the priority of this action. It determines when the message will appear relative to other elements on the page.
• CSS Styling: Inline styles (font-size, color, font-weight) are added for a quick visual tweak. For larger changes, consider enqueuing a stylesheet instead.

Step 4: Test the Changes

1. Open any product page on your WooCommerce store.
2. You should see the custom message displayed below the product title.

Step 5: Going Further

If you want the message to vary based on conditions (e.g., category, product type, etc.), you can modify the function. Here’s an example of displaying the message only for products in the “Clothing” category: