how to add discount tag for product image?

i am using nop commerce 2.8 version
i want to  add discounts like 50% or 20% on the product image.pllzzz help me

mahitha1 wrote:
If you want to add a ribbon to images of products with discounts here is a work item which will be available with v3.0 (en of july). It has info and code to do it.

I want display the discount percentage for each product on the product picture or after the product price  in the new products page,and for each product i want to add different discount percentages?
i am using nop commerce 2.8 version and also am not using visual studio am using only cshtml coding(web matrix)
plzzzzz help me

This can help you but only on the product page.

You need to create a new discount on page "Promotion -> Distsounts." Select the type of discount "Assigned to product variants (skus)". After this, on page "Product variants -> Discount" select your new discount.

Insert the following code to the file "_ProduсtVariantPrice.cshtml":

@if (!String.IsNullOrWhiteSpace(Model.PriceWithDiscount))
{
    /*Styles for the block with percent*/
    <style>
        .product-essential {
            position: relative;
        }

        .product-discount {
            position: absolute;
            background: yellow;
            width: 75px;
            height: 30px;
            border-radius: 40px;
            color: red;
            font-size: 30px;
            padding: 20px 0;
            text-align: center;
            left: 15px;
            top: 15px;
        }

        .product-variant-line .product-discount {
            display: none;
        }
    </style>

    var discountValue = Model.PriceValue - Model.PriceWithDiscountValue; // calculate the amount
    var discountPercentage = Math.Round(100/(Model.PriceValue / discountValue)); // calculate the percentage
    @Html.Raw("<div class=\"product-discount\">-" + discountPercentage + "%</div>") // show percentage in the block
}

I did it quickly, so it may contain bugs. But I hope you get the idea...

hiii mariann
its not working

Errors?
Which product template you use? This code for a single product variant. But it is not difficult to alter ..

Mariann wrote:

Hi Mariann, How we could do it in version 4.0 please.

There are several plugins that do this