Layers
Classes
Variables
Popup Builder
Visibility Conditions
Figma to Kirki
Custom Code
Review and Publish
Layers
Classes
Variables
Popup Builder
Visibility Conditions
Figma to Kirki
Custom Code
Review and Publish

X (Twitter) Login

X (Twitter) Login allows visitors to sign in to your website using their existing X account instead of creating a separate username and password. Connect X (Twitter) Login through Kirki Apps to add an X Login button to your Kirki login forms. When a visitor signs in, X verifies their identity and redirects them back to your website.

What Is the X (Twitter) Login App

The X (Twitter) Login app is an integration available in Kirki Apps. Once connected, it allows visitors to authenticate on your website using their X account.

What You Need Before Connecting X (Twitter) Login

  • An X account
  • An X Developer app
  • Your website domain
  • A Client ID
  • A Client Secret

Note: Social Login buttons can only be inserted on a Login/ Registration Utility Page.

How to Get X (Twitter) Client ID and Client Secret

  1. Go to the X Developer Console and sign in.
  1. If prompted, complete the Developer Agreement.
  1. Go to Apps —> Click Create App.

X developer portal highlights the button for creating a new developer app.

  1. Enter your Application Name and select the appropriate Environment and Create the app.
  1. Refresh the dashboard and select your app.
  1. Cilck Settings to get Authentication Settings

X developer portal highlights app settings needed before creating an application.

  1. Set the App Permissions to Read.
  1. Under Type of App, select Web App, Automated App, or Bot.

 X app permissions page highlights application type and required access permissions.

  1. Then add the Authorized Redirect URL here. You will get it in Kirki editor from the X Login App Configuration window

Redirect URI’s has the following URL structure:

“https://example.com/wp-json/XLogin/v1/Auth/X-login”

Note:The Redirect URI shown in Kirki already contains your website’s actual domain. Copy the URI directly from the Kirki X App configuration dialog; do not manually enter or modify it.

  1.  Add your Website URL

X developer settings display the application website URL and callback configuration.

  1. Click Save Changes and then copy your Client ID and Client Secret.

X developer portal shows OAuth client credentials after enabling app integration settings.

How to Install the X (Twitter) Login App in Kirki

  1. Open the Kirki Editor.
  1. Navigate to Apps from the left sidebar.
  1. Search for X (Twitter) Login.
  1. Click Install.

How to Configure the X (Twitter) Login App

  1. Once the app is installed, click the ellipsis (…) icon next to it.
  1. Select Configure.

Kirki Apps panel displays X Login credentials entered in configuration fields.

  1. Enter your X Client ID and X Client Secret. Set the Success URL where users should be redirected after successfully signing in.
  1. Click Save Configuration and refresh the Kirki editor page.

Your Kirki website is now connected to X (Twitter) Login.

How to Add X (Twitter) Login to Your Login Form

  1. Open your Login Utility Page in the Kirki editor.
  1. From Apps, find X (Twitter).
  1. Click the ellipsis (…) icon next to it.
  1. Select Insert.

Kirki Apps menu highlights inserting the configured X Login integration into page.

  1. Drag the X Login button into your login form.
  1. Customize the button style if needed.

Kirki sign-in form preview highlights the new Log in with X button.

Your login form now includes X (Twitter) Login.

How to Test the X Login Integration

  1. Publish your changes and open your website in a fresh browser window or private/incognito window.
  1. Open your login form.
  1. Click Log in with X.

Published website displays X sign-in option beneath the email and password fields.

  1. Confirm that Twitter opens the authorization screen and click Authorize app; now users will get redirected to the success URL page you set during configuration.

Was this page helpful?

Our website uses cookies to improve your browsing experience on our website. By continuing to use this website, you agree to their use. For details, please check our Privacy Policy.