> ## Documentation Index
> Fetch the complete documentation index at: https://razorpay-881012b3.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Login With Razorpay Setup (SSO)

> Boost conversions and gain customer insights with Magic SSO. Simplify login and create personalised shopping experiences for your Shopify store.

<div style={{display:"flex",flexWrap:"wrap",alignItems:"center",gap:"0.35rem 0.9rem",border:"1px solid rgba(128,128,128,0.28)",borderRadius:"0.5rem",padding:"0.45rem 0.75rem",margin:"0 0 1.25rem",fontSize:"0.875rem"}}>
  <span style={{fontWeight:600}}>Available in</span>
  <span>🇮🇳 India</span>
</div>

Razorpay Magic SSO (Single Sign-On) offers a seamless login experience, helping you enhance conversions and gain valuable insights into user behaviour.

<Warning>
  **Watch Out!**

  This feature is available only for Shopify users.
</Warning>

<AccordionGroup>
  <Accordion title="Advantages">
    * **Seamless Login and Personalisation**: OTP-based login with incentives like discounts, enabling auto-login across stores for a frictionless and personalised experience.
    * **Expanded Customer Data and Insights**: Higher login rates provide you with deep insights into customer behaviour before checkout, improving engagement and retention.
    * **Improved Conversion Rates**: Pre-logged-in users experience smoother checkouts, early coupon discovery, and personalised offers, driving higher sales.
    * **Stronger Abandoned Cart Recovery**: Captures abandoned carts before checkout, allowing you to re-engage users who showed purchase intent.
    * **Customisable and Compliant**: Fully brandable UI with explicit consent collection for retargeting, ensuring compliance and trust.
  </Accordion>
</AccordionGroup>

## Get Started

Follow the steps given below:

1. Log in to the Dashboard and navigate to **Magic Checkout** → **Setup & Settings**.
2. Navigate to **Login with Razorpay Setup**.
3. We will verify the following eligibility requirements with your Shopify store:

<AccordionGroup>
  <Accordion title="Shopify Store Eligibility">
    If your store is on Shopify's base plan and is not eligible, you must upgrade your plan. Follow the steps given below:

    1. Log in to the [Shopify Store](https://accounts.shopify.com/store-login) and navigate to **Settings** → **Plan**.
    2. Choose an upgraded plan and complete the payment.
    3. Recheck the Razorpay Dashboard, you will now be eligible to enable Login with Razorpay.
  </Accordion>

  <Accordion title="Legacy Customer Accounts">
    Follow the steps given below to configure your legacy customer settings:

    1. Log in to the [Shopify Store](https://accounts.shopify.com/store-login) and navigate to **Settings** → **Customer accounts**.
    2. In the **Login Links** section, select **Legacy**.
    3. Click **Switch to legacy customer accounts** to confirm.
    4. On the home page, navigate to **Online Store** → **Preferences** in the **Sales channels** section.
    5. Scroll down to the **Spam Protection** section and disable the **Enable on login, create account and password recovery pages** setting.
    6. Click **Save**.
  </Accordion>

  <Accordion title="Enable Login Settings">
    Follow the steps given below to configure your Shopify login settings:

    1. Log in to the [Shopify Store](https://accounts.shopify.com/store-login) and navigate to **Online Store** → **Preferences** in the **Sales channels** section.
    2. Scroll down to the **Spam Protection** section and disable the **Enable on login, create account and password recovery pages** setting.
    3. Click **Save**.
  </Accordion>

  <Accordion title="Razorpay App Configuration">
    Follow the steps given below if your Razorpay app is unable to create or merge customer:

    1. Log in to the [Shopify Store](https://accounts.shopify.com/store-login) and navigate to **App and Sales** in the **Sales channels** section.
    2. Click **Develop apps** and open the **Magic Checkout** app.
    3. Click **configuration** → **Edit Admin API Integration**
    4. Search for **customer** and select **Write\_Customer** and **read\_customer**.
    5. Search for **Merge** and select **Write\_customer\_merge** and **read\_customer\_merge**.
    6. Click **Save**.
  </Accordion>
</AccordionGroup>

## Video Tutorial

Watch this video for a step-by-step walkthrough on enabling Login with Razorpay (SSO) on your Shopify store.

<iframe width="560" height="315" src="https://www.youtube.com/embed/VodJW26ehYI" title="Enable Login with Razorpay (SSO)" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />

## Enable Login with Razorpay Setup

Set up easy login into your website with single sign-on for your customers across the Razorpay network. To enable login with Razorpay setup:

1. Log in to the Dashboard navigate to **Magic Checkout** → **Setup & Settings**.
2. Navigate to **Login with Razorpay Setup**.
3. Turn on **Enable Login with Razorpay**.
   <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-enable.jpg" alt="Enable Login with Razorpay" width="500" />
4. You will be able to view the following options for the SSO widget:
   * [Settings](#settings)
   * [Customise](#customise)

<img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-settings.jpg" alt="Settings and customisation options on SSO" width="800" />

<Warning>
  **Watch Out!**

  If you have added a custom domain for the account page, SSO will not work. You must revert to the default domain for the SSO settings to function.
</Warning>

### Video Tutorial

Watch this video to know how to customise the Login with Razorpay (SSO) widget.

<iframe width="560" height="315" src="https://www.youtube.com/embed/8A7G7S0jUHA" title="Customise Login with Razorpay (SSO)" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />

### Settings

You can configure the following:

<AccordionGroup>
  <Accordion title="Where should we display login screen?">
    Select where you want to show the login screen, if the user is not logged in.

    <Warning>
      **Watch Out!**

      This is a multi select configuration, if a customer does not login the first time a login screen is dispayed, the login screen will reappear based on the options you select below.
    </Warning>

    * **The first page your customer sees**: Useful for encouraging early login during browsing. Select the checkbox and schedule when the login widget shows up (in seconds). For example, show the login widget 5 seconds after the page loads.
    * **When a customer adds their very first item to the cart**: Prompt login after the customer adds their first item to the cart. Select the checkbox and schedule when the login widget should show up (in seconds).
    * **When a customer begins the checkout process**: Display the login screen when they proceed to checkout, just before payment. Select the checkbox.
      * **Make Login mandatory pre-Checkout**: Ensure that users cannot proceed to checkout without logging in. Select the checkbox to enforce mandatory login.

    <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-display-login.jpg" alt="Display login screen" width="500" />
  </Accordion>

  <Accordion title="Ask consent from customer for marketing communication">
    Select how you want to seek permission from your customer for marketing communication.

    * **Single selector for Email, WhatsApp, and SMS**: Use one unified checkbox to capture consent for all three channels together.
    * **Separate selectors for Email, WhatsApp, and SMS**: Use separate checkboxes to capture consent for each channel individually.
    * **Do not ask for consent**: No explicit consent prompt is displayed for marketing communications.
          <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-ask-consent.jpg" alt="Ask consent from customer for marketing communication" width="500" />
  </Accordion>

  <Accordion title="Collect missing emails from everyone">
    You can choose to collect missing emails during the login.

    * **Email-Less Customers**: Allow users to log in without providing an email address.
    * **Collect Missing Emails (recommended)**: Prompt users to enter their email during login if it is not already available.
          <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-collect-emails.jpg" alt="Collect missing emails" width="500" />
  </Accordion>
</AccordionGroup>

After completing the configuration, click **Save Changes** to apply the updates.

<Info>
  **Handy Tips**

  The widget includes a consent prompt for users at the bottom, with terms and conditions listed.
</Info>

### Customise

Customise the widget to suit your brand. The default configuration flows from the configurations on checkout settings.

1. In the **Customise** section, the preview turns into edit mode. You can edit the following:

<Tabs>
  <Tab title="Widget Heading">
    Enter the widget heading as per your preference.

    <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-widget-heading.gif" alt="Edit widget heading" width="800" />
  </Tab>

  <Tab title="Emojis">
    Hover over the emoji you want to change and click the edit icon. Press `Command + Control + Space` to open the emoji picker and select your preferred emoji.

    <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-emoji.gif" alt="change emojis" width="800" />
  </Tab>

  <Tab title="Change Background Colour">
    Click **Change Background Colour** and choose a colour of your choice.

    <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-background-colour.gif" alt="Customise background colour" width="800" />
  </Tab>

  <Tab title="Change Button Colour">
    Click **Change Button Colour** and choose a colour of your choice.

    <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-button-colour.gif" alt="Customise button colour" width="800" />
  </Tab>

  <Tab title="Change Font">
    Click **Change Font** and choose a font of your choice from the drop-down list.

    <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-font.gif" alt="Change Font" width="800" />
  </Tab>
</Tabs>

2. Click **Save**.

<Info>
  **Handy Tips**

  * You can switch between mobile and desktop views to preview changes.
  * You can also preview how the widget will appear on **Live Mode**.

  <img src="https://razorpay.com/docs/build/browser/assets/images/cod-magic-sso-view-mode.jpg" alt="Mobile/Desktop view and Live Mode" width="500" />
</Info>

## Login Rewards

You can offer discounts or coupons to encourage customers to log in to your website.

<Info>
  **Handy Tips**

  This is an on-demand feature. Please raise a request with our [Support team](https://razorpay.com/support/#request) to get this feature activated on your Razorpay account. Ensure your coupon is created on the [Coupon Engine](/docs/payments/magic-checkout/shopify/features#coupons) and include the following details in your request:

  * Coupon code
  * A brief description
  * Any additional message you want to display
</Info>

### Related Information

* [Automatic Customer Tagging for Retargeting](/docs/payments/magic-checkout/login-with-razorpay/automation-tags)
* [Customer Analytics](/docs/payments/magic-checkout/login-with-razorpay/customer-analytics)
