Build button
Customize your integration by manually building the JavaScript button
docscurrentLast updated: October 12th 2021, @ 6:58:00 pm
Follow these steps to manually build the Log in with PayPal button:
Select button type
Choose if you want to use the branded Log in with PayPal button or to create your own.
To create your own Log in with PayPal button, reference our Button design guide.
To use the branded Log in with PayPal button, use
https://www.paypalobjects.com/devdoc/log-in-with-paypal-button.pngfor the button image location.Note: To ensure the button image stays in sync with PayPal branding, don't download the button image and host it on your own server.
Construct authorization endpoint
The authorization URL is called each time your users select the Log in with PayPal button. Construct the authorization endpoint according to the following template:
```text
https://www.sandbox.paypal.com/connect?flowEntry=static&client_id=[client id]&scope=[list of scopes]&redirect_uri=[return URL]
```
| Variable | Description |
|---|---|
| client ID | Replace client id with your app’s sandbox or live client ID, depending where this URL is used. Example: ARfDleH_j-C17kxbdUzYivR70xP5Uy5N_DrFZVOvyZvNGBaPB_QNbwWkgF7lMsemGJycLRFVwaM |
| list of scopes | Replace list of scopes with a space-separated list of scopes. It is mandatory to include openid scope. See Scope attributes for details on how attributes map to scopes. Example: openid profile email address https://uri.paypal.com/services/paypalattributes |
| return URL | Page to return to after successful login. This URL must be encoded and exactly match the Return URL you set in the My App & Credentials page. Example: https%3A%2F%2Fwww.myreturnurl.com&state=123456 |
Sample URL
```text
https://www.sandbox.paypal.com/connect/?flowEntry=static&client_id= ARfDleH_j-C17kxbdUzYivR70xP5Uy5N_DvNGBaPB_QNbwWkgF7lMsemGJycLRFVwaM&response_type=code&scope=openid profile email address&redirect_uri=https%3A%2F%2Fwww.myreturnurl.com&state=123456
```
Customize functionality
You can optionally use the following advanced parameters to further customize your button functionality:
| Parameter | Description |
|---|---|
response_type | code – to receive authentication code in the response.id_token – used only by direct instruction of your integration team. |
fullPage | To open the flow in a mini browser, do not pass this parameter. To open the Log in with PayPal flow as a full page in the same tab, pass true. |
Get authorization code
When your users successfully log in to PayPal and consent to sharing their basic information, PayPal passes an authorization code to the return URL you specify.
| Parameter | Description |
|---|---|
| authorization code | The authorization code is appended as a parameter to the return URL after the user logs in and consents to share information with your website. |
Sample URL
https://myreturnurl.com/?code={authorization_code}&scope=address%20openid%20profile%20email