- Create an empty entity to hold your product:
- Add a new entity: Click the Add Entity button located in the Hierarchy panel.
- Select Empty: From the options available, select Empty to add a new empty entity to the Hierarchy.
- Make the entity active: Ensure your new entity is selected in the Hierarchy panel so its components are displayed in the Properties panel - Attach an Ecommerce Product component to your entity:
- Add a new component: In the Properties panel, click Add Component.
- Expand the Ecommerce category: Click on the Ecommerce category to see the available components.
- Select Ecommerce Product: Choose Ecommerce Product from the list. This action adds the component to your entity.
- Configure the component: Expand the newly added Ecommerce Product component in the Properties panel to view its settings.
- Load your product into the entity:
- Select Shopify as the provider: In the Provider dropdown menu, select Shopify.
- Choose a product: In the Product dropdown menu, select the product you want to load. This action configures the component to display the selected product
- Verify the product loads: The entity now populates with the model of the selected product. You can see the product appear in the Viewport. - Position your product in the scene:
- Use the Transform component: Select the entity in the Hierarchy panel. In the Properties panel, expand the Transform component to adjust the position, rotation, and scale of your product.
- Direct manipulation in the Viewport: Alternatively, directly manipulate the product in the Viewport by selecting it and using the move, rotate, and scale tools. - Expanding and viewing product details:
When you load a Shopify product into your scene, clicking on it in the Viewport displays its details, such as description, price, and add-to-cart options This interaction helps simulate the user shopping experience of your users.