Step 1. Install the widget

You can add the Advanced Identity Cloud/PingAM Login Widget to your app by using Node Package Manager (npm), or you can download it from GitHub and build it yourself, adding results to your project directly.

Install the Advanced Identity Cloud/PingAM Login Widget with npm: The easiest way to add the Advanced Identity Cloud/PingAM Login Widget to your project.
Build a customized Advanced Identity Cloud/PingAM Login Widget: If you want to customize the themes included in the Advanced Identity Cloud/PingAM Login Widget, you need to download the Advanced Identity Cloud/PingAM Web Login Framework source, make your modifications, and build a customized package.

Install the Advanced Identity Cloud/PingAM Login Widget with npm

Add the Advanced Identity Cloud/PingAM Login Widget to your project using npm as follows:

npm install @forgerock/login-widget

Next, you can Step 2. Configure the CSS.

Build a customized Advanced Identity Cloud/PingAM Login Widget

The following steps show how to download the Advanced Identity Cloud/PingAM Web Login Framework and build the Advanced Identity Cloud/PingAM Login Widget:

Download the Advanced Identity Cloud/PingAM Web Login Framework from the Git repository:

git clone https://github.com/ForgeRock/forgerock-web-login-framework.git
In a terminal window, navigate to the root of the Advanced Identity Cloud/PingAM Web Login Framework:

cd forgerock-web-login-framework
Run npm to download and install the required packages and modules:

npm install
Build the Advanced Identity Cloud/PingAM Login Widget with npm:

npm run build:widget
Copy the built package/ directory into your app project
Import the Widget component into your app:

import Widget from '../path/to/package/index.js';

The exact syntax for importing the widget into your app varies depending on the technologies your app uses.

Next, you can Step 2. Configure the CSS.