# Product page The main section within this page is the one called `Product`. Below or above this section you can add more sections, but we suggest keeping the product section at the top:
### Main settings #### Labels font You can choose between `Heading font` and `Body font` settings. Changing this will result in changing the font of the following elements: * Price * Quantity * Variant options * Accordion titles #### Media You have separate options to change the aspect ratio of the image for desktop and mobile. \---- Other options in the section are: * **Enable image zoom gallery** -- if checked, this enables the gallery popup when the product images are clicked. * **Autoplay first video** -- if you're using a video for first media item, it can be autoplayed. * **Layout** -- choose between `Grid` and `Thumbs` layout for the images: * Grid:\ ![](/files/AoWbcoGJP9GCp6l0ug8t) * Thumbs:\ ![](/files/ZWFLQi9MsMtpbfTeMLnS)\ The thumbs can be positioned on the left, right or below the main image. This can be toggled from the `Thumbs position` setting. #### Pagination * **Autoplay** -- if checked, the product images will autoplay when they are in the `Thumbs` layout. * **Slideshow Interval** -- set the slideshow interval when the slides will change. ## Blocks All of the main product content (marked in orange below) is managed through blocks (marked in green below):
#### Badges Except the block adding there are no additional settings here. Adding the block just means that the badges should be shown where the block is positioned. You can use a prefixed product tag to add custom badges. For example `badge:New` will show a badge `New`. The Out of Stock badge is automatic and is base on the product quantity. #### Heading, Price, Vendor, Description These are all fixed in terms of content and they're always loaded from the product details. #### Variant selector This is the block showing the variants.
From here you can activate the `Size guide` link by checking the `Show size guide` checkbox.\ You can select the content from which page should be displayed when the size popup opens. If needed, you can enable the size guide calculator by checking the `Enable size guide calculator` checkbox.\ More details about the size guide calculator can be found [`here`](https://bigstart.gitbook.io/amber-documentation/content-sections/size-guide). #### Stock notification This enables the stock progress bar:
From the block you can set the threshold when the progress bar should show up.\ In the example above, it's set to 15 and there are 5 product left, so 1/3 of the bar is filled. #### Quantity This block shows the quantity selector. #### Pickup availability
This shows information about where the product can be picked up. The product needs to be set as such in the back-end. Clicking the `View store information` shows a popup with the available locations. #### Purchase options Used for products which offer subscription options. #### Buy buttons Shows the add to cart buttons. From here you can enable the dynamic checkout buttons. The block has the option to enable/disable the recipient information form for the gift card products. #### Collapsible description Use these type of blocks for the collapsible accordions. They can be either dynamic (using the product metafields), or the same for all products. --- # 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://bigstart.gitbook.io/amber-documentation/pages/product-page.md?ask= ``` 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.