Get a Demo

Each page within the store app has its own template to display that page's content.

Template files will go in a folder that has the same name as the app instance key. For example, if the store app instance key is "store" then you would put all of your template files within the store folder inside the templates folder.

If your theme was called "Custom" then this would be an example folder structure:

  • themes
    • custom
      • theme.json
      • templates
        • home.twig
        • one-column.twig
        • two-column.twig
        • store
          • cart.twig
          • category.twig
          • categories.twig
          • checkout-error.twig
          • checkout-payment.twig
          • checkout-receipt.twig
          • checkout-review.twig
          • checkout-shipping.twig
          • home.twig
          • manufacturer.twig
          • manufacturers.twig
          • product.twig
          • products.twig
          • search.twig
          • search-results.twig
          • tag.twig
          • tags.twig

Below is the list of app pages and the name of the template file that you should create.

This cart page is used to show the contents of the customer's shopping cart.

Template name: cart.twig

This page shows the list of categories.

Template name: categories.twig

This page shows information for an individual category. The products assigned to the category are often shown.

Template name: category.twig

This page shows information for an individual manufacturer. The products assigned to the manufacturer are often shown.

Template name: manufacturer.twig

This page shows the list of manufacturers

Template name: manufacturers.twig

The product detail page shows the information for an individual product. This page will often have an order form to order the product.

Template name: product.twig

The products list page is usually a continuation of the paginated list of products from the store app home page.

Template name: products.twig

The store home page is often used to show categories or a paginated list of products.

Template name: home.twig

The search page can be used to show the search form to search for products. Alternatively you can use the Search Form API to embed the search form on other pages. 

Template name: search.twig

The search results page can show the results of a product search. It can show a paginated list of matching products.

Template name: search-results.twig

This page shows the list of tags.

Template name: tags.twig

This page shows information for an individual tag. The products assigned to the tag are often shown.

Template name: tag.twig

The error checkout page is used to show a message if their payment method fails. 

This shows after the Checkout - Review step.

Template name: checkout-error.twig

The payment checkout page shows the available shipping options for the customer to choose from as well as captures their billing and payment information. 

This is the second step in the checkout process.

Template name: checkout-payment.twig

The receipt checkout page shows the customer their receipt and payment confirmation for their order.

This is the last step in the checkout process.

Template name: checkout-receipt.twig

The review checkout page shows the shipping, billing, and cart information for the customer to review before placing their order.

This is the third step in the checkout process.

Template name: checkout-review.twig

The shipping checkout page is for capturing the customer's shipping name, address and contact information. 

This is the first step in the checkout process.

Template name: checkout-shipping.twig

Get Started With Aptuitiv