UniFed - Widget

Create Widget

Step 1:

• Log in to the UniFed portal.
• From the main dashboard, navigate to the "Organization" section in the left sidebar.
• Click on "Organization List" and select your organization, click and when scrolled down we have an option at the bottom " Create Widget".

Step 2:

Widget Name: Enter a unique name for the widget. This name will help you identify the widget within the system.

Redirects: Select from available redirect options after authentication. This determines where users will be redirected post-authentication.

Allow Domains: Specify which domains are allowed to host or call the widget. This is critical for security and ensuring the widget only operates within approved environments.

Step 3:

Select Authentication Types

• Magic/OTP Authentication: Choose options related to Magic Link or One-Time Password authentication mechanisms from the dropdown
• Social Authentication: Choose the social authentication method from the dropdown
• SSO Authentication: Choose the SSO authentication from the dropdown

Step 4:

Customize the Login Button - Specify the URL where the user should be redirected after clicking the login button. This could be an internal or external link.

Button Name: Specify the text that will appear on the login button.

Step 5:

• Select the Desired Sign-Up Methods: Choose from available options from the dropdown to proceed for signup process
• Custom Signup Button - Enter the URL where users should be redirected after clicking the sign-up button. This could be a registration page or a special landing page designed for new users.
• Button Name - Specify the text to be displayed on the button. This should communicate the action the user is taking, such as "Sign Up", "Register", or a more specific call to action.

Step 6:

• Once all the Mandatory fields are filled click on the save option, the Created widget will be displayed and visible on the Features option within the organizations.

Step 7:

• Once the Widget is created, copy the Snippet and paste it into your code.

• Here is the sample format of the Widget, which will look like this from this it can proceed and be authenticated.