[{"data":1,"prerenderedAt":836},["ShallowReactive",2],{"navigation_docs":3,"-products-product-page":126,"-products-product-page-surround":831},[4,17,54,71,84,113],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":6},"Introduction",false,"/introduction","1.introduction",[10,13],{"title":5,"path":11,"stem":12},"/introduction/introduction","1.introduction/1.introduction",{"title":14,"path":15,"stem":16},"Section structure","/introduction/section-structure","1.introduction/2.section-structure",{"title":18,"icon":6,"path":19,"stem":20,"children":21,"page":6},"Products","/products","2.products",[22,26,30,34,38,42,46,50],{"title":23,"path":24,"stem":25},"Product page","/products/product-page","2.products/1.product-page",{"title":27,"path":28,"stem":29},"Key features","/products/key-features","2.products/2.key-features",{"title":31,"path":32,"stem":33},"Complementary products","/products/complementary-products","2.products/3.complementary-products",{"title":35,"path":36,"stem":37},"Specifications","/products/specifications","2.products/4.specifications",{"title":39,"path":40,"stem":41},"Product badges","/products/product-badges","2.products/5.product-badges",{"title":43,"path":44,"stem":45},"Size chart","/products/size-chart","2.products/6.size-chart",{"title":47,"path":48,"stem":49},"Color swatches","/products/color-swatches","2.products/7.color-swatches",{"title":51,"path":52,"stem":53},"Quick view modal","/products/quick-view-modal","2.products/8.quick-view-modal",{"title":55,"icon":6,"path":56,"stem":57,"children":58,"page":6},"Collections","/collections","3.collections",[59,63,67],{"title":60,"path":61,"stem":62},"Collection page","/collections/collection-page","3.collections/1.collection-page",{"title":64,"path":65,"stem":66},"Subcollections","/collections/subcollections","3.collections/2.subcollections",{"title":68,"path":69,"stem":70},"Promotion cards","/collections/promotion-cards","3.collections/3.promotion-cards",{"title":72,"icon":6,"path":73,"stem":74,"children":75,"page":6},"Cart","/cart","4.cart",[76,80],{"title":77,"path":78,"stem":79},"Cart drawer","/cart/cart-drawer","4.cart/1.cart-drawer",{"title":81,"path":82,"stem":83},"Free shipping bar","/cart/free-shipping-bar","4.cart/2.free-shipping-bar",{"title":85,"icon":6,"path":86,"stem":87,"children":88,"page":6},"Header & Footer","/header-footer","5.header-footer",[89,93,97,101,105,109],{"title":90,"path":91,"stem":92},"Header","/header-footer/header","5.header-footer/1.header",{"title":94,"path":95,"stem":96},"Navigation","/header-footer/navigation","5.header-footer/2.navigation",{"title":98,"path":99,"stem":100},"Mega menus","/header-footer/mega-menus","5.header-footer/3.mega-menus",{"title":102,"path":103,"stem":104},"Announcement bar","/header-footer/announcement-bar","5.header-footer/4.announcement-bar",{"title":106,"path":107,"stem":108},"Promotion bar","/header-footer/promotion-bar","5.header-footer/5.promotion-bar",{"title":110,"path":111,"stem":112},"Footer","/header-footer/footer","5.header-footer/6.footer",{"title":114,"icon":6,"path":115,"stem":116,"children":117,"page":6},"Theme features","/theme-features","6.theme-features",[118,122],{"title":119,"path":120,"stem":121},"Newsletter popup","/theme-features/newsletter-popup","6.theme-features/1.newsletter-popup",{"title":123,"path":124,"stem":125},"Headings","/theme-features/headings","6.theme-features/2.headings",{"id":127,"title":23,"body":128,"description":824,"extension":825,"links":826,"meta":827,"navigation":828,"path":24,"seo":829,"stem":25,"__hash__":830},"docs/2.products/1.product-page.md",{"type":129,"value":130,"toc":788},"minimark",[131,144,149,211,215,225,230,233,269,273,276,296,300,303,307,310,336,340,354,358,365,369,389,393,404,408,415,419,422,436,439,465,475,482,486,489,515,526,530,537,551,560,564,575,579,586,631,635,638,641,647,650,656,659,664,668,671,674,677,681,688,692,695,699,702,706,715,719,725,755,758,762,765,779,783],[132,133,134,135,139,140,143],"p",{},"The ",[136,137,138],"strong",{},"product page"," is where customers explore a product — browse images and videos, select options, read details, and add items to their cart. It is built from a ",[136,141,142],{},"Product"," section with a media gallery on the left and a stack of customizable content blocks on the right.",[145,146,148],"h2",{"id":147},"editing-the-product-page","Editing the product page",[150,151,153,158,173,177,186,190,196,200],"steps",{"level":152},"4",[154,155,157],"h4",{"id":156},"open-the-theme-editor","Open the Theme Editor",[132,159,160,161,164,165,168,169,172],{},"In your Shopify admin, go to ",[136,162,163],{},"Online Store"," > ",[136,166,167],{},"Themes"," and click ",[136,170,171],{},"Customize"," on the Atlas theme.",[154,174,176],{"id":175},"navigate-to-a-product-page","Navigate to a product page",[132,178,179,180,164,182,185],{},"Use the page selector in the top bar to switch to ",[136,181,18],{},[136,183,184],{},"Default product",". Select a specific product to use as a preview while editing.",[154,187,189],{"id":188},"select-the-product-section","Select the Product section",[132,191,192,193,195],{},"In the left sidebar, click the ",[136,194,142],{}," section to access the section-level settings (gallery layout, video behavior, sticky add to cart, colors, and spacing). Click any of its blocks to configure individual content areas like the title, price, variant picker, or description.",[154,197,199],{"id":198},"add-remove-or-reorder-blocks","Add, remove, or reorder blocks",[132,201,202,203,206,207,210],{},"Click ",[136,204,205],{},"Add block"," inside the Product section to insert new blocks. Drag blocks to reorder them, or click the ",[136,208,209],{},"Remove"," option to delete a block.",[145,212,214],{"id":213},"media-gallery","Media gallery",[132,216,217,218,221,222,224],{},"The media gallery displays your product images, videos, and 3D models. Two layout modes are available under the ",[136,219,220],{},"Gallery"," settings in the ",[136,223,142],{}," section.",[226,227,229],"h3",{"id":228},"carousel-default","Carousel (default)",[132,231,232],{},"Displays one image at a time with a thumbnail strip for navigation.",[234,235,236,251],"ul",{},[237,238,239,242,243,246,247,250],"li",{},[136,240,241],{},"Thumbnails position"," — show thumbnails on the ",[136,244,245],{},"Left"," (vertical strip) or ",[136,248,249],{},"Bottom"," (horizontal strip).",[237,252,253,256,257,260,261,264,265,268],{},[136,254,255],{},"Carousel indicator (mobile)"," — choose how customers navigate the carousel on mobile: ",[136,258,259],{},"Thumbnails",", ",[136,262,263],{},"Counter"," (e.g., \"1 / 5\" with arrows), or ",[136,266,267],{},"Bar"," (a progress bar).",[226,270,272],{"id":271},"grid","Grid",[132,274,275],{},"Displays all images in a grid layout. Three grid types are available:",[234,277,278,284,290],{},[237,279,280,283],{},[136,281,282],{},"One column"," — a single-column stack.",[237,285,286,289],{},[136,287,288],{},"Two columns"," — images arranged in an equal two-column grid.",[237,291,292,295],{},[136,293,294],{},"Two columns with featured image"," — the first image spans the full width, with the rest in two columns.",[226,297,299],{"id":298},"zoom","Zoom",[132,301,302],{},"Customers can click a zoom icon on any image to open a full-screen lightbox with the original high-resolution image. Navigation within the lightbox stays in sync with the gallery.",[226,304,306],{"id":305},"video","Video",[132,308,309],{},"Four settings control video behavior in the gallery:",[234,311,312,318,324,330],{},[237,313,314,317],{},[136,315,316],{},"Enable autoplay"," — videos play automatically when they come into view.",[237,319,320,323],{},[136,321,322],{},"Mute videos by default"," — starts videos with sound off (required for autoplay).",[237,325,326,329],{},[136,327,328],{},"Show video controls"," — displays play, pause, and volume controls.",[237,331,332,335],{},[136,333,334],{},"Loop videos"," — videos restart automatically when they end.",[226,337,339],{"id":338},"other-gallery-settings","Other gallery settings",[234,341,342,348],{},[237,343,344,347],{},[136,345,346],{},"Product gallery width"," — controls how wide the gallery column is relative to the product info column (40–66%).",[237,349,350,353],{},[136,351,352],{},"Only show selected variant images"," — when enabled, only images associated with the currently selected variant are shown in the gallery.",[145,355,357],{"id":356},"product-information-blocks","Product information blocks",[132,359,360,361,364],{},"The product information column is built from blocks that you can add, remove, and reorder. Several blocks include a ",[136,362,363],{},"Show under product gallery"," setting — when enabled, the block moves from the product info column to a full-width area below the media gallery, which is useful for longer content like descriptions or specifications. The following blocks are available:",[226,366,368],{"id":367},"title","Title",[132,370,371,372,375,376,379,380,383,384,388],{},"Displays the product title. You can adjust the ",[136,373,374],{},"Heading size",", override the text ",[136,377,378],{},"Color",", and set the ",[136,381,382],{},"SEO tag"," (the HTML heading level used for search engines, e.g., ",[385,386,387],"code",{},"h1",").",[226,390,392],{"id":391},"vendor-sku","Vendor / SKU",[132,394,395,396,399,400,403],{},"Shows the product vendor and/or SKU. Each can be toggled independently with ",[136,397,398],{},"Show vendor"," and ",[136,401,402],{},"Show SKU",".",[226,405,407],{"id":406},"price","Price",[132,409,410,411,414],{},"Displays the product price, including compare-at prices for items on sale. Enable ",[136,412,413],{},"Show taxes notice"," to display a tax-inclusion message below the price.",[226,416,418],{"id":417},"variant-picker","Variant picker",[132,420,421],{},"Lets customers choose product options like size and color. Two base styles are available:",[234,423,424,430],{},[237,425,426,429],{},[136,427,428],{},"Block"," — pill-shaped buttons with text labels (default).",[237,431,432,435],{},[136,433,434],{},"Dropdown"," — a compact dropdown menu.",[132,437,438],{},"Two additional display modes override the base style for specific options:",[234,440,441,455],{},[237,442,443,446,447,450,451,454],{},[136,444,445],{},"Swatches"," — for options that have color swatch data in Shopify, circular color swatches are displayed instead of text. The ",[136,448,449],{},"Swatch selector style"," setting controls whether these show as swatches, a dropdown, or are disabled. See ",[452,453,47],"a",{"href":48}," for setup details.",[237,456,457,460,461,464],{},[136,458,459],{},"Variant images"," — shows the variant's associated image as a thumbnail. Enter the option names (comma-separated) in ",[136,462,463],{},"Show variant image for options"," to activate this mode.",[132,466,467,468,471,472,474],{},"The variant picker also includes a ",[136,469,470],{},"Size chart page"," setting. See ",[452,473,43],{"href":44}," for details.",[132,476,477,478,481],{},"Enable ",[136,479,480],{},"Hide sold out variants"," to hide unavailable option values from the picker.",[226,483,485],{"id":484},"stock","Stock",[132,487,488],{},"Displays stock status messages and an optional progress bar.",[234,490,491,497,503,509],{},[237,492,493,496],{},[136,494,495],{},"Show progress bar"," — displays a visual indicator of remaining stock.",[237,498,499,502],{},[136,500,501],{},"Show low stock message"," — alerts customers when stock is running low.",[237,504,505,508],{},[136,506,507],{},"Show out of stock message"," — displays a message when the product is unavailable.",[237,510,511,514],{},[136,512,513],{},"Show backorder message"," — informs customers when a product is available for backorder.",[516,517,518,519,522,523,403],"note",{},"The stock threshold for low-stock messages is configured in ",[520,521],"icon-gear",{}," ",[136,524,525],{},"Theme settings",[226,527,529],{"id":528},"buy-buttons","Buy buttons",[132,531,532,533,536],{},"Displays the ",[136,534,535],{},"Add to cart"," button and optional extras:",[234,538,539,545],{},[237,540,541,544],{},[136,542,543],{},"Show dynamic checkout buttons"," — adds accelerated checkout buttons (e.g., Shop Pay, Apple Pay) below the Add to cart button.",[237,546,547,550],{},[136,548,549],{},"Show recipient information form for gift cards"," — displays a form for entering gift card recipient details.",[132,552,553,554,399,556,559],{},"You can customize the colors of both the ",[136,555,535],{},[136,557,558],{},"Buy it now"," buttons independently.",[226,561,563],{"id":562},"description","Description",[132,565,566,567,570,571,574],{},"Displays the product description. By default, it shows as a collapsible accordion — you can turn this off with ",[136,568,569],{},"Show as collapsible content",". When collapsible, use ",[136,572,573],{},"Open by default"," to control whether it starts expanded or collapsed.",[226,576,578],{"id":577},"product-highlights","Product highlights",[132,580,581,582,585],{},"Displays a list of short highlights (e.g., \"Free shipping\", \"Handmade\", \"Eco-friendly\"). Enter your highlights as a bullet list in the ",[136,583,584],{},"Content"," field.",[234,587,588,601,615],{},[237,589,590,593,594,597,598,403],{},[136,591,592],{},"Direction"," — arrange highlights ",[136,595,596],{},"Horizontally"," or ",[136,599,600],{},"Vertically",[237,602,603,606,607,610,611,614],{},[136,604,605],{},"Style"," — display as plain ",[136,608,609],{},"Text"," or as ",[136,612,613],{},"Pill","-shaped badges.",[237,616,617,620,621,260,624,627,628,403],{},[136,618,619],{},"Text size"," — ",[136,622,623],{},"Small",[136,625,626],{},"Medium",", or ",[136,629,630],{},"Large",[226,632,634],{"id":633},"product-rating","Product rating",[132,636,637],{},"Displays a star rating for the product. This block requires a product rating app to be installed — once active, ratings appear automatically.",[226,639,35],{"id":640},"specifications",[132,642,643,644,646],{},"Displays product specifications in a table format. See ",[452,645,35],{"href":36}," for detailed setup instructions.",[226,648,27],{"id":649},"key-features",[132,651,652,653,655],{},"Highlights up to three important product attributes. See ",[452,654,27],{"href":28}," for setup instructions.",[226,657,31],{"id":658},"complementary-products",[132,660,661,662,655],{},"Displays related products that pair well with the current item. See ",[452,663,31],{"href":32},[226,665,667],{"id":666},"pickup-availability","Pickup availability",[132,669,670],{},"Shows store pickup availability for the current product. This block uses Shopify's built-in pickup availability data and has no additional settings.",[226,672,609],{"id":673},"text",[132,675,676],{},"A flexible block for adding custom text with an optional icon. Useful for trust badges, delivery information, or other short messages.",[226,678,680],{"id":679},"collapsible-content","Collapsible content",[132,682,683,684,687],{},"Adds a collapsible accordion section with a custom heading and rich text content. You can add multiple collapsible content blocks to create an FAQ-style layout, or use the ",[136,685,686],{},"Content from page"," setting to pull content from a Shopify page.",[226,689,691],{"id":690},"custom-liquid","Custom Liquid",[132,693,694],{},"Allows you to add custom Liquid code to the product page.",[226,696,698],{"id":697},"custom-spacing","Custom spacing",[132,700,701],{},"Inserts vertical spacing between blocks, with separate values for desktop and mobile.",[145,703,705],{"id":704},"sticky-add-to-cart","Sticky add to cart",[132,707,708,709,712,713,403],{},"When ",[136,710,711],{},"Enable sticky add to cart"," is turned on in the section settings, a compact bar appears at the bottom of the screen as the customer scrolls past the main add-to-cart button. This bar includes the product title, a simplified variant picker, and an Add to cart button, so customers can add the product from anywhere on the page. You can optionally show the product vendor with ",[136,714,398],{},[145,716,718],{"id":717},"related-products","Related products",[132,720,721,722,724],{},"The product page template includes a ",[136,723,718],{}," section below the main product section. This section automatically displays related products based on Shopify's product recommendation engine.",[234,726,727,733,739,745],{},[237,728,729,732],{},[136,730,731],{},"Enable carousel"," — displays products in a scrollable carousel (default) or a static grid.",[237,734,735,738],{},[136,736,737],{},"Maximum products to show"," — the number of recommended products to display (up to 20).",[237,740,741,744],{},[136,742,743],{},"Products per row"," — how many products appear per row on desktop.",[237,746,747,750,751,754],{},[136,748,749],{},"Products per row (mobile)"," — how many products appear per row on mobile. The ",[136,752,753],{},"1.5"," option shows one full product card with the next one partially visible, hinting that there are more to scroll.",[132,756,757],{},"The section heading defaults to \"You may also like\" and can be customized via the section header block.",[145,759,761],{"id":760},"colors","Colors",[132,763,764],{},"The Product section has its own color settings:",[234,766,767],{},[237,768,769,772,773,772,775,778],{},[136,770,771],{},"Background"," / ",[136,774,609],{},[136,776,777],{},"Heading"," — override the default page colors for the entire product section.",[145,780,782],{"id":781},"spacing","Spacing",[132,784,477,785,787],{},[136,786,698],{}," to control the top and bottom padding of the product section independently.",{"title":789,"searchDepth":790,"depth":790,"links":791},"",2,[792,793,801,820,821,822,823],{"id":147,"depth":790,"text":148},{"id":213,"depth":790,"text":214,"children":794},[795,797,798,799,800],{"id":228,"depth":796,"text":229},3,{"id":271,"depth":796,"text":272},{"id":298,"depth":796,"text":299},{"id":305,"depth":796,"text":306},{"id":338,"depth":796,"text":339},{"id":356,"depth":790,"text":357,"children":802},[803,804,805,806,807,808,809,810,811,812,813,814,815,816,817,818,819],{"id":367,"depth":796,"text":368},{"id":391,"depth":796,"text":392},{"id":406,"depth":796,"text":407},{"id":417,"depth":796,"text":418},{"id":484,"depth":796,"text":485},{"id":528,"depth":796,"text":529},{"id":562,"depth":796,"text":563},{"id":577,"depth":796,"text":578},{"id":633,"depth":796,"text":634},{"id":640,"depth":796,"text":35},{"id":649,"depth":796,"text":27},{"id":658,"depth":796,"text":31},{"id":666,"depth":796,"text":667},{"id":673,"depth":796,"text":609},{"id":679,"depth":796,"text":680},{"id":690,"depth":796,"text":691},{"id":697,"depth":796,"text":698},{"id":704,"depth":790,"text":705},{"id":717,"depth":790,"text":718},{"id":760,"depth":790,"text":761},{"id":781,"depth":790,"text":782},"Learn how to use and customize the product page","md",null,{},true,{"title":23,"description":824},"cH6g233xJzZaJAvkkq0sgebXD1tJ2b7IZPJKEzq-oaQ",[832,834],{"title":14,"path":15,"stem":16,"description":833,"children":-1},"Learn about the structure of sections and blocks in the Atlas theme.",{"title":27,"path":28,"stem":29,"description":835,"children":-1},"Learn how to set up and display key product features on product pages",1771425625268]