Skip to main content
All CollectionsUse Cases
Hide element based on a condition
Hide element based on a condition
Updated over a week ago

In the following example, we will perform a simple operation of removing an element based on a condition. More precisely - we will remove the discount % badge from our design if the product is not on sale. For the procedure to work, make sure that both your source file and design file on which you work include elements that are relevant to the case. For the sake of the example let's assume our discount % badge is taken from discount_percentage parameter which is mapped and assigned onto our design.

First step is to select the project and design which you want to apply the above settings to. Select the project under the Teams section and then click on the design of your choice. Next, head over to the design manager by clicking on Edit in Design Manager on your left hand side (under the design image).

Select the Layer Settings and click the + sign next to the Discount Percentage element. From the dropdown list select Conditional Settings and use the following formula:

if sale_price is empty

then Hide

This way, we have successfully removed the discount % badge from all the products which do not contain any value in the sale_price parameter, thus aren't on sale. Keep in mind that the above case is just an example and can be used in variety of ways without being limited to elements like badges etc.

Did this answer your question?