> For the complete documentation index, see [llms.txt](https://docs.northcommerce.com/north-commerce/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.northcommerce.com/north-commerce/shortcodes/product-page.md).

# Product Page

This shortcode will render a collection of products but when a product is selected and the URL includes the product slug, the single product is rendered.

```
[nc-product]
```

There are additonal options available in the product collection such as product options and add to cart. Once a product is selected and the url includes the product, the product page will reload and show the product page for a customer to checkout.

<figure><img src="/files/UHO1PZgI75YHhNDIGN4a" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
If you'd like to edit the CSS of the shortcode you can see the [styling section for more information.](broken://pages/HBax4TfXcOfcxtomXbs9)
{% endhint %}