Skip to content
Use cases › Using ServiceNow CPQ › ServiceNow CPQ Configurator › Configure › price › quote apps › Use › Sales Customer Relationship Management
Release: Australia · Updated: 2026-03-12 · Official documentation · View source

Use case: Embed ServiceNow CPQ UI in a Lightning Web Component

Learn how to embed ServiceNow CPQ in a LWC in a Salesforce org.

You can embed ServiceNow CPQ in a Lightning Web Component (LWC) in a Salesforce org. This eliminates the need to directly navigate to ServiceNow CPQ through a particular product or the ServiceNow CPQ custom URL.

Steps for Embedding

  1. Download the base LWC package here, and unzip.
  2. Within an integrated development environment (IDE—in this example, VSCode), or on the command line:
    1. Connect to your Salesforce org using the Salesforce CLI or Salesforce Extensions for the IDE.
Image omitted: cpq-embed-logik-lightning-code.png
Lightening code
2.  Open the folder and publish to org using Salesforce CLI or the extensions in your IDE. In VSCode, this means right- clicking the folder in the VSCode explorer and clicking Deploy Source to Org.

    **Note:** To complete this step, you must be connected to the org.
Image omitted: cpq-embed-logik-lightning-code-deploy.png
Menu
  1. Go into the Salesforce page where you want to embed ServiceNow CPQ.
  2. On the Setup menu, click Edit Page.
Image omitted: cpq-embed-logik-lightning-edit-page.png
User interface
  1. Drag the ServiceNow CPQ LWC from the menu at the bottom left into the page layout where you want to embed ServiceNow CPQ.
Image omitted: cpq-embed-logik-lightning-drag.png
Menu bar
  1. Add the configuration URL.
Image omitted: cpq-embed-logik-lightning-config-url.png
Config url
If you are passing the configuration URL as a parameter, include a Runtime Token in the URL \(for example,`?rt=xxxxxxxxxxxx`\)

Parent Topic:Use cases