Show Customers What's Available for Pickup — Before They Reach Checkout

Five steps to go live:

1. Enter your API details. Open the SAAS Integrator CNC app in your Shopify admin and go to the Google API settings page. Enter your API key (it must have both the Distance Matrix and Geocoding APIs enabled in your Google Cloud project), optionally add an IPinfo key, set your store search radius, and click Save. If you haven't generated a key yet, see the API key question below for the full setup steps.
2. Enable the Locations Popup. In your Shopify theme editor, go to App embeds and toggle on Locations Popup (saas-int-cnc-plus). This activates the global store selector and applies your configured colours, search behaviour, store-card layout, and stock display rules across the storefront.
3. Enable the Cart Popup. In the same App embeds panel, toggle on Cart Popup (saas-int-cnc-plus). This activates the pre-checkout cart validation popup that displays per-item availability at the selected pickup store, surfaces your custom Click & Collect messages, and enforces Home Delivery blocking for Pickup In Store Only products. Keep this enabled whenever you use custom messaging triggers.
4. Add the product page block. In your Shopify theme editor, open your product page template, click Add block, and select SAAS Product Page CNC. Place it below the buy buttons. Optionally, also add the store and delivery header block to your header.
5. Configure Store Hours (recommended). Open the Store Hours page in the app admin, select each location, and enter regular weekly hours, timezone, special or holiday hours, and a Click & Collect availability schedule. Hours appear on store cards and feed pickup-day logic.

Go to Settings > Locations in your Shopify admin, click on the location, and copy the numeric ID from the end of the URL in your browser's address bar. The location must have "Pickup in store" turned on for it to appear as a Click & Collect location.

Enter your Shopify Location ID(s) in two places within the Shopify theme editor. First, in the Locations Popup block, populate the "Store Location IDs (Global Popup)" field. Second, in the SAAS Product Page CNC block, populate the "Store Location IDs" field. Both fields accept the same comma-separated format (e.g. 12345, 67890, 11111).

Yes. The Locations Popup has an "Automatically open popup on page load" toggle. When enabled, the global popup automatically opens on the customer's first page load for the session, but only if no store has been selected yet. Once a store is selected, it will not appear again. When disabled, the popup only opens when the customer clicks a button, such as the store selector on the product page or the header.

There is also a "Default to Home Delivery" toggle. When enabled, the popup opens with Home Delivery selected by default, and Click & Collect activates automatically if the customer subsequently selects a store. When disabled, Click & Collect is always the default tab.

Stocked products validate against real-time inventory at the selected pickup location. If inventory is unavailable, customers are prompted to choose another store or switch to delivery before checkout. Distance and proximity sorting use the customer's postcode (typed manually, or auto-filled from the optional IPinfo lookup) and the store's address coordinates. The Locations Popup block also has a Distance Unit setting that auto-detects from your Shopify store country (US shows miles; all other countries show kilometres) with a manual override available.

Yes. The Store Hours page in the app admin lets you configure each Shopify location with two independent settings:

• Regular store hours. Weekly opening times, per-location timezone, and special or holiday hours (e.g. public holiday closures, early closes).
• CnC availability. A separate schedule for when each location accepts Click & Collect orders.

Because the schedules are decoupled, you can offer Click & Collect on a subset of your trading days. For example, a store open 7 days a week can be configured to fulfil pickup orders Monday to Friday only.

Use the Copy hours button to duplicate a schedule across days, and Copy to locations to apply the same configuration to other stores. Hours appear on store cards in the popup and on the product page block. The Locations Popup block has an "Enable Store Hours" toggle (on by default), plus a "Special Hours Alert Window" setting (default 7 days) that surfaces upcoming holiday closures on store cards.

Yes, the Cart Popup is a separate App Embed in your theme settings, independent from the Locations Popup. You can toggle it off in Online Store > Themes > Customize > App embeds > Cart Popup (saas-int-cnc-plus). However, we recommend keeping it enabled in most cases, particularly if you use any of the custom messaging triggers on the SAAS Product Page CNC block.

The Cart Popup is where two important things happen before checkout:

1. Customer expectations are set. Your custom Click & Collect messages (e.g. "Allow 2 to 3 days for collection", "Available for in-store pickup only") appear next to each cart line at the chosen pickup store. Without the Cart Popup, the message shown on the product page may not be reinforced before the customer commits to checkout, increasing the risk of confusion or post-purchase support contacts.
2. Home Delivery is blocked for Pickup In Store Only items. If a product is flagged Pickup In Store Only via a metafield trigger, the Cart Popup is the enforcement point that hides the Home Delivery option and prevents an incompatible checkout. Disabling the Cart Popup when Pickup In Store Only triggers are in use will allow customers to attempt home delivery on items that are not deliverable.

Disabling is reasonable only when you operate plain in-stock-only Click & Collect with no custom messaging triggers and no Pickup In Store Only restrictions, when you run a headless or heavily custom storefront with equivalent validation built elsewhere, or for phased rollouts and A/B testing. If you use custom messaging or Pickup In Store Only at all, leave the Cart Popup turned on.

Yes. The SAAS Product Page CNC block supports two display modes, controlled by the PDP Store Lookup Mode setting:

• Embedded (recommended). Store search and results display inline on the product page itself, with no modal. Customers can enter a postcode, see nearby stores with distance, opening hours, and per-item Click & Collect availability, and select a pickup store without leaving the product page or opening a popup. Inline labels are configurable (block heading, empty-state prompt, "You're collecting from" label, "Change store" link, and so on).
• Popup (legacy). When the customer clicks the store link on the product page, the global Locations Popup opens to handle store search and selection. This was the original behaviour and remains the current default for the setting, so existing storefronts are unaffected after app updates.

We recommend Embedded mode for new installs and for any merchant wanting a faster, single-page product flow. Popup mode is retained for stores that have built their customer experience around the modal, or have theme-level reasons (such as layout constraints or custom CSS) to keep the legacy behaviour. You can switch between modes at any time in the theme editor without losing any other block configuration.

Yes. The SAAS Product Page CNC block supports up to three independent triggers built on a single product metafield key. Each trigger has its own value to match, custom storefront message, stock-validation mode, and Pickup In Store Only setting. This means one metafield (e.g. custom.stock_override) can drive multiple distinct customer experiences without duplicating products.

Common configurations include:

• Inter-store transfer. "Allow 2 to 3 days for collection" message, shown only at locations with no stock; stocked locations show standard availability.
• Pickup-only product. "Available for in-store pickup only" message, shown at every store, with Home Delivery blocked.
• Made-to-order or pre-order. "Allow 2 to 3 weeks before pickup" or "Pre-order, ships from 15 June", with stock checks bypassed at all locations.

To ensure Shopify can process orders for products without available inventory, configure the product's inventory in Shopify admin. The two common options are: enable "Continue selling when out of stock" on the variant, or uncheck "Track quantity" entirely on the variant (suits products where stock levels are not relevant, such as custom-built or made-to-order goods).

The Ignore Stock Levels control on each trigger is a three-option select, not an on/off toggle:

If you set Ignore Stock Levels to "All locations", make sure the product's inventory is associated with all your Shopify Click & Collect locations. Otherwise, Shopify may block the order at locations where the product is not stocked.

Yes. Enable the Pickup In Store Only toggle within the Click & Collect Custom Messaging settings. Products matching the configured metafield value will only be available for in-store pickup; Home Delivery is automatically blocked.

Note: Pickup In Store Only is automatically disabled when Ignore Stock Levels is set to "Only locations with no stock". That mode is designed for products that are deliverable from in-stock locations and pickup-on-request from out-of-stock ones, so the two settings are mutually exclusive by design.

If any item in the cart is marked Pickup In Store Only, Home Delivery is blocked for the entire cart. Click & Collect becomes the only available fulfillment method. Customers see a clear message explaining why.

Yes. The app is designed to work on both Shopify Plus and non-Plus stores. No Plus-only features or checkout customisation required.

No. The app displays supported Click & Collect messaging within Shopify's checkout experience. It does not replace or customise checkout.

Yes. SAAS Integrator Click & Collect uses native Shopify locations and product metafields, so it works seamlessly with Shopify Flows, Shopify order routing, and any other native Shopify functionality that reads location or metafield data.

Yes. Because the app uses native Shopify product metafields, you can reference them in any Shopify notification template using standard Liquid. The same metafield that drives the storefront Click & Collect message can drive matching messaging in the order confirmation, shipping, and ready-for-pickup emails, keeping the customer's storefront experience and post-purchase communication aligned.

Example. A merchant using metafield key custom.stock_override with two triggers:

To carry that messaging through to the order confirmation email, go to Settings > Notifications > Order confirmation > Edit code in Shopify admin and add:

{% for line in line_items %}
  {% assign cnc_flag = line.product.metafields.custom.stock_override %}
  {% case cnc_flag %}
    {% when 'stock_override' %}
      <p><strong>{{ line.title }}</strong>:
        Allow 2 to 3 days for collection at your selected pickup store.</p>
    {% when 'Pickup_Only' %}
      <p><strong>{{ line.title }}</strong>:
        Available for in-store pickup only.</p>
  {% endcase %}
{% endfor %}

The same pattern works for shipping confirmation, ready-for-pickup, and Shopify Flow email actions that read product metafields. Cases can be added or changed without redeploying the app or the storefront block.

Yes. SAAS Integrator Click & Collect uses native Shopify locations, the same locations your POS is already connected to. There are no workarounds, no duplicate location setups, and no sync issues. Your online Click & Collect orders route to the same locations your POS uses in-store.

A Google Geocoding API key is required. It powers postcode-based store search, proximity sorting, and distance calculations. You enter it in the app's Google API settings page within your Shopify admin, along with your store search radius.

Google Cloud setup: Before generating the key, make sure your Google Cloud project has the two required APIs enabled:

1. Go to the Google Cloud Console: https://console.cloud.google.com/apis/
2. Enable both of the following APIs in your project:
   • Distance Matrix API
   • Geocoding API
3. Create an API key (Credentials > Create Credentials > API key) and paste it into the app's Google API settings page.

A single API key works for both services. We recommend restricting the key to your storefront domain in the Google Cloud Console to prevent unauthorised use.

An IPinfo API key is optional. When provided, it auto-detects the visitor's postcode from their IP address and pre-fills the search input so customers do not have to type their postcode. Without it, the search input simply opens empty and the customer enters their postcode manually; all other Click & Collect features work normally.

The optional store and delivery header block uses the same Google Geocoding key but is not required for core Click & Collect functionality.

Yes. All plans include the full feature set. Plans differ only by the number of Shopify locations and total Shopify order volume per month.

All Shopify orders created during the month count toward your plan's limit, regardless of fulfillment method.

You will be prompted to upgrade. There are no automatic overage charges.

Visit our Omnichannel Customer Experiences page to see real-world examples of how retailers have implemented Click & Collect across different store types, product categories, and customer journeys.