---
updatedAt: 2026-06-02T19:46:20.000Z
agentTools:
  projectIndex: https://checkout-docs.transfi.com/llms.txt
---

# Alternative Entry Flow : Pay by Link

Pay By Link is an alternative checkout flow where a merchant creates a payment link via the TransFi API or Dashboard, receives a hosted URL, and shares it directly with their customer.

The customer opens the link and completes the payment through the TransFi-hosted checkout widget.

# Create Payment Link

You can generate a payment link in two ways:

* Option A: Create from Dashboard
* Option B: Create via API

# Option A: Create from Dashboard

Generate payment links manually without writing any code.

1. Navigate to the Transactions page in your TransFi Dashboard.
2. Click the Create Payment Link button on the top right

   ![](https://files.readme.io/28d5b4bc68cb05735413499a4302a6250a83662e637fc362eac11b2dc2bdf0c5-image.png)
3. Fill in the required product and customer details.
4. Copy the generated URL from the success modal and share it with your customer via email, SMS, or chat.

   ![](https://files.readme.io/d4b83ab293df105ab1d1f8ce5fd3f13a39960fdffd13729ab44de78bc1598d09-image.png)

# Option B: Create via API

Programmatically generate payment links to share across your own communication channels.\
You can check the API details here: [Create Payment Invoice API](https://transfi-checkout.readme.io/reference/createpaymentinvoice)

## Endpoint

```http
POST /checkout/payment-link/invoice
```

## Headers

```http
Content-Type: application/json
x-api-key: pk_sandbox_<your_public_key>
x-timestamp: <unix_timestamp_ms>
x-signature: <hmac_signature>
X-Api-Version: v1
```

## Request Body

```json
{
  "paymentLinkId": "69c39577e1a0100cf92c3406",
  "amount": "100",
  "currency": "EUR",
  "productDetails": {
    "name": "Premium Product",
    "description": "High quality product",
    "imageUrl": "https://example.com/product-image.jpg"
  },
  "individual": {
    "firstName": "John",
    "lastName": "Doe",
    "email": "john@example.com",
    "phone": "9876543210",
    "phoneCode": "+1",
    "country": "US"
  },
  "inpss": {
    "city": "Mountain View",
    "state": "California",
    "street": "1600 Amphitheatre Parkway",
    "postalCode": "94043"
  },
  "dob": "17-01-1998",
  "paymentCode": "pipay",
  "channel": "payment link",
  "successRedirectUrl": "https://your-app.com/payment-success",
  "failureRedirectUrl": "https://your-app.com/payment-failure",
  "customerOrderId": "order-12345",
  "lng": "en"
}
```

# Response

```json
{
	"success": true,
  "data": {
    "success": true,
    "paymentUrl": "https://qa:checkout-widget-transfi.com/checkout/payment-link/6a0100000000000000000"
  }
}
```

# Understanding the flow

<Image align="center" border={true} src="https://files.readme.io/9c072fc7d9c090450cc1b20c345525caafbf16dcc56419c72fc1a8203c2e4056-image.png" className="border" />

<br />

# What the Customer Sees

When the customer clicks the `paymentUrl`, the checkout widget loads dynamically based on the data provided.

The widget utilizes a smart branching flow to minimize friction for users.

## Complete Customer Data

If the `individual` object is fully populated, the User Details screen is skipped, and the customer goes straight to the payment initiation screen.

## Incomplete Customer Data

If required fields (like Name or Email/Phone) are missing, the customer is prompted to fill out the User Details form first.

## Pre-selected Payment Methods

If a valid `paymentCode` is passed and the pre-filled data satisfies the required fields for that specific method, the Additional Details page is bypassed automatically.

***

# Page Descriptions

| Route                                       | Component                             | Shown When                                    |
| ------------------------------------------- | ------------------------------------- | --------------------------------------------- |
| /checkout/payment-link/\[invoiceId]         | — (orchestrator)                      | Always (logic only)                           |
| /checkout/user-details                      | UserDetailsFormContent                | `individual` fields are incomplete or missing |
| /checkout/payment-initiate                  | ProductCheckoutPage                   | After user details are ready                  |
| /checkout/payment-methods                   | PaymentMethodsContent                 | No `paymentCode` pre-selected                 |
| /checkout/payment-method-additional-details | PaymentMethodAdditionalDetailsContent | Method requires extra fields                  |
| /checkout/confirm-order                     | ConfirmOrderContent                   | Before final payment submission               |
| /checkout/payment-processing                | PaymentProcessingContent              | After order submitted                         |
| /checkout/payment-completion-status         | PaymentCompletionContent              | Final result page                             |

<Callout icon="📘" theme="info">
  After you have the payment URL, continue to Step 4 →
</Callout>

<br />

<br />