Display discount price with strike-through

Hi,

You curently have entered the base price in the "retail price" field of your product and entered the discount price in the price listing of your product.
Instead, you should enter the base price in the price listing of your product and leave the retail price field empty.
Then, create a discount via the menu Orders>Discounts and assign it to that product with the value of the discount you want for that product.
Finally, in the HikaShop configuration, you have the "Show discounted price" setting that you can set to "Display the price before the discount is applied" in order to get the original price with strike-through followed by the lower price on your product page automatically.

Hi,

That's because the style of HikaShop is not enabled. In the HikaShop configuration, under the Display tab, you can set the "style" setting to "default" instead of "none" and you'll have the price striken through.
Otherwise, you can just add the CSS for it :

span.hikashop_product_price_before_discount {
	text-decoration:line-through;
	white-space:nowrap;
}

Hi,

To customize the display of each price, you want to edit the currency via the menu System>Currencies. You'll find display options to say if you want the symbol before or after the price, etc.

There are many ways in CSS to add spacing between the two prices.
For example, with such CSS:

span.hikashop_product_price_before_discount {
	margin-right: 10px;
}

Hi,

I'm not sure what you mean. Having discounts on prices based on the category/product and have the original price striken-through is possible since like 7 years ago in HikaShop.

Hi,

You're wrong. The previous method, which is still current, has always been to enter the full price in the price field of the product and then create a discount on the product via the Orders>Discounts menu so that it can apply on that price.
The retail price is only indicative information when you sell things lower than the manufacturer's suggested retail price.

Hi,

On your second screenshot, it displays the discount amount and then the discounted price while on the first you have the price before discount and then the price after discount.
So it's normal that the CSS doesn't apply in the second case.
It's actually not a CSS issue. The issue is that in the settings of that second listing, (a menu item or a module), you have the discounted price setting configured to display the discount value instead of displaying the price before the discount. So check the settings of your second products listing.