Integrating CPQ with Shopify

Release version: Australia

Updated March 12, 2026

7 minutes to read

Summarize

Summarized using AI

Summary of Integrating CPQ with Shopify

The CPQ app for Shopify enables ServiceNow customers to integrate advanced Configure, Price, Quote (CPQ) capabilities directly into their Shopify stores. This integration allows seamless management and sale of configurable products, supporting both B2C and B2B sales with complex product configurations. The app provides a fully featured connector that syncs the entire Shopify product catalog into the CPQ environment and includes an app block to embed a product configurator on any storefront page without custom coding.

Show full answer Show less

Key Features

Automated Product Catalog Sync: Shopify products are synced to CPQ every 15 minutes via a one-way sync, ensuring CPQ has up-to-date product data mapped by Shopify Global IDs.
Configurable Product Support: Products in Shopify marked with the ServiceNow CPQ Configurable attribute become available for configuration within CPQ and appear in the configurable products list.
Configurable Product Configurator App Block: Easily add a CPQ configurator to product or content pages on the storefront through an app block with customizable appearance settings, enabling customers to configure and add products directly to cart or create draft orders.
Shopify B2B Pricing Integration: For logged-in B2B users associated with a company location, CPQ defers pricing to Shopify catalog prices, overriding CPQ price rules to ensure consistent B2B pricing.
Order Management: Admin users can create and edit draft orders with CPQ-configured products directly within Shopify, using the configurator to customize product configurations before completing orders.
Headless Commerce Support: The app supports headless Shopify implementations by providing product sync, draft order creation, and configuration management without requiring the app block UI, facilitating custom storefronts.
Admin Configuration: Setup requires entering CPQ environment details and tokens, with additional settings accessible for managing product configurability, app block appearance, and checkout behavior (direct cart addition or draft order creation).

Practical Application for ServiceNow Customers

By integrating CPQ with Shopify using this app, customers can:

Streamline the management and sale of configurable products within their Shopify storefronts using ServiceNow CPQ features.
Ensure product data is consistently synchronized and configured without manual updates between Shopify and CPQ.
Provide customers with an out-of-the-box product configurator on product or custom pages, enhancing user experience with no coding required.
Leverage Shopify’s native B2B pricing capabilities alongside CPQ configuration to maintain accurate pricing for business customers.
Enable Shopify admins to create and modify draft orders featuring configurable products, improving order flexibility and accuracy.
Support headless commerce architectures with flexible integration points, reducing middleware complexity.

Setup and Management

After installing the CPQ app from the Shopify app store, customers must configure CPQ environment settings and tokens to enable catalog synchronization and configurator functionality. The app block can be automatically added to product pages or manually added to custom pages. Admins manage configurable products and draft orders through dedicated pages in Shopify Admin, facilitating efficient configuration and order processing workflows. If necessary, app settings can be cleared via Shopify’s metafields and metaobjects management.

The CPQ app for Shopify enables stores to seamlessly manage and sell configurable products using CPQ advanced CPQ (Configure, Price, Quote) features. Installation and setup are streamlined, and robust Admin options are provided for both technical and non-technical users.

The CPQ app for Shopify is a fully featured connector for a Shopify store. The app ensures the entire product catalog is available in CPQ for use with a CPQ blueprint. The app also includes an app block to add a configurator to any page on a storefront without the need to create a dedicated UI. The configurator app block is fully functional out of the box which means customers can start adding configurable products to their cart as soon as the storefront changes are published.

The CPQ app brings your entire Shopify product catalog into CPQ, allowing complex configurations for B2C and B2B sales.
Features an app block to easily add a product configurator to any storefront page—no custom code required.
Provides live catalog sync from Shopify to CPQ every fifteen minutes (one-way sync).
Enables Shopify B2B Pricing by deferring to Shopify catalog prices for B2B users.

The CPQ app for Shopify is free to download on the Shopify app store:

Product Configuration

Setup

After downloading the CPQ app it will automatically appear in the Apps section of the store.

To start using the app, the CPQ environment details and a token must be entered in the CPQ settings section of the app landing screen. For more information about creating a CPQ token, see Set up a runtime client.

Note:

Ensure the storefront and the Admin URLs are added as an origin for the token. All stores should also include the following static URL to their list of origins: https://shpfy-connect.ecommerce..

CPQ app Admin screen overview

Admin screen overview

ServiceNow CPQ Settings: CPQ environment settings which is required in order for the configurator to display
Instructions: This block summarizes at a high level what is needed for a configurable product. The ‘Add to Current Themeʼ button will also automatically place the app block on the product page template.
Configurable Products: Redirects to a page for ServiceNow CPQ enabled products in the store catalog
Order Configuration: Redirects to a CPQ specific create order page so that an Admin can add a CPQ configurable product to an order

Managing products

When the app is installed and the ServiceNow CPQ settings have been successfully saved, an automated catalog sync will begin and the custom CPQ attribute is added to the product details Admin page.

Product catalog synchronization

Products are synced down from Shopify to CPQ every fifteen minutes. All products in the store catalog will be synced to CPQ. Changes will be synced the next time the job runs.

Products from Shopify will appear on the Products and Configurable Products table. The Shopify GID is automatically mapped to the Product ID field on the table.

Product catalog

Note:

The product syncs are one way. Changes to the product table will not be reflected in the Shopify catalog.

Configurable products

In order for a product to appear on the Configurable Products table as well the configurator to display, a product must have ServiceNow CPQ is Configurable attribute set to True.

Using Shopify B2B pricing

In order to use Shopify B2B Pricing, all products associated to a CPQ Blueprint must be present in a catalog. The catalog must also have at lease one company location associated to it alongside a user who belongs to that company.

When a user is logged in from an included company location, CPQ pricing will default to the Shopify catalog price. This will overwrite any CPQ price rules for these products. It is recommended that B2B specific blueprints are created to avoid any confusion around pricing in this scenario.

Adding a configurator to a page

The CPQ Configurator can be added to any page via an included app block through the page editor. The app block is automatically added to your store when the app is installed. You can find the block under apps when adding a new page section.

The look and feel of the ServiceNow CPQ configurator is managed in CPQ Admin through use of the layout editor. However, there are additional options in the CPQ app block. If you encounter issues where the Font is too small or large, that can be modified in the app block settings along with spacing.

Product Pages

For product pages, the CPQ app landing page has a shortcut to directly add the app block to the product page template.

The default behavior on a product page is to use the current product as the configurable product. If the product is ServiceNow CPQ configurable, the configurator will display. If not, the app block will remain hidden.

However, it is better to create a specific template for a ServiceNow CPQ enabled product page, since modifications to the page content besides the app block could be needed.

App block instructions for a product page

Content pages

When adding a ServiceNow CPQ configurator to a non-product page, a specific product must be selected for use.

By default, a select option will be displayed. When clicked, a list of all products will be shown. Either click a product or enter a search term. Once selected, the product will be displayed in the app block settings.

To change the product used, click the current product then click ‘Replaceʼ to reopen the product list. Replace product

Add to Cart vs Add to Order

The ServiceNow CPQ configurator app block provides two options for how it will function. Either the app will add the configuration to the customerʼs cart directly, or a draft order of the configuration can be created for the customer. To control the behavior of the configurator on the page, the option ‘Checkout As Draft Orderʼ can be enabled or disabled.

When enabled, a customer will need to be logged in. If the customer is currently logged out, the configurator will not be shown and instead a message to inform the customer to login is displayed. Once logged in, the customer can complete the configuration as usual. After completing the configuration, the configurator will close and display a success message. This configuration will then show as a draft order in the Shopify orders screen in the Admin. The customerʼs email used to login will be included in the order.

Check out screen

If the setting is disabled, once the configuration is completed. All items included in the configuration are added directly to the customerʼs cart and the customer is redirected to the cart page.

Managing configurable products in Shopify Admin

Configurable Products List:

On the CPQ app landing page, once the CPQ credentials have been saved, a configurable product section is shown.

Clicking into the page will display a list of all products that are ServiceNow CPQ configurable and any variants.

On the Configurable Products page, each product has two buttons. The details button redirects the Shopify user to that productʼs details page in the Shopify Admin so they can edit any product details.

The order button will redirect the Shopify user to the Create Draft Order page and open the configurator for the selected product.

Creating a draft order

On the Create Draft Order page, a Shopify user can select a CPQ configurable product to launch itʼs configurator. Once a product is selected and the submit button is clicked, the associated blueprint is displayed.

Once the configurator has been loaded, the Shopify user can complete a configuration just like a customer. Once complete, all items in the configuration are added to a new draft order and the user is redirect to that orderʼs page.

From the order page, the user can complete the order like any other Shopify order.

Editing a Configurable Product in a draft order

On the draft order page, a Shopify user can edit a CPQ configurable product that is included in the order. The user will select the product from the dropdown then click the ‘Reconfigureʼ button, which will redirect to the create draft order page.

The existing configuration will automatically load on the page and the user will then have the ability to make any changes before saving. Once saved, the user will be redirected to the order.

Using the app with headless implementations

The CPQ Shopify app is not required for users who wish to integrate CPQ with their Shopify storefront. However, the app is designed with headless implementations in mind.

Here are some considerations when using the app for your headless implementation:

The app will streamline the setup with CPQ and reduce the overall need for custom middleware by providing a product sync between platforms, a custom CPQ Configurable product attribute and Draft Order functionality.

A Custom UI can be used in place of the CPQ app block which is completely optional.

Saving a configuration, even heedlessly, will trigger the CPQ add to cart function which facilitates dynamic pricing and attributes Automated add to cart on save can be disabled through a DevOps request.

Clearing app settings

In any case where you need to clear the app settings, they can be manually deleted in your Shopify store settings: Go to the Metafields and metaobjects page and select ServiceNow CPQconfig.

Click the ‘More Actionsʼ drop down menu and click ‘Delete metaobjectʼ.