Introduction to the new and improved conditional rendering feature.
00:23
First Rule Group
Creating a rule group based on cart subtotal and discount code.
01:00
Second Rule Group
Creating a second rule group for logged-in users and cart value.
01:32
Combining Rule Logic
Understanding how to combine multiple rule groups with AND/OR logic.
Transcript
00:02
Conditional rendering or display rules is one of the most commonly used features of our product.
00:06
And after talking to some merchants and looking at some data, we realized that this was a great opportunity for us to go one step further.
00:11
so we looked at the original system and designed a completely new one, which will enable merchants to do way more than ever before.
00:19
When using the new conditional rendering feature, we actually use groups.
00:23
So if we go to cart subtotal here, and let's say, okay, we want this component to show to customers that have less than $300 in their cart and they need to have a discount code which contains test, we can decide whether or not we want to say all of these need to be true, or at least one of these need to be true.
00:43
But for this example, we'll say all, and we'll give this rule group a name.
00:47
So we'll say, cart 300 discount code.
00:56
Now, that's a group that's been created.
00:57
But what we can also do here is make another group so we can say, okay, well, what if the cart subtotal Is less than 100?
01:10
We add another rule and they're logged in, and we'll give this a name.
01:20
So, member 100.
01:28
And you can see that there are two rule groups here which both must have all conditions met.
01:34
At this stage, this component will render if one of these is true.
01:38
Now, you can combine these and actually say, you know what, we want both of these groups to be true.
01:44
Or you can go and edit this and say, okay, well, if they've got a discount code or if the cart value is less than 300, then I'm happy to have this component to show.
01:55
And again, we can say all of these have to be true.
01:58
So in this instance, they could have the discount code of test, and these conditions can be met and they This component will show, or