May 8, 2023
Epic Parts and Accessories App Setup
In this video we go over how to set up the Epic Parts and Accessories App for BigCommerce
(Epic Parts and Accessories App Setup)
Hello, and welcome to the parts and accessories app for big commerce by Epic design labs, my name is Kalin. In this video, I'm going to show you guys how to set this thing up, I'm gonna share my screen.
And when you come in here, there's going to be basically three steps that you need to do, you need to associate related products to the product, you need to potentially set up groups if you want to. And then you need to configure it by putting the widget onto the page or putting the app onto the page.
And I'm going to walk you guys through how to do all of that stuff. So first of all, on the product Mapping tab, what we're going to do is we're going to pick a product, in this case, I'm going to pick this bye bye orb mineral stone ornament black, I'm going to click Setup product. And I already had two products attached to it. So I'm going to attach those. And this is how it's going to look when you first come into a brand new product that doesn't have anything attached to it.
And so basically, what we need to do is we need to find some stuff that we consider to be related to it. So let's say let's put this guy in there by clicking Add product to accessories. And you'll see that when that happens and modal comes up that says select Group. Now if you have multiple groups created, then this will this is where you can pick from them.
If you only have the the default group in there, which is what you have when you first get started, then you can just leave it default and click Apply. And I'm going to choose a couple more. Put Like five in here all together.
All right. So now it says that attached to this product are these five related products. And it shows you what group each one is in it shows you the SKU of each one, you can do a search down here by title or by SKU to make your your attaching a little bit easier. If you need to remove any of these because you accidentally put one that doesn't belong, you can click Remove.
And that's about it. So now we have the products that are attached to that. So we've created the relationships and we can click go back. And now this product is basically has something set up no nothing else has any products attached to it, just that one.
Now, let's look into the Groups tab. This is where you can create multiple groups. By default, there is one group in there called default. And if you want to create a new group, you can come in here and say more stuff. And then that'll create an additional group.
And then you can attach attach related products to that group on that product. But for right now we just have default configuration tab is where we can say this should be a grid or list view. Here's where the text size we can set here's where we can set the text color of the header.
And then we can click Save Changes. There may be more fields here in the future to for further configuration. But for right now, that's all there is that here at the bottom it says to install the parts and accessories please insert this HTML code in your template where you want the app to show the product.
So this is referring to the product page somewhere. Because this is where there is something for there to be related products attached. Right. So it says it should be inserted somewhere on your product page, eg your product HTML or Pardesh view dot HTML.
There's a lot of places where it really can be because there's a lot of components on your product page. But for right now, let's just copy this. And we're going to go into this storefront themes, we're gonna go into Advanced Edit theme file so we can get right to the theme files. And then here, we're gonna go into templates, pages, product dot HTML.
So this is your parent most product page. And we're going to insert it into here. And let's see here, let's let's insert it right here under the product SVO. And click Save. And there we go. If we refresh this page, and we scroll down, we can now see our related products here.
Now the heading does say default because that's our group name. So what we can do now is come back to our app and rename that group. So let's come back here and rename this to be called Big assessories. Let's just call it related. Let's call it accessories, accessories as well. All right, I hope so.
Just like that. And if we refresh now it says accessories. Now, again, you can create multiple groups so you can have an Excel threes and a parts and are more related products or whatever you want to say but that puts them right here on the page just that easy alright thanks so much