Announcement: You can find the guides for Commerce 7.5 and later on the new Elastic Path Documentation site. This Developer Center contains the guides for Commerce 6.13.0 through 7.4.1.Visit new site

This version of Elastic Path Commerce is no longer supported or maintained. To upgrade to the latest version, contact your Elastic Path representative.

5 - Viewing the T-shirt Product in the Storefront

5 - Viewing the T-shirt Product in the Storefront

To see your Storefront extension classes in action, follow the steps below:

Starting the web applications

Start the web applications as shown in 2. Run Storefront.

Setting up the T-shirt product

Before you can view a T-shirt product in the Storefront, you need to create a T-shirt product and category. Use the steps in the pages below as a guide for making a T-shirt category and product with the Commerce Manager Client:

  1. Create the T-shirt product type
  2. Create the T-shirt category (See the Creating a Category section)
  3. Create the T-shirt product
  4. Link the US Virtual Catalog to the T-Shirt category
  5. Add inventory to the T-shirt product (See the Receiving Inventory section)

Ordering a T-Shirt

After creating the T-shirt product and linking the T-shirt category to the US Virtual catalog, you are ready to view your Storefront extensions in action:

  1. Go to the SnapItUp home page: http://demo.elasticpath.com:8080/storefront/ tshirt-tab.png You should see the T-shirts tab.
  2. Click the T-Shirts tab to display the T-shirt category.
  3. Click your T-Shirt product.tshirt-custom-fields.png
  4. Type in your T-shirt's front and back text and click Add to Cart.
  5. Click Checkout.
  6. Under I HAVE an account, log in as the following user:
    Email Address alana.abercombie@elasticpath.com
    Password password
  7. In the Shipping Address page, click Save and Continue.
  8. In the Delivery Options page, click Save and Continue.
  9. Under Payment Information, enter the following security code and click Submit Order.
    Security Code
    111
  10. Under Order Details, remember the Order Number since you'll need it for the next step.OrderNumber.png