# How to Add WooCommerce Price Strikethrough: A Beginner’s Guide
Want to show your customers that they’re getting a fantastic deal? A price strikethrough, showing the original price crossed out next to the sale price, is a powerful visual cue that screams “SAVE MONEY!” This guide will show you how to easily add this feature to your WooCommerce store, even if you’re a complete coding newbie.
Why Use a Price Strikethrough in WooCommerce?
Before diving into the “how,” let’s understand the “why.” A price strikethrough is a proven marketing technique. It:
- Highlights savings: Clearly demonstrates the discount offered, making your deals more appealing.
- Creates urgency: Implies a limited-time offer, encouraging quicker purchases.
- Builds trust: Shows transparency by displaying the original price, avoiding any suspicion of misleading pricing.
- No coding required: You install the plugin, configure a few settings, and you’re done.
- Easy to manage: Plugins usually have user-friendly interfaces, making adjustments straightforward.
- Regular updates: Reputable plugins receive regular updates, ensuring compatibility with the latest WooCommerce versions.
Imagine you’re selling a stylish winter coat. Originally priced at $150, you’re now selling it for $99. Showing “$150” struck through next to “$99” immediately communicates a significant $51 saving – much more effectively than simply stating “20% off.”
Methods to Add a WooCommerce Price Strikethrough
There are several ways to achieve this, ranging from simple plugins to custom code. Let’s explore the easiest options first.
Method 1: Using a WooCommerce Plugin (Easiest Option)
The simplest approach is using a dedicated plugin. Many free and premium plugins offer this functionality. Here’s why this is recommended for beginners:
Popular plugin examples: Search the WooCommerce plugin directory for terms like “sale badges,” “price strikethrough,” or “discount display.” Many plugins offer this functionality as a part of a broader suite of features.
Method 2: Using WooCommerce’s Built-in Functionality (Intermediate)
While WooCommerce doesn’t directly offer a price strikethrough feature, you can leverage its existing functionality with a bit of CSS. This approach requires some basic understanding of CSS but is a good middle ground if you’re comfortable with a little customization.
You’ll need to add custom CSS code to your theme. This usually involves accessing your theme’s stylesheet (often `style.css`) or using a custom CSS plugin. Here’s an example:
/* Add this CSS code to your theme’s stylesheet or a custom CSS plugin */
.woocommerce span.price del {
text-decoration: line-through;
color: #999; /* Adjust color as needed */
}
This code targets the `` tag (which indicates deleted text) within the price display and applies a strikethrough and a grey color. You can adjust the color (`#999`) to match your theme.
Important Note: Always back up your theme files before making any changes. Incorrect CSS can break your website’s styling.
Method 3: Using a Custom Function (Advanced)
For advanced users comfortable with PHP, you can create a custom function within your theme’s `functions.php` file. This provides the most control but is also the riskiest if you’re unfamiliar with PHP.
Warning: Modifying `functions.php` incorrectly can break your website. Only attempt this if you’re experienced with PHP and have thoroughly backed up your files.
Here’s a basic example (this needs to be adapted to your specific theme and might require further adjustments):
add_filter( 'woocommerce_get_price_html', 'custom_price_strikethrough', 10, 2 );
function custom_price_strikethrough( $price, $product ) {
if ( $product->is_on_sale() ) {
$regular_price = wc_price( $product->get_regular_price() );
$sale_price = wc_price( $product->get_price() );
$price = '' . $regular_price . ' ' . $sale_price . '';
}
return $price;
}
This code checks if a product is on sale. If it is, it creates the strikethrough using `` and `` tags.
Conclusion
Adding a price strikethrough to your WooCommerce store is a simple yet effective way to boost sales. Choose the method that best fits your technical skills. Starting with a plugin is always the safest and easiest option for beginners. Remember to always back up your website before making any code changes. Happy selling!
