# Product Page

{% hint style="warning" %}
Please note that this section/document is still <mark style="color:purple;">**Work in Progress**</mark><mark style="color:purple;">.</mark> It might be updated, revised, or changed entirely in the near future.&#x20;
{% endhint %}

Navigate to the Product Page within the Penni Cart App to begin personalizing your e-commerce experience. This page offers a comprehensive list of both essential and recommended components for your product page. Each component is outlined with corresponding attributes and values to ensure seamless app functionality.

{% embed url="<https://drive.google.com/file/d/1QuCBh2Ufx0EFOuReXvs_eHObdgJ_6Ugo/view?usp=drive_link>" %}
How To Add Attributes
{% endembed %}

### <mark style="color:purple;">Follow These Steps Link Your Product Page</mark>:

1. **Open the Penni Cart App:** Start by navigating to the Product Page within the app. Here, you'll find a grid showcasing all the necessary components for your product page, including required attributes and their values.
2. **Copy and Paste Attributes:** In the Penni Cart App, select the attribute, such as "Product Name," to copy its value. In your Webflow project, navigate to the custom attributes section, entering "Product Name" as the attribute name and pasting the copied value accordingly.
3. **Validate Attributes:** After implementing all the required attributes, use the "Validate Attributes" function. This will check for any issues or missing links, ensuring everything is correctly configured.
4. **Address Feedback:** The app will highlight any areas needing attention or corrections, guiding you towards a fully functional setup.
5. **Complete Setup:** Once all required components are validated, your product page is all set.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.pennicart.io/components/product-page.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.