> ## Knowledge Base Index > Fetch the complete knowledge base index at: https://doc.ecomx.co/sitemap.xml > Use this file to discover available pages before exploring further. > Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash). # Blum Product Template ## About Blum Product Template The Blum Product Template is a powerful template for creating engaging and conversion-optimized product pages on your store. It enables you to showcase your products with rich media, detailed information, and customizable components that help drive sales. [![](https://saleshunterthemes-3030d0343deb.intercom-attachments-1.com/i/o/h9w3pjg7/1902817869/d7eb7eb846351a389e0564872caa/AD_4nXcDE6o59roUw98F_WpK8eABr16OwHhJsTj1eqQBEwUyDxWvIZ91XXimwgs2ROzhBAo_WdLKRjDzipNNRv6jIL5WP01LFo888YSza6Mez14rhnYpLKHDS0eW9TUjLDlWbEMkeyW9IVumpaVvzVe30kfdhXM_4n.png?expires=1792401300&signature=f8107703408ec61cc06fa89afa2fd006104f92ac5d10b95453904644dbdd8e88&req=dSknFMF%2FmolZUPMW1HO4zcCH1guJOQwAqo5SRRV%2F9bsPF0Ty374gYs5o4EaJ%0Ai%2BqyvqK2KqnfuPrtqDY%3D%0A)](https://storage.crisp.chat/users/helpdesk/website/-/6/8/f/6/68f63d71e19e5400/c192c178-5361-41d2-8240-6a94db_1ou5g01.png) ## How to Access Product Template On the top center bar, click the dropdown button > **Products** > Choose **Default products**. [![](https://saleshunterthemes-3030d0343deb.intercom-attachments-1.com/i/o/h9w3pjg7/1902817900/6d84e718a2f9438cdc3792dfb0f0/AD_4nXdBX1zJ2A2uMUqryv5U0dInJqgUg6VerNcyYurco9nB54KX5hBHPXVxcN1hKwkXNXyAGf8lr_CLx8KnpmqVNSAroy-kyuTcvf_qHweqBRVCsHPmR3YKjS01cxhpf_22odIkeyW9IVumpaVvzVe30kfdhXM_4n.png?expires=1792401300&signature=e6910f628b8e3885e7dc27bae46f7b948e34b18287d0a1dc11d9a9d3b775426d&req=dSknFMF%2FmohfWfMW1HO4zSBMSojH0s2wkSSZ5YCvs%2BWTrzjzYoDXXAY4sW1%2B%0APF8xoRNLQkRE7wzY2To%3D%0A)](https://storage.crisp.chat/users/helpdesk/website/-/2/7/1/1/2711ef127e336000/9e053510-c38b-4570-94d2-1f0ee7_wn21za.png) This template includes two default core sections that cannot be removed (can only be hidden): * Product Details section * Product Recommendation section Beyond these core sections, you have complete flexibility to add or remove other sections to create your ideal product page layout. Let us detail the settings of these sections. [![](https://saleshunterthemes-3030d0343deb.intercom-attachments-1.com/i/o/h9w3pjg7/1902817921/1287f4eb1130e550085470dd3c7d/AD_4nXf9WUm0Jj8uDrqHgRV7BzjNHcmRHzZNsUzwGGLv77z62s-ZCBhtUIs68o-NuCteIEAVq3fQ-pQYzQlZhAIrF4k4xzDS2dDmTAre-bJRMv_-gdp16s8tNuOuSEYfnQJt9aYkeyW9IVumpaVvzVe30kfdhXM_4n.png?expires=1792401300&signature=91b6dd2d58a32aff5ecb85a21249ca9f4eb781d9059cb255c4734109d0de3820&req=dSknFMF%2FmohdWPMW1HO4za%2Fv7aqb7vP%2F6gZ5WOQsgQ%2BRMONJcu8zynqrCm9P%0ApyccIqKj%2Fh%2FAM918nVY%3D%0A)](https://storage.crisp.chat/users/helpdesk/website/-/e/d/7/2/ed722841526cc00/d6665cd7-38a2-435c-9679-a0a258_1964bmz.png) ## General You can customize the color scheme for this section by selecting from available schemes. To modify the theme colors, navigate to **Theme settings > Colors**. ## Layout The section offers key layout options: * Enable/disable sticky content when scrolling: This feature is enabled by default and serves to create a sticky effect for shorter content placed between product media and product information. When activated, it keeps the relevant content visible as users scroll. If this feature is disabled, the section will revert to standard scrolling behavior without the sticky effect. * Remove padding top * Remove padding bottom ## Media The Product Details section provides extensive control over your product media presentation to maximize conversion rate optimization: * Select the media ratio style * Choose thumbnail ratio * Enable zoom function or not * Select the layout on large screen: for Single with thumbnails (default – Left, right, below) or Gallery grid (Collage, 1 column, 2 columns) * **Width on Large Screen**: Choose **Wide** to use more screen real estate or **Compact** to keep content centered. * **Mobile Media Display**: Toggle **Show paginations as number** or **Show media thumbnails** to make mobile navigation easier. ## Advanced Description In Advanced Description, you can show more content about your product using Static Page or Product Metafield in Content Source. * Static Page: Render all content from a fixed page to display on all products. To use this option, select Static Page in Content Source, then click on Select page. * Product Metafield: Merchant must configure the metafield of type “**Reference**” (which refers to a page for each product). Blum gets the metafield by name and renders the referred page content for each product. To use this option, select Product Metafield in Content Source, then enter Metafield Name. ## Sticky Purchasing Bar The sticky purchasing bar activates when scrolling down and appears after the Add to Cart button, disappearing after the product details end. Key features include: * Show Price & Variants: You can now toggle these on to show the current price and selected options directly in the bar. * Toggle product information display for mobile * Choose button type: * Add to Cart Button * Dynamic Checkout Button * Position options (for screens wider than 459px): * * Bottom right/ Bottom left Note: On devices smaller than 459px, the sticky bar displays full-width at the bottom center. ## Basic Components The Product Details section includes essential blocks to display comprehensive product information. These blocks are identical to those in the featured product section. You can find detailed setup instructions [here](https://docs.saleshunterthemes.com/manual/blum-featured-product/%23featured-product-block-configuration): * Title * Vendor * Price * Rating * Variant selector * Size guide * Purchasing * Pickup availability * Frequently bought together * Extra information * Basic description * Custom liquid * SKU * Popup * Custom text * Share [![](https://saleshunterthemes-3030d0343deb.intercom-attachments-1.com/i/o/h9w3pjg7/1902817944/93947051edcf368672fd0b77c6b5/AD_4nXcRINeXLJqKLzo5Koyw8wcILgz2tc-VjeZbFolmEt-mHJVabrt97vCoxeawjhjEabkewUaTbNUS5tt8XiZmbHBPIN6JofF8eS7joZAvpHTYDzTIYbxlXvZ_kyh40pOfhQkeyW9IVumpaVvzVe30kfdhXM_4n.png?expires=1792401300&signature=f6237af6a38cca2ceeeeff19c4ec6b322d684fa9f8b0006c7f00a2ab24d83540&req=dSknFMF%2FmohbXfMW1HO4zYMqSwcCCJbZ6k4tX%2FG1S9722zrOU0EMbRCNI546%0AqD0dsD15Hbz%2FMJPnt%2F8%3D%0A)](https://storage.crisp.chat/users/helpdesk/website/-/4/1/6/9/416900698ce73c00/646669fd-d6f8-488f-b1b0-6c61f8_m0ixsu.png) Important notes: * Most blocks can only be used once, except for Popup content, Custom liquid, and Custom text * Blocks can be freely added or removed as needed * Click on any block to access its specific settings ## Configure Product Recommendation Section The Product Recommendation section intelligently displays related products based on product data and order history. [![](https://saleshunterthemes-3030d0343deb.intercom-attachments-1.com/i/o/h9w3pjg7/1902817975/468e2bb6ebd5442dad6756900536/AD_4nXdvip645Na3nAR8cxDV6XL452Pk_QpcOqZSbFJFq54aeboz_DGevxEcuOlBFquZJsDtkchxZRsQA_rWqCoQkCcOha_WtWO7rbl6dmg5lU3LfcWCAE_yCWd9R0OdZZcRWQkeyW9IVumpaVvzVe30kfdhXM_4n.png?expires=1792401300&signature=4df9e7882652b3fe8d6d9d6e27211bf55db3f7e6b0a1e7fc876f6de4b5b18834&req=dSknFMF%2FmohYXPMW1HO4zSa6JQZ3LhvArLMR4LwOpbZYNkn%2FIxiNoBjaZdEp%0AlL8lRZyo8CNf19Qv4JI%3D%0A)](https://storage.crisp.chat/users/helpdesk/website/-/9/2/4/1/924109065e81e800/28a64c7d-4af2-4a6d-80cb-9a53c1_1dxjdtq.png) ### General * Customize the color scheme * Edit or customize the section heading with dynamic sources ### Layout Default configuration: * Shows 4 items (minimum 2, maximum 12) * Mobile-specific settings: * 1-2 items per row option * Optional carousel display * Optional mobile navigation arrows * Padding options: * Remove padding top * Remove padding bottom --- ## Common Cases and FAQs **1. How can I remove the Product Details and Product Recommendation sections?** These sections are core components of the Product template and cannot be removed. However, you can hide them if needed while keeping other sections visible. **2. How do I customize the layout of product variants?** Access the variant selector block settings to customize the layout and display of your product variants. You can control how variants appear and function on both desktop and mobile views. **3. Why isn't my custom content showing in the Advanced Description?** If using Product Metafield as your content source, ensure you have: * Configured the metafield type as "**Reference**" * Correctly entered the Metafield Name * Created and linked the referenced page content **4. How can I optimize my product media for mobile viewing?** For the best mobile experience: * Enable "**Show Paginations As Number On Mobile**" for easy navigation * Use the mobile-specific image option when your desktop image doesn't translate well to smaller screens * Consider enabling the carousel feature for smoother browsing * Test your media display across different mobile devices **5. Why isn't my sticky purchasing bar showing up?** Check these common solutions: * Verify that "**Enable sticky content when scrolling**" is turned on * Ensure you're viewing the page below the Add to Cart button * For mobile devices, confirm that product information display is enabled * Check if your screen width matches the position settings (>459px for custom positioning)