How can I add an additional text under my product

Hi @casfr12

For my webshop, I was looking for a way to put an additional text under my product. In my case a text like ‘Ordered before 15:00, delivered tomorrow’. I tried to find it in the settings from WooCommerce or the Customizer, but I still couldn’t find anything.

Can someone please explain to me how I can add some additional text like https://www.speeltentxl.nl has.

From what I understand, you would like to add a custom text under your product on your WooCommerce webshop, similar to the example you provided.

You can accomplish this by adding some custom PHP code to your child theme’s functions.php file or through a plugin that allows for the addition of custom functions, such as the Code Snippets plugin. Here’s a simple example of how you might accomplish this:

add_action( 'woocommerce_after_shop_loop_item_title', 'wc_custom_product_text', 15 );
add_action( 'woocommerce_single_product_summary', 'wc_custom_product_text', 30 );

function wc_custom_product_text() {
echo 'Ordered before 15:00, delivered tomorrow!';
}

This code will add the text “Ordered before 15:00, delivered tomorrow!” under the product title on the catalog page and under the stock status on the product summary page.

Image Link: https://s11.gifyu.com/images/SgSrH.gif

?? Just a heads up – while we’re always here to assist you, our scope of support doesn’t extend to custom development or design patterns, which includes troubleshooting or giving specific advice on using custom action hooks or filters.

For custom solutions, our recommendation is to connect with Codeable.io, our trusted WooCommerce development partner. They’re experts in crafting custom solutions for WooCommerce and might be able to help you develop a custom solution for your problem. Check them out here: ?? https://woocommerce.com/codeable

I hope this helps! If you have any other questions or need more assistance, don’t hesitate to ask.

Hi Tamrat,

Thanks for the quick response!

1. I tried it out and it worked, but I have to fine tune it. There is quite a lot space between the price and the text. Am I able to remove some space and put it right under the price, like the mentioned website has. It also looks like the text is on top, instead of under the price.
2. It also doesn’t seem to work with single products, only the archives. Am I doing something wrong? If yes, what exactly? I added the coded in the PHP file.

TIA!

• This reply was modified 1 year, 3 months ago by casfr12.

Hi @casfr12

I tried it out and it worked, but I have to fine tune it. There is quite a lot space between the price and the text. Am I able to remove some space and put it right under the price, like the mentioned website has. It also looks like the text is on top, instead of under the price. It also doesn’t seem to work with single products, only the archives. Am I doing something wrong? If yes, what exactly? I added the coded in the PHP file.

Great to hear the previous solution was a step in the right direction! Now, let’s fine-tune it to meet your needs.

To reduce the space between the price and the text, you’ll want to tweak the CSS. You can do this by going to Appearance > Customize > Additional CSS and inserting the following:

.your-class-name {
margin-top: 0px; 
}

Just swap out “your-class-name” with the specific class name of your element. The “0px” is a placeholder, so adjust this value to fit your layout.

Image Link: https://s11.gifyu.com/images/Sgp7C.gif

As for the single product issue, the code given should function for both the shop loop and individual product pages. However, the text’s location might shift based on your theme. If the text isn’t showing up where you want on the single product pages, try altering the priority of the action. The ’30’ in the second add_action function dictates the priority. A smaller number signifies a higher priority, so try decreasing it to display the text sooner, or increasing it to display it later.

Here’s an example:

add_action( 'woocommerce_single_product_summary', 'wc_custom_product_text', 20 );

Keep in mind that these adjustments need a solid grasp of PHP and CSS. If you’re not comfortable making these changes, it might be best to consult a developer or a service like Codeable.io.

I’m here to help! If you have any other questions or need more guidance, don’t hesitate to ask.