IDM 7.5.0

Social identity provider button and badge properties

Social authentication is deprecated and will be removed in a future release of IDM. For more information, refer to Deprecation.

You can configure buttons and badges for each social identity provider, using the admin UI or by editing the associated identityProvider-name.json file. The admin UI displays examples during social identity provider configuration.

Badges appear in the admin UI under Configure > Social ID Providers , and in the End User UI under My Account > Sign-in & Security > Social Sign-in.

Buttons appear in the IDM login screens, and when you select Register from the End User UI login screen.

Example Button Example Badges
socialButton
socialBadge

How IDM displays buttons and badges changes based on how many social identity providers are enabled:

  • For up to three social identity providers, IDM displays large buttons, with the text Register with Provider.

  • For four or more social identity providers, IDM displays smaller buttons with icons.

    For seven or more social identity providers, horizontal scrolling may be required.
Properties for Social Identity Provider Buttons and Badges
Property (UI) Property (JSON file) Description

Badge background color

iconBackground

Color for the social identity provider icon.

Badge icon classname

iconClass

Name of the icon class. Can be a Font Awesome name like fa-google.

Badge font color

iconFontColor

Color for the social identity provider icon font.

Button image path

buttonImage

Looks in openidm/ui/admin/extension and then openidm/ui/admin/default for an image file. Takes precedence over the Button icon classname.

Button icon classname

buttonClass

Name for the social identity provider class. Can be a Font Awesome name like fa-yahoo.

Button display name

buttonDisplayName

Name to display on large buttons.

Button styles

buttonCustomStyle

Custom styles, such as background-color: #7B0099; border-color: #7B0099; color:white;.

Button hover styles

buttonCustomStyleHover

Custom styles for the hover state of a button, such as background-color: #7B0099; border-color: #7B0099; color: white;.