Step-by-step walkthrough to add Blueprint to Shopify POS from the Shopify admin, customize its placement, and confirm it’s successfully added.

<h2 data-pm-slice="1 1 []" id="isPasted">What you&#x2019;ll do</h2>Use this walkthrough to enable Blueprint in Shopify POS from your Shopify admin.You&#x2019;ll complete this in Shopify under Point of Sale.<h2 id="step-by-step-enable-blueprint-in-shopify-pos">Step-by-step: enable Blueprint in Shopify POS</h2>1. Open the POS app -&#xA0;From your Shopify admin, open Point of Sale.2. Open Settings -&#xA0;In the Point of Sale channel, click Settings.3. Open POS App in the customisation section -&#xA0;On the Settings page, find the customization section and click POS app.4. Open the Apps menu -&#xA0;On the next screen, click the Apps icon in the top-left corner.5. Turn on Blueprint -&#xA0;Find the Customise toggle for Blueprint, switch it on, then save your changes.<hr>NOTEIf the screen labels in Shopify look slightly different, follow the same path: Point of Sale &#x2192; Settings &#x2192; POS app, then open the Apps menu and turn Blueprint on.<hr><h2 id="how-to-verify-it-worked">How to verify it worked</h2><ul><li>Return to the POS app area and confirm the Customise toggle for Blueprint is turned on.</li><li>Open Shopify POS on your device and check that Blueprint is available.</li></ul><hr>TIPIf Blueprint does not appear right away, save your changes again and give Shopify POS a moment to refresh across devices.

Enable Blueprint in Shopify POS

Add Blueprint to your Shopify theme by inserting the Blueprint app block in the Shopify Theme Editor, then configure its settings and placement.

This walkthrough shows how to add Blueprint to your Shopify theme by inserting the app&#x2019;s theme blocks in the Theme editor, then adjusting the settings in the right-hand panel.<hr>INFOIn the Theme editor, Blueprint appears under Apps as theme blocks (for example, Product Configurator and Hide Add to Cart).<hr><h2 id="open-the-theme-editor">Open the theme editor</h2>1. Go to theme -&#xA0;In Shopify admin, open Online Store &#x2192; Themes.<img data-fr-image-pasted="true" src="https://cdn.heymantle.com/orgs/c60dabf2-e049-400a-a45b-5abda837631d/docs-pages/video-frames/bf51cb0b-fbda-4e47-8e40-d460b87dcd12/frame_001.jpg" alt="Shopify admin Themes page with the current theme and the Edit theme button" class="fr-fic fr-dii">On your current theme (for example, Dawn), click Edit theme.2. Use the page selector to navigate -&#xA0;In the Theme editor, use the page selector at the top (for example, Home page) to jump to the template you want to update.<img data-fr-image-pasted="true" src="https://cdn.heymantle.com/orgs/c60dabf2-e049-400a-a45b-5abda837631d/docs-pages/video-frames/a775d005-8e09-4534-ba1d-f07de98cda7f/frame_002.jpg" alt="Theme editor with the page selector dropdown open" class="fr-fic fr-dii">For Blueprint on product pages, switch to a product template (for example, Products &#x2192; Default product).<h2 id="add-the-blueprint-block-to-a-product-page">Add the Blueprint block to a product page</h2>1. Open a product template -&#xA0;In the Theme editor, navigate to the product template where you want Blueprint to appear (for example, Default product).<img data-fr-image-pasted="true" src="https://cdn.heymantle.com/orgs/c60dabf2-e049-400a-a45b-5abda837631d/docs-pages/video-frames/699457a7-aacf-47af-a39e-39e602169620/frame_003.jpg" alt="Default product template in the Theme editor with Add section option" class="fr-fic fr-dii">2. Insert the Blueprint app block -&#xA0;In the left sidebar, find the area where you want the Blueprint UI to appear (commonly within Product information).<ol><li>Click Add block.</li><li>Under Apps, choose the Blueprint block you need (for example, Product Configurator).</li></ol>Once added, the block appears in the sidebar list (for example, Product Configurator).3. Customise the Blueprint block settings -&#xA0;Click the Blueprint block in the left sidebar (for example, Product Configurator) to open its settings in the right-hand panel.<img data-fr-image-pasted="true" src="https://cdn.heymantle.com/orgs/c60dabf2-e049-400a-a45b-5abda837631d/docs-pages/video-frames/fefb1897-efb9-41ca-929b-2c62c87f954b/frame_004.jpg" alt="Blueprint Product Configurator block selected with customization settings visible in the right sidebar" class="fr-fic fr-dii">Use the available options to match your theme styling (for example, Display Options, Layout, and Colors such as background and text color).<hr>TIPAfter changing settings, use the preview in the center to confirm placement and styling around key elements like the Add to cart button.<hr><h2 id="optional-add-blueprint-to-another-template-eg-home-page">(Optional) Add Blueprint to another template (e.g., home page)</h2>1. Switch to the template you want to update -&#xA0;Use the page selector to switch to another template (for example, Home page).2. Add the Blueprint section or block -&#xA0;In the left sidebar, click Add section or Add block (depending on where you want Blueprint to appear).<img data-fr-image-pasted="true" src="https://cdn.heymantle.com/orgs/c60dabf2-e049-400a-a45b-5abda837631d/docs-pages/video-frames/7f90b8b0-b717-4ce5-9afb-80b975841a23/frame_005.jpg" alt="Theme editor home page view with Add section and the section selection popup" class="fr-fic fr-dii">Under Apps, select the Blueprint option you want (for example, Hide Add to Cart).3. Review settings for the selected section -&#xA0;Select the newly-added Blueprint item in the left sidebar to view its settings in the right-hand panel.<img data-fr-image-pasted="true" src="https://cdn.heymantle.com/orgs/c60dabf2-e049-400a-a45b-5abda837631d/docs-pages/video-frames/be57bedf-1bfd-497f-9742-53afda004f02/frame_006.jpg" alt="Blueprint Hide Add to Cart selected with settings shown in the right sidebar" class="fr-fic fr-dii">If the panel shows No customizable settings available, the block works automatically once added. Use Manage app if you need to adjust app-level configuration.<h2 id="save-and-verify-on-your-storefront">Save and verify on your storefront</h2><ul><li>Click Save in the top-right of the Theme editor after changes.</li><li>Preview the storefront to confirm the Blueprint experience appears on the intended pages and templates.</li></ul><hr>WARNINGIf you&#x2019;re editing a theme that isn&#x2019;t published, your changes won&#x2019;t be visible on the live storefront until that theme is published.

Getting Started

Enable Blueprint in Shopify POS

Add Blueprint to theme