# Featured product Source: Featured product shows one product with its photo and a working purchase form: customers choose a size or color, set the quantity and add it to the cart without leaving the page. Use it on the home page for a hero piece, a new release or a best seller. You can add it to any page. ## Choose the product Pick the product in **Product**. Its photo is the product’s featured image, and it links to the product page; a “View full details” link below the form leads there too. Until you choose a product, the section is hidden in your store. In the theme editor it shows a sample photo, sample text and a notice, so you can arrange the blocks first. ## Arrange the purchase form The form next to the photo is built from blocks, the same ones used in the [Product information](https://docs.ictsviluppo.example/dossier/sections/main-product) section of the product page: **Title**, **Price**, **Variant picker**, **Quantity selector**, **Buy buttons**, **Description** and **Text**. Drag them into the order you want and remove the ones you don’t need. Their settings work the same way as on the product page. - Use each block only once. **Title** and **Buy buttons** in particular must not be repeated. - Keep the **Title** block: it also names the section for screen readers. - **Buy buttons** holds the add to cart button and, if you leave **Show accelerated checkout buttons** on, the express payment buttons such as Shop Pay, PayPal or Apple Pay. Customers see only the methods available to them. - The **Text** block is for a short line such as “Free returns within 30 days”. Connect it to a product metafield to show different text for each product. - You can also add blocks from apps you have installed, such as reviews or size advisors. **Show vendor** adds the brand above the product name in the **Title** block. ## Variants and checkout Customers pick variants with buttons, color swatches or dropdowns, as set in the **Variant picker** block; the price, availability and the add to cart button update as they choose. Variants that are sold out or don’t exist in that combination are crossed out. Swatches come from options connected to a color metaobject in your Shopify admin. If the browser has JavaScript turned off, the form still works: customers choose the variant from a menu and the product is added to the cart. ## Place the photo **Media position on desktop** puts the photo on the left or on the right of the form on tablets and computers. On phones the photo always sits above the form. In right-to-left languages, such as Arabic and Hebrew, left and right swap automatically. **Use full page width** lets the section run to the edges of the window instead of the page’s usual width. ## Show it only between two dates Turn on **Schedule visibility** and set a start, an end, or both. This is useful for a product launch or a limited drop. See [Scheduling](https://docs.ictsviluppo.example/dossier/scheduling). ## Settings | Setting | Type | Default | Options | | - | - | - | - | | **Product** | Product | — | — | | **Media position on desktop** | Drop-down | Left | Left, Right | | **Show vendor** | Checkbox | Off | — | | **Layout** | | | | | **Use full page width** | Checkbox | On | — | | **Vertical spacing** | Drop-down | Regular | Compact, Regular, Spacious | | **Color scheme** | Color scheme | scheme-1 | — | | **Schedule** | | | | | **Schedule visibility** | Checkbox | Off | — | | **Start date and time** — Use the format YYYY-MM-DD HH:MM, in your store's time zone. Leave empty to show it right away. Shown when *Schedule visibility* is on | Text | — | — | | **End date and time** — Use the format YYYY-MM-DD HH:MM, in your store's time zone. Leave empty to keep showing it. Shown when *Schedule visibility* is on | Text | — | — | ## Blocks ### Title | Setting | Type | Default | Options | | - | - | - | - | | **SKU** — Updates with the selected variant. | Drop-down | Don't show | Don't show, Before title, Below title | ### Price Shop Pay Installments appear below the price when they're available in your store. This block has no settings. ### Variant picker | Setting | Type | Default | Options | | - | - | - | - | | **Options with swatches** | Drop-down | Swatches | Swatches, Buttons, Dropdown | | **Other options** | Drop-down | Buttons | Buttons, Dropdown | | **Swatch shape** — Swatches appear on options connected to a color metaobject. | Drop-down | Rectangle | Rectangle, Circle | | **Size chart** | | | | | **Page** | Page | — | — | | **Option name** — The link appears next to the option with this name. | Text | Size | — | ### Quantity selector B2B customers see their quantity rules and volume pricing here. This block has no settings. ### Buy buttons | Setting | Type | Default | Options | | - | - | - | - | | **Show accelerated checkout buttons** — Customers see the payment methods available to them, such as PayPal or Apple Pay. | Checkbox | On | — | | **Show gift card recipient form** — Shows on gift card products only. Customers can send the gift card to a recipient on a chosen date, with a personal message. | Checkbox | On | — | ### Description This block has no settings. ### Text | Setting | Type | Default | Options | | - | - | - | - | | **Label** — Shown before the text, for example "Fit". | Text | — | — | | **Text** — Connect a product metafield to show different text on each product. | Inline rich text | Free returns within 30 days | — | | **Text style** | Drop-down | Body | Body, Subtitle, Uppercase | This section also accepts app blocks.