Search Results :

×
Sign Up Contact Us

Contents

Configure Instagram Single Sign-On (SSO) with Joomla OAuth Client Plugin

This guide explains how to configure our Joomla OAuth Client extension to allow users to log in with their Instagram accounts. This integration is managed through the Instagram Basic Display API, which is part of the Meta for Developers platform.

Adding an "Login with Instagram" option is ideal for websites with a strong visual or community focus, such as artist portfolios, brand showcases, lifestyle blogs, and e-commerce sites. It provides a quick and modern login method for an audience that is highly engaged on the Instagram platform.

download plugin button Download Plugin plugin pricing button plugin pricing button Pricing Plans free trial plugin free trial plugin Free Trial Handbook plugin Handbook plugin Handbook

In this configuration, Instagram functions as the OAuth server, while Joomla allows users to log in with their Instagram credentials by utilizing the Joomla OAuth Client Plugin.

  • Login into your Joomla site’s Administrator console.
  • From left toggle menu, click on System, then under Install section click on Extensions.
  • Now click on Or Browse for file button to locate and install the plugin file downloaded earlier.
  • Installation of plugin is successful. Now click on Get Started!
  • Under Configure OAuth -> Pre-Configured Apps tab, select your OAuth Provider. You can also search for custom OAuth or custom OpenID application in the search bar, and configure your own custom provider.
Get Started with OAuth Client Setup

  • After selecting your OAuth provider, you will be redirected to the Step 1 [Redirect URL] tab. Now copy the Callback/Redirect URL which we will use to configure the OAuth Server, then click on the Save & Next button.
Get Started with OAuth Client Setup

Instagram Dashboard

  • Enter your website URL and phone number under the Your Website and Phone Number text fields respectively. Click on the Sign-Up button to continue. This step completes your sign up to a developer account.
Instagram Dashboard

  • Click on Register your Application button again and then go to Manage Clients -> Register a New Client as shown in the image below:
Instagram Dashboard

  • Enter your Application Name, Description, Company name, website URL, Contact Email etc. Copy the Redirect/ Callback URL from the miniOrange OAuth Client Plugin and save it under the Valid Redirect URLs text field. Finally, click on the Register button to save your configurations.
Instagram Dashboard

  • Now click on the Manage button to view and copy your Client ID and Client Secret.
Instagram Dashboard

  • Click on the Security tab and uncheck the Disable Implicit OAuth option. Click on the Update Client button to save your changes.
  • Go back to your Joomla Dashboard. Then go to Step 2 [Client ID & Secret].
  • Paste the Client ID, Client Secret and Domain. Also Set Client Credentials In Header and Body then click on Save Settings. Once Settings are saved then click on Save Configuration.
Upload IdP Metadata

  • Scope & Endpoints are given below, which are required for configuring Joomla as OAuth Client plugin to configure Instagram as a custom OAuth or OIDC provider.
Scope user_profile user_media
Authorize Endpoint https://api.instagram.com/oauth/authorize
Access Token Endpoint https://api.instagram.com/oauth/access_token
Get User Info Endpoint https://graph.instagram.com/me?fields=id,username&access_token=
Set Client Credentials In Header and In Body

  • User Attribute Mapping is mandatory for enabling users to successfully login into Joomla. We will be setting up user profile attributes for Joomla using below settings.
  • Go to Step 3 [Attribute Mapping] tab and click on Test Configuration button.
Upload IdP Metadata

  • You will be able to see the attributes in the Test Configuration output as follows.
Upload IdP Metadata

  • Now go to the Step 3 [Attribute Mapping] tab and Select the attribute name for Email and Username from dropdown. Then click on Finish Configuration button.
Upload IdP Metadata

  • Now go to Step 4 [SSO URL] tab, here copy the Login/SSO URL and add it to your Site by following the given steps.
Upload IdP Metadata

  • Now logout and go to your Joomla site's pages where you have added this link. You will see a login link where you placed that button. Click on this button to perform SSO.


ADFS_sso ×
Hello there!

Need Help? We are right here!

support