Get a fast, conversion-focused WooCommerce theme in 2024. Switch to Shoptimizer.

Home Documentation Shoptimizer Code Snippets Display a “Price per day” on Product Pages

Display a “Price per day” on Product Pages

The price of a product may seem like too much for a customer, but when you calculate and display the cost of using it per day (or per night), it can suddenly seem a lot more affordable.

This is especially true if it is a premium product which would be used almost daily by someone. You might be more willing to splash out on an item which gives you joy every single day.

Inspired by this Tweet, and demonstrated by the nightwear sold by Dagsmejan (see the screenshot below) I decided to create my own version via a custom code snippet.

You will see that the high cost (€99.90) seems a lot more palatable when it is framed as €0.27 per night, calculated over 365 nights.

Dagsmejan

Add the following code to the functions.php file of a child theme, or via the Code Snippets plugin.

You can of course change the “per day” text to “per night” if you wish.

Then, add the following custom CSS, either to the style.css of a child theme (preferred), or via: Appearance > Customize > Additional CSS.

You’ll see the result in the screenshot below. It even includes a nicely animated tooltip which pops in when you hover over the info icon.

Price Per Day Result
$50
Off

Do you want a whopping $50 off Shoptimizer for WooCommerce?

Click the button below to get Shoptimizer for only $49. (Regular price: $99).
This is a special launch offer for today only.
Get it before it is gone!