# Sezzle

### Step 1: Login and navigate to the funnel on which to add Sezzle <a href="#sezzle-checkoutchamp-step1-loginandnavigatetothefunnelonwhichtoaddsezzle" id="sezzle-checkoutchamp-step1-loginandnavigatetothefunnelonwhichtoaddsezzle"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FpCUT5Waf6FyoPvCV63st%2Fimage.png?alt=media&#x26;token=2fb4260a-9811-468e-ad87-ae5f28ef96bf" alt=""><figcaption></figcaption></figure>

***

### Step 2: Click the gear button on the top left to open Settings <a href="#sezzle-checkoutchamp-step2-clickthegearbuttononthetoplefttoopensettings" id="sezzle-checkoutchamp-step2-clickthegearbuttononthetoplefttoopensettings"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FBeKJ4SHPCbN7Ju6QkJno%2Fimage.png?alt=media&#x26;token=62257997-26f7-44a1-8b4c-3b5d61116fcb" alt=""><figcaption></figcaption></figure>

***

### Step 3: Open the Payments section <a href="#sezzle-checkoutchamp-step3-openthepaymentssection" id="sezzle-checkoutchamp-step3-openthepaymentssection"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FUQAT0nOQQGKsGQLdm5s9%2Fimage.png?alt=media&#x26;token=56dc4e8b-0c04-4c94-9620-41d3118e1a3d" alt=""><figcaption></figcaption></figure>

***

### Step 4: Add new Sezzle gateway credentials <a href="#sezzle-checkoutchamp-step4-addnewsezzlegatewaycredentials" id="sezzle-checkoutchamp-step4-addnewsezzlegatewaycredentials"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FPKEdDL0VgXkZPx92tXkZ%2Fimage.png?alt=media&#x26;token=98873919-d0e7-4240-a648-62b785111776" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FgAqFOFIRcAw92F7hnfl1%2Fimage.png?alt=media&#x26;token=34bdd9e4-6204-488b-a3ec-19da79b5e94e" alt=""><figcaption></figcaption></figure>

Enter a **Gateway Title** to easily identify the Sezzle account. Then add the **public\_key** and **private\_key** obtained from your Sezzle account. Add **Limits** and also the **Merchant Descriptor** and **Mid #**

***

### Step 5: Save and Continue <a href="#sezzle-checkoutchamp-step5-saveandcontinue" id="sezzle-checkoutchamp-step5-saveandcontinue"></a>

***

### Step 6: Edit Checkout page and add the Sezzle button <a href="#sezzle-checkoutchamp-step6-editcheckoutpageandaddthesezzlebutton" id="sezzle-checkoutchamp-step6-editcheckoutpageandaddthesezzlebutton"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FVPZ4w4x0B8fGf1JZ5Cpm%2Fimage.png?alt=media&#x26;token=a1bcc023-5085-4a67-ab9f-be543ed2c0ac" alt=""><figcaption></figcaption></figure>

### Button <a href="#sezzle-checkoutchamp-button" id="sezzle-checkoutchamp-button"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2F3PtfVLydi9GXw19mdFow%2Fimage.png?alt=media&#x26;token=f65308cb-fdb6-4448-8a02-4b5d480d7584" alt=""><figcaption></figcaption></figure>

#### Step 6-1: Customize button size by clicking on the button and dragging the highlighted corners or use Dimension tab for advanced edits. Under the Settings for the element, be sure the Action is set to *Submit + Route* <a href="#sezzle-checkoutchamp-step6-1-customizebuttonsizebyclickingonthebuttonanddraggingthehighlightedcorner" id="sezzle-checkoutchamp-step6-1-customizebuttonsizebyclickingonthebuttonanddraggingthehighlightedcorner"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FdfvffYTo4Cu1ZkbNqI8e%2Fimage.png?alt=media&#x26;token=e674228b-3494-46fa-b787-ff0d2b52eb82" alt=""><figcaption></figcaption></figure>

### Radio <a href="#sezzle-checkoutchamp-radio" id="sezzle-checkoutchamp-radio"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FPqTF0LBpm7Zow7KbxgHC%2Fimage.png?alt=media&#x26;token=0e455b9b-3bb4-4e00-84db-024f1f942cf3" alt=""><figcaption></figcaption></figure>

#### Step 6-1(radio): Add a radio button to the page. You may design this to your preference. <a href="#sezzle-checkoutchamp-step6-1-radio-addaradiobuttontothepage.youmaydesignthistoyourpreference" id="sezzle-checkoutchamp-step6-1-radio-addaradiobuttontothepage.youmaydesignthistoyourpreference"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2F3GNj23DtXBkk36QSJYsc%2Fimage.png?alt=media&#x26;token=568c6c86-5795-4d2a-a288-17218f33c292" alt=""><figcaption></figcaption></figure>

#### Step 6-2(radio): Select the radio button and change the settings so the Name is “payment\_method”. This may also be used with the payment toggler by setting the name to “fk-payment-option-toggler“. Then set the Value of the radio button to the name of the pay source in all caps. <a href="#sezzle-checkoutchamp-step6-2-radio-selecttheradiobuttonandchangethesettingssothenameis-payment_metho" id="sezzle-checkoutchamp-step6-2-radio-selecttheradiobuttonandchangethesettingssothenameis-payment_metho"></a>

{% hint style="warning" %}
Use either all buttons or radios for pay source selection to mitigate any conflicts
{% endhint %}

***

### Step 7: Save the page. Exit the page builder. <a href="#sezzle-checkoutchamp-step7-savethepage.exitthepagebuilder" id="sezzle-checkoutchamp-step7-savethepage.exitthepagebuilder"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FAn1GvesKT509mEeJNDYC%2Fimage.png?alt=media&#x26;token=f16bf780-9733-4d98-bec5-426efd905fe4" alt=""><figcaption></figcaption></figure>

***

### Step 8: Choose the Sezzle button on the arrow leaving the checkout page. <a href="#sezzle-checkoutchamp-step8-choosethesezzlebuttononthearrowleavingthecheckoutpage" id="sezzle-checkoutchamp-step8-choosethesezzlebuttononthearrowleavingthecheckoutpage"></a>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2F4VgsJLgZGp0vsPwCnvIQ%2Fimage.png?alt=media&#x26;token=96821f2f-a7fb-45bc-9765-a8c9930aa5dc" alt=""><figcaption></figcaption></figure>

### Step 9: Publish. You’re done and ready to test! <a href="#sezzle-checkoutchamp-step9-publish.youredoneandreadytotest" id="sezzle-checkoutchamp-step9-publish.youredoneandreadytotest"></a>

{% hint style="warning" %}
Customer info fields are required for this alternate payment method.
{% endhint %}
