MS Power Pages
Smart CPQ for Power Pages
The Smart CPQ for Dynamics Managed Solution can successfully be integrated with MS Power Pages (formerly MS Portals) to create eCommerce portals for customers and partners.
This allows different persona to interact with quotes built within Smart CPQ, via a different sales channel.
In that configuration:
- Customers and / or partners can review and amend quotes Sales Reps may have created in the CRM.
- Sales Reps can review, complete and approve, in the CRM, quotes created by customers and / or partners in MS Power Pages.
This page describes the solution Conga provides to address these scenarios and explains how you can install and configure it.
OVERVIEW
Smart CPQ for Power Pages is a solution created to integrate Performance Quoting within MS Power Pages.
The solution comes as an extension of the Smart CPQ for Dynamics solution, that must be deployed first in the D365 environment associated with the portal.
The main flows addressed by the solution are:
- Interact with Performance Quoting from the portal to create and negotiate quotes
- Synchronize data from Performance Quoting to the MS Dataverse tables (Quote, Quote Products, Opportunities) so that the data is accessible from both the CRM and the Power Pages.
The Smart CPQ for Power Pages solution is meant to integrate Performance Quoting in the quote management section of your portal. It thus provides a template to integrate Smart CPQ in any portal you may build leveraging quotes in MS Power Pages.
In details, what delivers includes:
- A managed solution: the Smart CPQ for Power Pages managed solution, to be imported in your
D365 environment.
- A template of portal: a zip file containing an example of portal implementation integrated with CPQ.
The Microsoft Power Platform does not allow yet to embed MS Power Pages samples in a unique managed solution. That is the main reason for the Smart CPQ solution to be delivered in two different pieces.
ARCHITECTURE
The Smart CPQ for Power Pages solution contains two types of components :
- Quote entity forms used in the template of portal, delivered separately from the managed solution (zip file).
- Instant Cloud Flows executed by Power Automate for invoking the unbound actions that are part of the Smart CPQ for Dynamics solution.
There are two Cloud Flows, each one dedicated to a CPQ process :
- OpenQuoteAndGetUiLink: Triggers a workflow action that performs the initialization of a CPQ session and returns the URL to display the UI.
- SynchronizationOperation: Triggers the CPQ-to-Dataverse data synchronization.
INSTALL THE MANAGED SOLUTION
Pre-requisites
Before installing the Smart CPQ for Power Pages solution, please check the following points:
- Check that you have access to make.powerapps.com with sufficient privileges to install and upgrade solutions
- Deactivate your popup blocker or add your CRM server to your popup blocker white list.
- Verify that Smart CPQ for Dynamics 365 solution has already been installed.
- Download the latest Smart CPQ for Power Pages Managed Solution from the SFTP Server.
Import the managed solution
- First step consists in logging in the make.powerapps.com portal with your System Administrator credentials:
- Make sure that you are in the right environment in the top menu bar.
- Verify that the Smart CPQ for Dynamics solution is already installed in a compatible version.
- Then access the Solutions section from the left panel and click on Import in the action bar:
- Browse to find your solution for Power Pages and click Next in the right panel:
- Review the solution details.
- Click on Advanced Settings at the bottom to choose the scenario you are in (Update, Upgrade...). Click on Learn More to review the various options.
- When ready, click on Next. You will be prompted to select an existing Connection Reference or to create a new one.
A Connection Reference associates an authenticated user to the cloud flows requiring a Dataverse connection, and uses it for its execution.
To integrate with Smart CPQ, we recommend to associate an application user to all Cloud flows. It is not possible to specify an application user at this stage though.
For now, you must create a new connection and authenticate as the user who installs the solution. The assignment of the application user can be done later on.
- Click on New connection and then on Create.
- When done, click on Import. A message indicates that the import process is in progress.
- When completed, you should see a message confirming the successful import.
Once installed, you can Check the installed components.
CHECK THE INSTALLED COMPONENTS
At the end of the installation process, you can check the installed components by simply clicking on the label of the solution.
All objects of the solution are accessible from the Objects explorer:
Cloud Flows
In order to check whether the necessary Cloud Flows have been installed, proceed as follows:
- Click on Cloud Flows:
| NAME | DESCRIPTION |
|---|---|
| OpenQuoteAndGetUiLink | Flow managing the opening of Smart CPQ from a Power Page. |
| SynchronizationOperation | Flow managing the sync of the CPQ quote content back to the MS Dataverse. |
Connection References
In order to check whether the necessary Connection References have been installed, proceed as follows:
- Click on Connection References.
- You should see the one you created during the installation of the managed solution in the previous chapter.
Processes
In order to check whether the necessary Processes have been installed, proceed as follows:
- Click on Processes:
| NAME | DESCRIPTION |
|---|---|
| : Open Quote And Get UI Link Action | Action triggering the opening of Smart CPQ from a Power Page. |
Tables
- Click on Tables.
- Quote
Those elements are mainly forms for the creation, visualization and edition of quotes from Power Pages.
REGISTER AN APP IN AZURE ACTIVE DIRECTORY
- To start the Azure Active Directory setup, first go on portal.azure.com and access Azure Active Directory:
- In the left menu, click on App Registration and then on New Registration:
- Name the new registration Smart CPQ for Power Pages and choose the option Account in any organizational directory.
- Click on Register. The outcome of the operation are the Application ID and Tenant ID that you may reuse for the overall setup:
- You also need to create a secret to enable the connection. Click on Add a certificate or secret in the previous screen.
- In the panel, give the secret a name and a validity duration and click on Add.
- Save the Value of the secret for future use:
CREATE AN APPLICATION USER TO EXECUTE DATAVERSE UNBOUND ACTIONS
Unlike some Dataverse operations that could be impersonated in MS Power Automate, the execution of unbound actions cannot be.
When installing the CPQ for Power Pages managed solution, you are requested to choose or create a Connection (see above). That determines the user on behalf of whom the Dataverse unbound actions are executed.
During the installation of the managed solution, you are not able to select an application user yet. This operation is possible only by editing the cloud flows.
The first step is the creation of the application user:
- Sign in to the Power Platform admin center as a System Administrator.
- Click on Environments in the left panel, and then select an environment from the list.
- Click on Settings in the action ribbon.
- Expand Users + permissions, and then click on Application users.
- Click on + New app user to open the Create a new app user panel on the right.
- Click on + Add an app to choose the registered Azure AD application that was created for the selected user, and then click on Add (make sure to select the app with the Application ID you retrieved in the first step above).
- Under Business Unit, select a business unit from the drop down list.
- Click on Edit at the top right of the Security roles section. Select security roles for the chosen business unit to associate with the new application user.Security Roles:
Security Roles can be edited in the section Users + permissions > Security Roles for your Environment and Business Unit.
For more details on pre-requisites for Security Roles leverages in managed solution, please see the corresponding section on the following page: Associate CPQ Attributes to CRM Quotes
- After selecting security roles, click on Save.
- Click on Create to complete the process.
ASSOCIATE AN APPLICATION USER TO CLOUD FLOWS DATAVERSE ACTIONS
When using Power Automate, for each cloud flow of the Smart CPQ for Power Pages solution, you need to identify the MS Dataverse actions and associate them with the application user you previously created.
- First step consists in logging in the make.powerautomate.com portal with your System Administrator credentials, and select your environment.
- Navigate to the Solutions in the left panel and click on Smart CPQ for Power Pages:
- Search for Cloud flows in the left menu. Select a cloud flow and Edit it.
- The following operations need to be performed in one of the cloud flows of the list. It will be applied automatically to the others:
- In the graph, identify the MS Dataverse action(s) with the ellipsis at the top right of the action. When clicking on "..." for the action, the displayed panel shows the current active Connection Reference, which is the one you selected or created when importing the solution:
- Click on New Connection Reference. This one is then the same for this action and all subsequent ones for all your cloud flows.
- Click on Connect with service principal:
- Specify an application user by providing the following properties:
- The Client ID is the Application ID created when registering your app (see Register an App in Azure Active Directory). It is accessible from the Overview section of your registered app in the Azure portal.
- The Client Secret is the one you saved when registering your app (see Register an App in Azure Active Directory). It is accessible from the Overview section of your registered app in the Azure portal.
- The Tenant is the tenant ID created when registering your app (see Register an App in Azure Active Directory). It is accessible from the Overview section of your registered app in the Azure portal).
- Click on Create (or Update) when done.
- Save.
Power Pages Website Template
This page provides guidelines on how to quickly integrate Performance Quoting within MS Power Pages.
A template of Power Pages website that implements Smart CPQ flows is delivered in a Zip format, separately from the managed solution for Power Pages, and ready to be imported in a D365 environment.
This template is intended to provide a working example of the Smart CPQ integration flows :
- Display the Performance Quoting UI within the Quote details page.
- Launch the Performance Quoting to MS Dataverse data synchronization, to create/update quote products, or any other quote related entity.
STRUCTURE
The template is a Power Pages site and is structured as follows:
- A home page embedding a list of quotes (MS Dataverse Quote entity)
- The quote list comes with buttons to:
- Create a quote.
- Edit a quote.
- View a quote (read-only).
- The View quote page has a button to display a page embedding CPQ UI.
- The Display Quote page has a button to trigger the CPQ content data sync.
This section details the web pages of Power Pages website.
The design choices made to build this website sample are arbitrary and only intended to provide integration guidelines. The permissions, design, forms, navigation are provided as an example.
Home Page
The Home page includes the Sign-In link to authenticate to an Identity Provider and a list of quotes,
which scope has been set to All Quotes by default.
On the top of the quote list is the Create Quote button to create a MS Dataverse Quote record, but also the related quote in Smart CPQ.
The View Details link redirects to the Quote details page, that includes a button to open the Smart CPQ UI.
Except the navigation to web pages that are CPQ specific, the Home page does not contain any CPQ related logic.
Example:
Create Quote Page
This page leverages the Quote Portal Form (create) form of the Smart CPQ for Power Pages solution.
Apart from having all mandatory fields required to create a quote entity record, it also includes the Setup lookup field, which role is deterministic in the process of the CPQ quote creation.
Using the Submit action creates a quote with the characteristics entered on the page and redirects you to the Home page.
Example:
View Quote Page
This page leverages the Quote Portal Form (view) form of the Smart CPQ for Power Pages solution.
It shows the details (fields) of a quote entity record corresponding the CRM Quote table in the MS Dataverse.
This page embeds an action allowing to navigate from the quote form to the Display Quote page.
Example:
Display Quote Page
This page embeds two elements:
- a PCF component allowing to display Smart CPQ in a frame within the page
- a PCF component under the form of an action button triggering the sync of the CPQ quote content back to the MS Dataverse.
The quote ID, the default locale and timezone, and identifiers of the AAD user are required to be sent to Smart CPQ from this page to be able to access the quote (see Open Quote page).
Example:
Open Quote Page
This page leverages the Quote Portal Form (edit) form of the Smart CPQ for Power Pages solution.
This page embeds an action allowing to navigate from the quote form to the Display Quote page.
This page also leverages Javascript code driving the retrieval of the elements - including the CPQ URL - expected by the OpenQuoteAndGetUiLink Cloud Flow to render Smart CPQ in the Display Quote page.
In details:
Synchronize Quote Page
This page is used to manage the transition from the Display Quote page during the CPQ quote content synchronization to the MS Dataverse.
This page also leverages Javascript code driving the retrieval of the elements expected by the SynchronizationOperation cloud flow to sync the quote.
In details:
INSTALLATION
This chapter describes the steps to follow to provision the template in your environment.
Provision a new Power Pages Site in your environment
While Conga continuously update its documentation, it cannot be held responsible for a change of the procedure by Microsoft.
The first step consists in provisioning a new website in your target environment:
- Go to https://powerpages.microsoft.com and Sign In with a user with system admin privileges.
- Select the environment in which you want to deploy the website template.
- Click on Create a site:
- Select the Blank page template and click on Choose this template:
- Enter the information about your site - name, web address, language - and click on Done:
- Wait for the site to be provisioned (it could take a few minutes).
Microsoft is in the transition from Power Apps to Power Pages for the administration of portals. In this transition phase, it may happen that the above procedure ends with an error message:
The website record for this site has been changed or deleted. Review settings in the admin center.
In that case, some of the steps later in the overall procedure may not work as described, specifically the binding step. We then recommend to delete the site created with the above
Go to https://make.powerapps.com/
Choose the right environment
Navigate to Apps > New App > New website
Enter the Name and Address of your portal and check Use data from existing website record
Choose the website record and click on Create.
Import Power Pages sample site
Once the previous step is completed, you must import the template in your environment.
Install Visual Studio Code and .NET.
Install the Microsoft Power Platform CLI following this procedure: Install Microsoft Power Platform CLI
The Smart CPQ for Dynamics and Smart CPQ for Power Pages managed solutions must be installed in your D365 environment.
Follow the procedure of the previous chapter
- Once the above prerequisites are fulfilled, go to make.powerapps.com, in your environment.
- Select Apps in the left menu. The Power Pages site you created should be displayed in the list. Also, if it is the first time you are provisioning a Power Pages site in your environment,
the Power Pages Management App must be present so you can import the website template:
- Download the Power Pages Reference Implementation zip file from our SFTP site and unzip it on your computer.
- In Visual Studio Code, open a terminal window and create a Power Platform CLI authentication profile to connect to your target environment:
Create a Power Platform CLI authentication profile
pac auth create --name [name] --url [environment url]
Example :
- Display the list of Power Platform CLI authentication profiles :
- Select a Power Platform CLI authentication profile:
Select a Power Platform CLI authentication profile
- Import the sample site components and settings in your environment:
Upload Power Pages site sample
Example :
- After execution of the above command the website template is uploaded to your environment. The upload process shows the following messages:
Bind the website sample to the website you created
- Go to make.powerapps.com to check website has been imported.
- Navigate to the Apps section in the left panel, open the Power Pages Management App:
- Check that the website template has been imported:
Now that you verified that the site was imported, follow the steps below for the binding:
- Go to make.powerpages.com and open the Admin center for the website you have created:
- Click on Edit:
- Bind your website to Power Pages website template:
- In Website Records in the right panel, select the Power Pages website that you have uploaded using Microsoft Power Platform CLI.
- Then click on Save and wait for completion of the operation.
Configure the Power Pages website for Smart CPQ
Before accessing the website sample and CPQ application, a few settings must be configured:
Cloud flows URLs
Power Pages websites are communicating with Performance Quoting by invoking unbound actions from the Smart CPQ for Dynamics managed solution.
Power Automate instant cloud flows are used to trigger MS Dataverse unbound actions through HTTP requests.
The cloud flows URLs are Shared Access Signature (SAS) URLs, specific to the environment in which they are deployed, and computed when the Smart CPQ for Power Pages solution is imported.
Those URLs are part of the settings you need to define before being able to communicate with MS Dataverse and ultimately, Performance Quoting.
There are 2 cloud flows in the solution:
- OpenQuoteAndGetUiLink: Triggers a workflow action that performs the initialization of a CPQ session and returns the URL to display the UI.
- SynchronizationOperation: Triggers the CPQ-to-Dataverse data synchronization (workflow action).
It implies that there are two cloud flow URLs to configure in the template:
- Go to make.powerapps.com.
- Navigate to the Apps section in the left panel, open the Power Pages Management App:
- In the Websites section, click on the Power Pages template:
- Navigate to the Site Settings tab
- Check that Profile/Enabled and Search/Enabled are set to true:
- Click on the /Qtx/CloudFlowEndpoint/ViewQuote. This setting stores the endpoint of the cloud flow URL used to initialize a CPQ session and retrieve the CPQ UI URL to embed the CPQ UI in a Power Page:
Keep this browser's tab opened until retrieving the URL in Power Automate (see below).
You now need to retrieve the OpenQuoteAndGetUiLink cloud flow URL in Power Automate.
- Go to make.powerautomate.com.
- Navigate to Solutions in the left panel and click on Smart CPQ for Power Pages:
- Select Cloud flows in the left menu and click on OpenQuoteAndGetUiLink:
- Then, Edit the cloud flow. The URL is visible after opening the first step of the flow. Copy the value in the clipboard.
- Navigate to the browser tab you kept open in the previous step in make.powerapps.com and paste the URL in the /Qtx/CloudFlowEndpoint/ViewQuote setting.
Save.
- Repeat all the steps above (in make.powerapps.com and in Power Automate) for the second cloud flow (SynchronizationOperation), which flow URL is stored in
the /Qtx/CloudFlowEndpoint/SynchronizeQuote setting.
Save.
Default Locale and Timezone
The CPQ UI is displayed in a given language/locale provided when initializing a CPQ session. A timezone is also provided for CPQ session initialization in order for CPQ to manage DateTime fields.
As explained in the Authentication and Security chapter, as the execution of MS Dataverse unbound actions cannot be impersonated, the cloud flows execute on behalf of an application user that cannot be used to initialize a CPQ session.
CPQ session initialization must be performed by the same user that authenticates to the portal (i.e. via an Identity provider such Azure Active Directory authentication and not via the portal
authentication).
Along with the authenticated user name, the Power Pages must communicate to CPQ the language and timezone of the authenticated user. Those properties can be retrieved by any appropriate method (examples are provided).
When not provided, language and timezone can be defaulted to values stored in website settings. Fill-in values for the following Power Pages template settings:
- /Qtx/DefaultLocale: default locale
Must be a locale defined in the MS Dataverse languagelocale entity.
Provide either the language identifier (numeric value, localeid field) or the locale code (ll-cc : language code, 2 digits lowercase"-"country code, 2 digits lowercase)
- /Qtx/DefaultTimezone : default timezone
Must be a timezone defined in the MS Dataverse timezonedefinition entity.
Provide either the timezone code (numeric value, timezonecode field) or the timezone name (standardname field)
Restart the portal
Once the website binding is completed and website settings are setup, you must restart the portal:
- Go to make.powerpages.microsoft.com
- Click on Edit on the tile of your site:
- Click on Set Up in the left menu, and then Open the admin center in the right part:
- Once redirected to the Admin center for your site, click on Site Actions in the top ribbon
- Click on Restart.
Test
Open your website using its URL. The URL can be found on make.powerpages.microsoft.com, on the tile of your website:
