Create a gift card product

Transcript

creating a gift card with Adobe Commerce, we’re gonna be using the APIs. And then we’re also gonna show you what this looks like using the Commerce admin. But in the end, the example for the API, we’re gonna create a product simple, very similar to this, where we’re gonna be able to pick an amount or define your own amount within a range of 10 to $100. You’ll be able to set the sender’s name and the recipient’s name and then a message, and then add it to cart. So let’s get started. The first place we’re gonna do is we’re gonna stop and find some values that we gonna need for our APIs. And the first one we’re gonna need is the attribute set that you may have a special one created for gift cards. If not, then the default attribute set will probably work. My Adobe Commerce instance has several attribute sets, but for this one, I’m just gonna use the default attribute set. And the ID number for that is number four. So you’ll have to check out your own installation and figure out which attributes that make sense. But once you do click on the link and then up in the URL bar, just see the ID number, and then you’re gonna use that for your API. The second thing that we need is the product attribute for gift card amount. And the reason for this is the API is expecting the ID number for this, not the code. And so same problem, the same premise is you will go to your admin, you will open it up and you’ll look at the ID number that’s been associated for gift card amounts. And in my use case, it’s ID number 134. So those are the two numbers four and 134 that I need to make sure that I remember when I do my APIs. Let’s go ahead and go over to our postman. And we’re gonna show you a simple payload with a few customizations for a few of the values. And in the documentation, I do provide a more complete payload that has a more granular look on all of the potential values that you can set, but for simplicity and to make sure that the minimum to mimic the product that I showed you earlier, this is the sample payload that we’re gonna use. For authentication, I did choose to use the bearer token, which is not recommended by Adobe commerce and for better security, you should use OAuth or at worst case, the admin users credentials. But for the simple use case that I’m showing you today, I chose to use the bearer token, which has been deprecated, but I enabled it just for this purpose. So for the payload and the URL, it’s gonna be the same URL that you use when you create any other product type. So it’s gonna be REST and then the store code and then V1 and then products. And you’re gonna use a post method and we’ll start at the top. A couple of the bare minimum requirements are a SKU and a name. And then the type in this case is a gift card. Here is my attribute set ID that I talked about earlier. And this is gonna be number four. And then we’ll just scroll down a little bit inside of the extension attributes. There’s a couple of values that I set just because I wanted the product to be available a little bit quicker and not have to manually set it. So I did give it a quantity and I did force it to be in stock of being true. And then under the gift card amounts node, this is where you would use that attribute ID for the product attribute. And so in my case for gift card amounts, that attribute ID is 134, which is why I defined it here. And then I set a value of 10 and then I set an alternate value using the same ID, a value of 20. So those are my two default values. And through configuration for this, it is another option we did set is allow the customer to be able to choose between 10 and $100. And we’ll go over that in a minute. For the gift message, once again, this is just an option that I decided to utilize just so you can see what it looks like. And then just a couple of other nodes in this section. But the thing to remember more than anything is that some of these values aren’t in extension attributes, they’re actually in custom attributes. This kind of threw me for a loop when I got started doing this investigation for this tutorial. And I wasn’t fully aware that some of these attributes actually lived in the custom attributes versus in a node by themselves or an extension attributes. So under custom attributes, there’s a lot of values that we can set here. The one in particular that I wanna use is this attribute code, which is going to be gift card amounts. And then the attribute ID that’s associated with it is 134. The value, this is where we’re setting some predefined values that they can choose from. So in this case, I chose a $10 option and then a $20 option. And then the open amount and minimum and maximum, these are for the option if someone chooses to set their own. So it starts at $10 and they can do any number between 10 and $100. So this is my fairly simple payload. I could have removed a few of these examples, but I wanted to see a fairly flexible and powerful version of a gift card. And this is a pretty good option. So if we’re ready and everything does look good, I’m gonna go ahead and hit send. And there we go. Let’s check the commerce site. Depending on how your site is set up, you might have to do a re-index. So I’m going to do that real quick because I do not have crons running on my local environment. And great. So the SKU that I was trying to create was gift card 21. And the name that I was trying to create was called gift card 21. And if I go back to my front end, there it is. So if I click on it, this has all the configurations that I was hoping. You get to choose an amount. You can also define your amount anywhere between 10 and $100. So we’ll do something like 16. We’ll give it a name. Add it to my cart. Everything looks good. Now we’re gonna go ahead and do the same thing, but we’re gonna do this via the admin. The benefit to the admin is you don’t have to look up some of these values ahead of time, like the attribute set ID or the gift card amount ID for the product attribute. But other than that, it’s fairly simple, fairly straightforward. And you can do all the options that we have with the APIs, except for just using the graphical UI. So to do that, you’re gonna go to catalog products and under add product, you’re gonna do gift card. And this is where you just have to use the UI to choose your attribute set. You don’t have to remember the ID, which is great. So we’re gonna do gift card 24. And you’ll notice that it automatically filled up my SKU. That’s fine. This is where you can define whether it’s physical or combined or virtual. We’ll just do a virtual one for now. We’ll add an amount of $16. And we will do some inventory. We’ll just say, nah, don’t bother. We don’t need you to manage inventory cause it’s virtual. We’ll go down to gift card information. There are some options that you can set here or you can just leave it as is, that’s fine. So if you’re happy and there’s nothing else that you wanna add, you can go ahead and hit save and close. And once again, because I don’t have crowns running, I’m gonna go ahead and kick off a re-index. All right, and so on my front end, on my homepage, I should have this new gift card 24. So let’s go see if it’s there. There it is, great. So if I click on it, you’ll see I have a few more options because my values were slightly different than my API, but basically the same premise. So we’ll just do Ross, Ross at adobe.com. Jerry, Jerry at adobe.com. All right, and just add to cart. Everything looks great. So that’s how you would create a gift card in Adobe Commerce using the APIs as well as the Commerce admin. Don’t forget to continue your experience and your learning through experience league, trying to find new ways to expand your knowledge on Adobe Commerce.