• Home
• App Integrations
• Single Sign-On Integrations
• Webflow Single Sign-On

Webflow Single Sign-On (SSO)

---

Webflow provides a platform that allows businesses or people to create responsive websites without any technical expertise. It provides the pre-edited templates of different sites as per users need. Webflow allows users to accomplish most aspects of web development & website distribution entirely within the application, so go grab ready to use Webflow Single Sign-On (SSO) solution.

Webflow SSO solution by miniOrange provides you a ready to use Single Sign-On service which allows users to securely login into Webflow and other integrated applications using a single set of login credentials. You can easily connect with any of your IDP (Okta, Ping, etc), Active Directory and LDAP without migrating your users. Webflow SSO integration helps your organization's time and efforts with improved security to your data present in the cloud or on-premise. You don't need any enterprise plan or premium feature to enable SSO for Webflow. Get One-Click secure SSO access with miniOrange’s IAM services.

Challenge faced by Webflow Users

Webflow users want a continuous and seamless access to their Webflow portal through their existing accounts. They don't wish for their users to have a separate set of credentials for logging in to Webflow. Webflow provides a way for its users to allow their users to log in to the platform seamlessly. But, an interface needs to be created which would allow this.

SSO Solution for Webflow

miniOrange provides an integrated SSO solution where a logged in user's existing session can be used to log the users into Webflow by creating a valid JSON Web Token (JWT). Webflow user is relieved from maintaining separate user credentials for its users.

As a result, miniOrange Single Sign-On (SSO) solution is implemented. Webflow users can now log into Webflow platform using their existing credentials.

Prerequisites

• Log into miniOrange Admin Console.
• Click on Customization in the left menu of the dashboard.
• In Basic Settings, set your company domain in Organization Name textfield.
• Click Save. Once that is set, the branded login URL would be of the format https://<company_domain>.xecurify.com/moas/login

Follow the Step-by-Step Guide given below for Webflow Single Sign-On (SSO)

1. Configure Webflow in miniOrange

• Go to Apps >> Add Application from the side menu.



• Click on the JWT under Choose Application Type.



• In the next step, search for Webflow application from the list. If your application is not found, search for External / JWT App and you can set up your Application.



• You can configure the following details in the application:

Custom App Name	Enter the Application Name of your choice, and add a description if required.
Redirect-URL	Enter the Redirect-URL (i.e. the endpoint where you want to send/post your JWT token). You can add multiple redirect URLs by separating them with a ‘;’. E.g. abc.com;xyz.com
Primary Identity Provider (optional)	Select your Identity Source from the dropdown. You can select miniOrange here as default IDP.




• Click on Save to complete the configuration.
• Click on Edit in the select menu against your app.



• You can get further details about your recently added JWT application:

Client ID	If your application provides its own client ID, you can configure it by clicking on the Customize button.
App Secret	You can find App Secret by clicking on the copy icon. This is used in the HS265 Signature algorithm for generating the signature.
Signature Algorithm	Select your signature algorithm from the dropdown.
Primary Identity Provider	Select the default Identity Provider from the dropdown for the application. If not selected, users will see the default login screen and can choose their own IDP. [Choose miniOrange in this case.]
Redirect URL	Given below is your app URL where you will receive your token. RSA 256 : <your_app-login-url> (Here token will be added by the system) HS256 : <app-login-url/?id_token=>




• Scroll down to Endpoints >> Single Sign-On URL. Save this URL as you will need this in the following configuration.



• click on Save to save the configuration.

2. Adding Script on Webflow's End

• To enable SSO on Webflow's end, all you need to do is add a customized script.
• Click here to download the script needed or you can reach out to us at idpsupport@xecurify.com at any time if you need help with the integration.

3. Configure Your User Directory

miniOrange provides user authentication from various external sources, which can be Directories (like ADFS, Microsoft Active Directory, Azure AD, OpenLDAP, Google, AWS Cognito etc), Identity Providers (like Okta, Shibboleth, Ping, OneLogin, KeyCloak), Databases (like MySQL, Maria DB, PostgreSQL) and many more. You can configure your existing directory/user store or add users in miniOrange.

• Setup miniOrange as IDP
• Setup AD as User Directory
• Setup External IDP

• To add your users in miniOrange there are 2 ways:

1. Create User in miniOrange

2. Bulk Upload Users

1. Create User in miniOrange

• Click on Users >> User List >> Add User.



• Here, fill the user details without the password and then click on the Create User button.



• After successful user creation a notification message "An end user is added successfully" will be displayed at the top of the dashboard.



• Click on On Boarding Status tab. Check the email, with the registered e-mail id and select action Send Activation Mail with Password Reset Link from Select Action dropdown list and then click on Apply button.



• Now, Open your email id. Open the mail you get from miniOrange and then click on the link to set your account password.
• On the next screen, enter the password and confirm password and then click on the Single Sign-On (SSO) reset password button.



• Now, you can log in into miniOrange account by entering your credentials.

2. Bulk Upload Users in miniOrange via Uploading CSV File.

• Navigate to Users >> User List. Click on Add User button.



• In Bulk User Registration Download sample csv format from our console and edit this csv file according to the instructions.



• To bulk upload users, choose the file make sure it is in comma separated .csv file format then click on Upload.



• After uploading the csv file successfully, you will see a success message with a link.
• Click on that link you will see list of users to send activation mail. Select users to send activation mail and click on Send Activation Mail. An activation mail will be sent to the selected users.

• Click on External Directories >> Add Directory in the left menu of the dashboard.



• Select Directory type as AD/LDAP.



1. STORE LDAP CONFIGURATION IN MINIORANGE: Choose this option if you want to keep your configuration in miniOrange. If active directory is behind a firewall, you will need to open the firewall to allow incoming requests to your AD.
2. STORE LDAP CONFIGURATION ON PREMISE: Choose this option if you want to keep your configuration in your premise and only allow access to AD inside premises. You will have to download and install miniOrange gateway in your premise.




• Enter LDAP Display Name and LDAP Identifier name.
• Select Directory Type as Active Directory.
• Enter the LDAP Server URL or IP Address against LDAP Server URL field.
• Click on Test Connection button to verify if you have made a successful connection with your LDAP server.



• In Active Directory, go to the properties of user containers/OU's and search for Distinguished Name attribute.



• Enter the valid Bind account Password.
• Click on Test Bind Account Credentials button to verify your LDAP Bind credentials for LDAP connection.



• Search Base is the location in the directory where the search for a user begins. You will get this from the same place you got your Distinguished name.



• Select a suitable Search filter from the drop down menu. To use custom Search Filter select "Write your Custom Filter" option and customize it accordingly.



• You can also configure following options while setting up AD. Enable Activate LDAP in order to authenticate users from AD/LDAP. Click on the Save button to add user store.




Here's the list of the attributes and what it does when we enable it. You can enable/disable accordingly.

Attribute	Description
Activate LDAP	All user authentications will be done with LDAP credentials if you Activate it
Sync users in miniOrange	Users will be created in miniOrange after authentication with LDAP
Fallback Authentication	If LDAP credentials fail then user will be authenticated through miniOrange
Allow users to change password	This allows your users to change their password. It updates the new credentials in your LDAP server
Enable administrator login	On enabling this, your miniOrange Administrator login authenticates using your LDAP server
Show IdP to users	If you enable this option, this IdP will be visible to users
Send Configured Attributes	If you enable this option, then only the attributes configured below will be sent in attributes at the time of login



• Click on Save. After this, it will show you the list of User stores. Click on Test Connection to check whether you have enter valid details. For that, it will ask for username and password.



• On Successful connection with LDAP Server, a success message is shown.
• Click on Test Attribute Mapping.



• Enter a valid Username. Then, click on Test. Mapped Attributes corresponding to the user are fetched.



• After successful Attribute Mapping Configuration, go back to the ldap configuration and enable Activate LDAP in order to authenticate users from AD/LDAP.

Refer our guide to setup LDAPS on windows server.

User Import and Provisioning from AD

• Go to Settings >> Product Settings in the Customer Admin Account.



• Enable the "Enable User Auto Registration" option and click Save.



• (Optional) To send a welcome email to all the end users that will be imported, enable the "Enable sending Welcome Emails after user registration" option and click Save.



• From the Left-Side menu of the dashboard select Provisioning.



• In Setup Provisioning tab select Active Directory in the Select Application Drop Down.
• Toggle the Import Users tab, click on Save button.



• On the same section, switch to Import Users section.
• Select Active Directory from the dropdown and click on the Import Users tab, to import all the users from Active Directory to miniOrange.



• You can view all the Users you have imports by selecting Users >> User List from Left Panel.



• All the imported users will be auto registered.
• These groups will be helpful in adding multiple 2FA policies on the applications.

miniOrange integrates with various external user sources such as directories, identity providers, and etc.

• Okta
• ADFS
• Ping
• AWS Cognito
• Many more

Not able to find your IdP or Need help setting it up?

Contact us or email us at idpsupport@xecurify.com and we'll help you setting it up in no time.

4. Test SSO Configuration

• miniOrange as IDP
• External IDP

Using SP Initiated Login

• Lets say you have configured miniOrange as your userstore.
• On accessing the Single sign-On URL as mentioned in the second step, you will be asked for miniOrange credentials.



• On entering the valid credentials, you will be successfully logged into Webflow.

Using IDP Initiated Login

• Log into miniOrange IdP using your credentials.
• On the End User-Dashboard, click on the Webflow application configured, to test the SSO flow.



• You will be successfully logged into Webflow.

Using SP Initiated Login

• Lets say you have configured Okta as IDP.
• On accessing the Single sign-On URL as mentioned in the second step, you will be asked to enter your Okta credentials.



• On entering the valid credentials, you will be successfully logged into Webflow.

Using IDP Initiated Login

• Log into Okta using your credentials.
• Click on Admin to access the Admin Console, then click on Applications.
• Click on Add Application and search for "Bookmark App", and Click Add in the left pane.
• Choose an app name of your choice which will be the display name.
• In the URL section, enter the SSO URL that is given in the JWT app.



• Click on Save.
• On the End User-Dashboard, click on the Webflow bookmark application configured, to test the SSO flow.



• You will be successfully logged into Webflow.

External References

• What is Customer Identity and Access Management (CIAM)
• Introduction to Identity and Access Management(IAM)?
• Know how to set-up Bigcommerce SSO
• Single Sign On (SSO) solution for Thinkific with JWT

Frequently Asked Questions

How can I restrict page access on webflow? Is this handled via the scripts?

Yes, our scripts are completely customizable and you can restrict page access based on memberships, groups, company . domain or any other custom attribute of your choice.

What will happen if my customers disable javascript on the browser?

We handle this by adding the no script tags in our script file, this enables redirection of your users to a customizable page with instructions to enable javascript.