The most standard way to display sale/new badges

How To
1

Hi community,

If we want to display sale/new badges in a way that the code is as follows and if a product is not in sale, it is not rendered in the DOM (without using conditions), what is the solution?

<span class="badge onsale">-20%</span>

Currently the output is as follows.

<span class="brxe-dlkhoi brxe-text-basic">
<span class="badge onsale">-20%</span>
</span>

The problem now is that the code is not clean and uses two span. On the other hand, for products that do not have a sale price, there is always an empty span.

<span class="brxe-dmribx brxe-text-basic badge new"></span>
2

I usualy add these and similar badges with conditions so if status doesnt match dom doesnt render at all

completely clean frontend

always use conditions they are great

image

3

Great @sinanisler, doesn’t using multiple conditions negatively impact performance?

4

nah its fine

its just making one call if else to check status true or false …etc

and trust me when it comes to woocommerce there are tooons more stuff we need to be concerned about for performance :rofl: bricks conditions are nothing compare to core woo issues

hopefully this year they are going to solve some of these issues woo product team working good lately

2 Likes