# Product information
_UIdTrIdP.jpg)
Add, edit, or remove any information on your product pages. Accurate, reliable, and in-depth product details help customers find the information they need to make buying decisions.
## How to add a Product information section to your Shopify store
1. In the theme editor (**Customize**), open the template selector.
2. Select **Products**, then **Default product.**
3. On the left sidebar, add **Product information.**
4. Make necessary changes > **Save.**

## How to edit your Product information section
### Section settings
| Setting | Description |
| ------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------- |
| **Container** | Choose the content width: Fixed with, Stretched width and Full width |
| **Show breadcrumbs** | Show or hide breadcrumb navigation on the product page. *Learn more:* [*Breadcrumbs*](https://docs.foxecom.com/zest-theme/collections-and-products/product-page/breadcrumbs) |
| **Enable sticky content on desktop** | Keep product information visible while scrolling on desktop |
| **Desktop layout** | Choose how product media is displayed on desktop |
| **Desktop media size** | Set the product media size on desktop: Small, Medium, or Large |
| **Mobile layout** | Choose how product media and thumbnails are displayed on mobile |
| **Enable image zoom** | Allow customers to zoom in on product images |
| **Enable video looping** | Automatically replay product videos in a loop |
| **Show featured media by default** | Show the product’s featured media first instead of the selected variant’s image |
Keep the product information fixed on screen while customers scroll through the product media:

Choose how product media is displayed on desktop, including stacked, grid, horizontal thumbnail, or vertical thumbnail layouts:
_wyU9x93k.gif)
_Mnx0DFG1.gif)



Choose whether product thumbnails are shown or hidden on mobile devices:


Allow customers to tap product media to zoom in and view details more closely:
_LxXokTwv.gif)
### Product information blocks

Add and arrange content blocks within the product information section to control what customers see.
Custom tags
Product vendor
Product type
Product title
Price
Variant picker
Inventory status
Quantity selector
Buy buttons
Product meta
Shipping information
Add-on buttons
Collapsible tab
Custom field
Trust badge
Complementary products
Countdown timer
Text
Rich text
Image
#### Custom tags

Display custom promotional tags on the product page, such as sale, new arrival, or special offer labels.
To add custom tags, go to **Shopify Admin > Products > Tags**, then add tags using one of these formats:
* `tag__hot_[DISPLAY_TEXT]`
* `tag__new_[DISPLAY_TEXT]`
* `tag__sale_[DISPLAY_TEXT]`
Replace `[DISPLAY_TEXT]` with the text you want customers to see.
Example: `tag__hot_-50% OFF` or `tag__new_NEW ARRIVAL`
*Learn more:* [*Add custom badges to your products*](https://docs.foxecom.com/zest-theme/guides/products-and-collections/add-custom-badges-to-products)
#### Product vendor


Displays the product’s vendor name, pulled directly from the product information in Shopify Admin.
#### Product type


Displays the product type assigned in Shopify Admin, helping identify the product category.
#### Product title

Choose the display size of the product title, from Medium to Mega title.
#### Price

Display the product price, including the regular price, sale price, and optional sale badge when applicable.
| Setting | Description |
| ------------------- | ----------------------------------------------------------------------- |
| **Show sale badge** | Show or hide the sale badge when the product is discounted |
| **Sale badge type** | Choose how the discount is displayed: Text, Percentage, or Fixed amount |
#### Variant picker

Let customers choose product variants and optionally access a size chart for relevant options. To learn about variants and how to add product variants, see [Variants](https://help.shopify.com/en/manual/products/variants).
| Setting | Description |
| ------------------------------------ | -------------------------------------------------------------------------- |
| **Picker type** | Choose how variant options are displayed: Dropdown or Buttons |
| **Show selected option** | Display the currently selected option next to the option name |
| **Don’t select the default variant** | Require customers to select a variant manually instead of preselecting one |


*To enable color swatches for variant options, check out our* [***Color swatches***](https://docs.foxecom.com/zest-theme/theme-settings/color-swatches) *guide.*
**How to display Size chart in the Variant picker?**

| Setting | Description |
| -------------------- | --------------------------------------------------------------------------------------------------- |
| **Size chart title** | Enter the product option name where you want the size chart button to appear, for example **Size**. |
| **Size chart page** | Select the page that contains your size chart content. |
**Want to use a different size chart for each product?**
To display a different size chart for each product, create a [product metafield](https://help.shopify.com/en/manual/custom-data/metafields) with the following settings:
* **Namespace and key:** `foxtheme.size_chart`
* **Type:** Page

*Learn more:* [*Add a size chart to your product page*](https://docs.foxecom.com/zest-theme/guides/products-and-collections/enable-size-chart-on-product-pages)
#### Inventory status

Show customers the current inventory level and highlight when stock is running low.
| Setting | Description |
| ---------------------------------- | -------------------------------------------------------------- |
| **Low inventory threshold** | Set the stock level at which the low inventory message appears |
| **Show progress bar** | Display a visual bar showing the remaining inventory level |
| **Show inventory transfer notice** | Show a notice when incoming inventory is on the way |
The inventory status block lets you display the stock status on individual product pages so that customers can know if a product is in stock, running low in stock, or when more stock arrives.
To show the **Inventory status** as in stock and low stock alerts on your product page, in **Shopify products** > **Variants**:
* enable ✅ **Track quantity**;
* disable **Continue selling when out of stock**.

In the product template, add I**nventory status** block > select the **Low inventory threshold** by tweaking the slider (between 0 and 20).

You can also show the low inventory alert as a progress bar.

To **show inventory transfer notice**, you need to create a inventory transfer. Below are the needed steps to display the inventory transfer notice on individual product pages.
Step 1: From your Shopify admin, go to **Products** > [**Transfers**](https://www.shopify.com/admin/products/transfers).
Step 2: Click **Add transfer**.
Step 3: In the **Add products** section, enter or select the products and variants that you want to add to the transfer, and then click **Add to transfer**.
Step 4: Under **Quantity**, enter the quantities for each product in the transfer.
Step 5: In the **Shipment details** section, enter a date in the **Estimated arrival** field.
Step 6: **Save** the settings.

#### Quantity selector

Let customers choose how many units of the product they want to purchase before adding it to cart.
#### Buy buttons

Let customers add the product to cart or go directly to checkout, with optional gift card recipient details.
| Setting | Description |
| ---------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Show add to cart button** | Show or hide the Add to cart button |
| **Show dynamic checkout buttons** | Display an accelerated checkout option based on available payment methods, such as PayPal or Apple Pay
[*Learn more about Shopify Dynamic checkout buttons*](https://help.shopify.com/manual/online-store/dynamic-checkout)*.* |
| **Show recipient form for gift card products** | Allow customers to send gift card products to a recipient with a personal message
[*Learn more about gift cards.*](https://help.shopify.com/manual/products/gift-card-products) |
#### Product meta

Display key product details such as availability, SKU, collections, tags, vendor, and product type.
| Setting | Description |
| --------------------- | -------------------------------------------------------- |
| **Show availability** | Display whether the selected product variant is in stock |
| **Show SKU** | Display the SKU of the selected product variant |
| **Show collections** | Display the collections the product belongs to |
| **Show tags** | Display the product tags |
| **Show vendor** | Display the product vendor |
| **Show type** | Display the product type |
#### Shipping information

Display estimated delivery information and an optional shipping note on the product page.
| Setting | Description |
| ---------------- | ------------------------------------------------------------------------------------------------------------------------------------- |
| **Deliver text** | Enter the text shown before the estimated delivery date |
| **Deliver in** | Set the estimated number of days until delivery |
| **Note** | Add supporting shipping information, such as a free shipping message |
| **Date format** | Choose how the estimated delivery date is displayed, such as `%b %d`
[*Learn more about date format here.*](http://strftime.net/) |
#### Add-on buttons

Adds quick action buttons below the product information, allowing customers to share the product or send a question.
| Setting | Description |
| -------------------------- | --------------------------------------------------------------------------------------------------------- |
| **Show social sharing** | Show or hide the **Share** button so customers can share the product on social platforms. |
| **Show ask question form** | Show or hide the **Ask a question** button, which opens a form for customers to submit product questions. |

To use the social sharing option, make sure it is enabled and add your social media links under [**Social media**](https://docs.foxecom.com/zest-theme/theme-settings/social-media) settings.

Your Ask a question form sends all submissions to the **sender email address** of your store. You can change the sender email address in the **Notifications** settings page of your Shopify admin.
#### Collapsible tab

Adds expandable content to the product page, helping organize detailed information such as shipping, returns, ingredients, specifications, or FAQs.
| Setting | Description |
| ------------------------- | ---------------------------------------------------------------------- |
| **Icon** | Choose an icon to display next to the tab heading. |
| **Heading** | Enter the title of the collapsible tab. |
| **Tab content** | Add and format the content shown when the tab is expanded. |
| **Content by Liquid** | Add custom HTML or Liquid code for more advanced or dynamic content. |
| **Tab content from page** | Pull content from an existing Shopify page. |
| **Default open** | Keep the tab expanded by default when customers open the product page. |
⭐ *To display different content for different product pages, use **metafields** to connect dynamic content. Check out* [*Show dynamic content for Products using Metafields*](https://youtu.be/6TT9lbSOJ9M)**
#### Custom field

Adds a custom input field to the product page so customers can provide additional information before adding the product to cart.
| Setting | Description |
| ----------------------------- | ---------------------------------------------------------------------------------- |
| **Field name** | Enter the label for the custom field. |
| **Field type** | Choose the input type: **Single line text**, **Multi line text**, or **Dropdown**. |
| **Options** *(Dropdown only)* | Add dropdown choices, with each option on a new line. |
| **Placeholder** | Add placeholder text to guide customers on what to enter. |
| **Required** | Make the field mandatory before the product can be added to cart. |
| **Show at checkout** | Show the captured information in the order summary on checkout pages. |
**Single line text** is best for short answers, **Multi line text** gives customers more space for detailed responses, while **Dropdown** lets them choose from a predefined list of options:



#### Trust badge

Adds a trust badge to the product page to highlight secure checkout, guarantees, or other confidence-building information.
| Setting | Description |
| -------------------- | -------------------------------------------------------------------- |
| **Heading** | Add and format the text shown with the trust badge. |
| **Image** | Select or upload the trust badge image. |
| **Image width** | Adjust the display width of the image. |
| **Heading position** | Choose whether the heading appears **above** or **below** the image. |
#### **Complementary products**

Displays related products that customers may want to buy together with the current product. Complementary products are configured through [**Shopify’s Search & Discovery app**](https://apps.shopify.com/search-and-discovery).
| Setting | Description |
| ------------------------------- | ----------------------------------------------------------------------------------------------- |
| **Heading** | Enter the title shown above the complementary products. |
| **Heading tag** | Choose the HTML heading tag used for the title, such as H2 or H3. |
| **Maximum products to show** | Set the maximum number of complementary products displayed. |
| **Number of products per page** | Choose how many products appear at one time. |
| **Enable carousel** | Allow customers to scroll through products when there are more items than can be shown at once. |
**How to choose complementary products for the main product?**
1. Go to [**Shopify’s Search & Discovery app**](https://apps.shopify.com/search-and-discovery).
2. Open **Recommendations**.
3. Select the main product you want to configure.
4. Under **Complementary products**, choose the products that pair well with the main product.
5. Save your changes.
For the best results, choose products that complete the purchase, such as matching accessories, useful add-ons, or items customers are likely to buy together.


#### Countdown timer

Display a countdown timer to create urgency for promotions, with either a repeating countdown or a fixed end date.
| Setting | Description |
| --------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- |
| **Countdown type** | Choose between an Evergreen countdown that repeats automatically or a Fixed time countdown that ends at a specific date and time |
| **Duration** *(Evergreen only)* | Set how often the countdown resets, such as every 2 hours, 6 hours, 12 hours, day, week, or month |
| **Ends time** *(Fixed time only)* | Set the exact date and time when a countdown ends |
| **Heading** | Enter the text displayed above the countdown timer |
| **Heading size** | Choose the display size of the countdown heading |
| **Heading tag** | Select the HTML heading tag used for the heading |
| **Style** | Choose between Minimal and Highlight countdown styles |
| **Number size** | Set the size of the countdown numbers: Small, Medium, or Large |
**Minimal** keeps the countdown clean and subtle, while **Highlight** gives it more visual emphasis to draw customers’ attention:


**Want to set a different countdown timer for each product?**
To display a different countdown end time for individual products, create a [product metafield](https://help.shopify.com/en/manual/custom-data/metafields) with the following settings:
* **Namespace and key:** `foxtheme.countdown`
* **Type:** Date and time
Then, set the desired date and time in this metafield for each product.

#### Text
Adds a short text message with an optional icon to highlight key product benefits, policies, or trust information.
| Setting | Description |
| -------------- | ------------------------------------------------------------------------ |
| **Icon** | Choose an icon to display alongside the text. |
| **Text** | Enter the message you want to display. |
| **Text style** | Choose how the text is styled: **Body**, **Subtitle**, or **Uppercase**. |
#### Rich text
Adds formatted text content to the product page, with options to style text, add links, and create lists.
| Setting | Description |
| ------- | ----------------------------------------------------------------------------------------------- |
| Content | Enter and format rich text using headings, bold, italic, links, and bulleted or numbered lists. |
#### Image
Adds an image block to the product page, with options to link the image and control its size and alignment.
| Setting | Description |
| ------------------- | ---------------------------------------------------------- |
| **Image** | Select or upload the image you want to display. |
| **Image link** | Add a link customers will open when they click the image. |
| **Image width** | Adjust the display width of the image. |
| **Image alignment** | Align the image to the **Left**, **Center**, or **Right**. |