--- page_title: Enabling CRED Saved Cards product: CRED Saved Cards page_source: https://juspay.io/in/docs/cred-saved-cards/docs/cred-saved-cards/enabling-cred-saved-cards llms_txt: https://juspay.io/in/docs/llms.txt product_llms_txt: https://juspay.io/in/docs/cred-saved-cards/llms.txt --- # Enabling CRED Saved Cards > **Warning** > Select your integration from the **Frontend** dropdown above👆 — **Juspay HyperCheckout (Payment Page)** or **Express Checkout SDK** and follow the steps accordingly. ### Step 1. Get Your Build Hash Whitelisted by the CRED Team Before you begin integration, [get your app whitelisted with CRED.](/cred-saved-cards/docs/cred-saved-cards/get-your-build-hash-whitelisted-by-the-cred-team) --- ## Integration type : Juspay Express Checkout SDK ### Step 2. Check CRED app availability Call `containerAvailability` on page load, before rendering any payment options. This is a client-side check no Juspay backend call is made. * See the [containerAvailability reference](/cred-saved-cards/docs/cred-saved-cards/container-availability-check) the full request and response schema. * If `credAppPresent` is `false`, stop here and render your payment page normally without any CRED elements. * If `credAppPresent` is `true`store `credDeviceId` and `credAuthCode` from the response. You pass them to the eligibility check in [step 3](/cred-saved-cards/docs/cred-saved-cards/enabling-cred-saved-cards#step-3-check-card-eligibility). > **Note** > On Android, the response returns a **device ID** and an **auth code** . > > On iOS, the auth code and device ID are returned only for repeat users who have previously paid with this mode. ### Step 3. Check card eligibility The eligibility check asks CRED whether to show cards for this user. * Call the eligibility check using [containerEligibility (SDK)](/cred-saved-cards/docs/cred-saved-cards/containereligibility-sdk) from your app, or [(containerEligibility S2S)](/cred-saved-cards/docs/cred-saved-cards/containereligibility-s2s) from your backend server. Use one, not both. * The response varies based on the user's eligibility, indicated by the `card.state` field _(explained in below table)_ . There are three possible states, and each one maps to a different UI on your payment page: | card.state | What it means | Response contains | What you render | |---|---|---|---| | LINKED_INSTRUMENT | The user has linked their CRED cards and given consent | instruments: array of card objects. nudge is null | Show the cards with the Powered by CRED label. Store each instrumentId for the transaction call. | | ELIGIBLE_TO_LINK | The user can use CRED but has no linked cards yet (no consent, or first time on iOS) | nudge: link prompt object. instruments is null | Show the Link and Pay prompt from the nudge content. On tap, call containerTxn without flow_data. | | INELIGIBLE | Do not offer CRED to this user | Both instruments and nudge are null | Nothing. Render the payment page with no CRED elements. | #### Response - If Cards are linked Code Snippet: ```response - if cards are linked { "card": { "state": "LINKED_INSTRUMENT", "instruments": [ { "type": "CREDIT_CARD", "priority": 0, "par": "card_par_value", "maskedCardNumber": "XXXX-XXXX-XXXX-9871", "issuerLogoUrl": "bank_logo_url", "instrumentId": "instrument_id_value", "cardIssuer": "Bank Name", "brandLogo": "card_brand_logo_url", "brand": "VISA" } ] } } ``` #### Response - If No cards are linked Code Snippet: ```response - if no cards are linked { "card": { "state": "ELIGIBLE_TO_LINK", "nudge": { "icon": "icon_logo_url", "text": "text if any", "sub_text": "sub text if any", "title": "Add cards from CRED" } } } ``` #### Response - If User is ineligible Code Snippet: ```response - if user is ineligible { "card": { "state": "INELIGIBLE" } } ``` ### Step 4. Display CRED cards on the payment page Expected result: The user sees their CRED cards (or a Link and Pay nudge) on your payment page. Render based on `card.state`: * `LINKED_INSTRUMENT`: Display the returned cards alongside any cards saved directly with you. Mark each CRED card distinctly with a "**Powered by CRED** " label and the "**CRED logo"** so the user can tell them apart. * `ELIGIBLE_TO_LINK`: Display the Link and Pay nudge using the `nudge` object (`title`, `text`, `sub_text`, `icon`). * `INELIGIBLE`: Do not show any CRED card or nudge. ### Step 5 Initiate CRED Saved Cards transactions Invokes the CRED app to authenticate and complete payment, then returns the transaction status in a callback. * Call `containerTxn`. The SDK invokes the CRED app on the device, where the user authenticates with biometrics, sees the OTP screen, and completes payment inside the CRED app. See the [containerTxn](/cred-saved-cards/docs/cred-saved-cards/containertxn) for the full schema. * If the user selected a card shown on your payment page (saved card flow), include `flow_data` with the card's `instrument_id` After the SDK callback, always verify the final status server-side using the [Order Status API.](/cred-saved-cards/docs/cred-saved-cards/order-status) --- ## Integration type : Juspay HyperCheckout (Payment Page) ### Step 2. Juspay Config Changes * [Login](https://portal.juspay.in/marketplace?id=de72c170-22c8-4536-b3db-e1b6e8758eff&name=DOTP) to Juspay Dashboard and navigate to Marketplace tab to get the CRED Saved Cards enabled on your Juspay payment page * Juspay will release these changes in testing environment (CUG) for you to initiate the end to end testing on your app / website --- ## See Also - [PA/PG Set Up](https://juspay.io/in/docs/cred-saved-cards/docs/cred-saved-cards/pa-pg-set-up) - [Go-live](https://juspay.io/in/docs/cred-saved-cards/docs/cred-saved-cards/golive)