Sign in with Apple

💡 About this Plugin

✏️ Introduction

A must-have no-code plug-in for a Bubble app that allows user authentication with Apple ID and is submitted to App Store for publishing. Once your app is reviewed by the Apple Review Team, they will require Apple Signing to be implemented as one of the sign-in options. Moreover, Sign in with Apple makes it easy for users to sign in to your apps and websites using their Apple ID. Instead of filling out forms, verifying email addresses, and choosing new passwords, they can use Sign in with Apple to set up an account and start using your app right away. Prerequisites You must have a developer account with Apple to interact with the plugin. Create your development account at:
Note: Apple provides several Sign in with Apple buttons you can use to let people set up an account and sign in. To see the guidance please go here:

🎮 Demo

🎬 Plugin Overview

Image without caption

🚀 Setup Guide

The plugin guide consists of two parts:
  • Apple Developer Account - to configure your own developer account,
  • Plugins Tab - to configure the Keys,

How to setup

1. You must have a developer account at Apple to interact with the plugin. Create your development account here: Apple console

Create an APP ID

From the sidebar, choose Identifiers then click the blue plus icon.
Image without caption

1. Choose App IDs in this first step

Image without caption
In the next screen, you’ll choose a description and Bundle ID for the App ID. The description isn’t too important, but type something descriptive. The Bundle ID is best when it’s a reverse-dns style string. A bundle ID or bundle identifier uniquely identifies an application in Apple's ecosystem. This means that no two applications can have the same bundle identifier. To avoid conflicts, Apple encourages developers to use reverse domain name notation for choosing an application's bundle identifier.
Image without caption
In this example, I’m using io.zeroqode-demo-20.bubbleapps since the domain this app will be running on is
You’ll also want to scroll down through the list of capabilities and check the box next to Sign In with Apple.
Image without caption

2. Choose Services IDs in this first step and click continue.

Image without caption
identifier - A string that identifies the user interface item In this example, I’m using io.zeroqode-demo-20 since the domain this app will be running on is zeroqode-demo-20
Image without caption
After your registration Services id, on the Identifiers page, will find your new Service id and make click on it.
Image without caption
Checkbox ENABLED makes true and click configure. This is where you’ll define the domain your app is running on, as well as define the redirect URLs used during the OAuth flow. you click on the blue icon.
Image without caption
Primary App id - set App id which created in 1 point.
Add in the fields Domains and Subdomains, your domain and Redirect URLs. Add two redirect URLs separated by comma, one for the version test and live.
Click the button next, and Save.
Image without caption
In case you have a Custom Domain, enter the Return URLs of your custom domain. Additionally, add Custom Domain URI in the button filed - Redirect URI.
Copy the identifier and set it in the plugin settings.
Image without caption
Image without caption

3. Plugin element

Open your editor to the design tab, and drag the ✔SignInWithApple element into your working space wherever you want (our demo app example):
Note: Please carefully add the plugin elements on the page. Due to Apple's technology, you can add only one Sign in with Apple button. Otherwise, it may cause conflicts.
Click on the plugin element to open its property editor.
Image without caption
  • Redirect URI - set the page where the user sign in
  • Type - text to set up by Apple script, continue , sing in or sing up with Apple
  • Colour - set the colour property to one of the following values: black or white to configure the background colour of the Sign in with Apple button.
  • Enable border - show border around the button.
  • Apple language - сhoose the language.
  • Mode - set the mode property to one of the following values: centre-align, left-align, logo-only to configure the appearance of the Sign in with Apple button
  • Border Radius - set the border-radius property to a number between 0—50 to configure the border radius of the button. The default is 15.
  • Logo Size - You can control the size and position of the Apple logo on the Sign in with Apple button. These settings only work if you set mode to left-align or centre-align. To configure the logo size on the button, set the logo-size property to one of the following values: small, medium or large.
  • Width - ⚠️Work only with left-align. Apple official documents state that the data width property should be in the of range 130-375. The default value is 100% to fit the container size.
  • Height - ⚠️Work only with left-align. Apple official docs state that the data height property should be in the range of 30-64. The default value is 100% to fit the container size.

Element Events

Apple ID Sign-In on Success - This event will occur when the client has successfully passed apple authentication and apple has sent us data such as email and password.

Element States

Email - here will be the customer email sent by Apple.
sub - this is a unique one offered to us by apple and we can use it as a password.
First Name and Last Name - the name with which the user registered in Apple. ⚠️Remember that the name is sent only the first time the user logs in.

4. Set workflow for login

  1. Add the event “Apple ID Sign-In on Success” in the workflow tab
  1. Add the action “Sign the user up” and “Log the user in” to the event “Apple ID Sign-In on Success
Image without caption
3. Fill in the action fields and condition
Image without caption
  • Email- e-mail state
  • Password - Sub state for password
  • Stay logged in - no


This section will help you locate all the updates about the plugin improvements, refactoring and bug fixes.

Version: 1.3.0

⚙released on 9 Feb 2021
  • 🎉 New plugin documentation
  • 🔧 Added "Setup Guide" section
  • ❓ Added "FAQs" section
  • ✅ Added "Changelogs" section
  • 🎬 Added "Plugin Overview" section
  • 📄 Added "Table of Contents" everywhere, for a much better navigation
  • Lots of cool screenshots for guidance
  • Updated icon

Version: 1.0.0

⚙ released on the 11th of Dec 2019
  • Initial Release

Version: 1.1.0

⚙ released on 28 May 2020
  • Fixed passing the plugin name state

Version: 1.2.0

⚙ released on 10 Dec 2020
  • Fixed action "Remove URL Params"

Version: 1.6.0

⚙️ released on the 9th of Sep 2022
  • Possibility to change the language

Version: 1.7.0

⚙️ released on the 15th of Sep 2022
  • Minor fixes

Version: 1.9.0

⚙️ released on the 28th of Dec 2022
  • plugin optimization (reduces login time)

Version: 1.10.0

⚙️ released on 9th of Jan 2023
  • minor fix

Version: 1.14.0

⚙️ released on 5th of June 2023
  • Field "height" is made required.

Version: 1.16.0

⚙️ released on 22nd of June 2023
  • Fixed the trigger of sign in problem

Version: 1.28.0

⚙️ released on 16th of April 2024
  • Fixed loop triggering of events.

Version 1.34.0

⚙️ released on 23rd of July 2024
  • Fixed responsive and font fields