> ## Documentation Index > Fetch the complete documentation index at: https://codking.tech/documentation/llms.txt > Use this file to discover all available pages before exploring further. # Customer Experience and Branding > Control the Pay via screen your shoppers see: show or hide partial payments, rename the headings, edit fee and discount badges, set the no-option message, and test it as a shopper. The Partial Payment options appear on the **Payment screen** of the COD King popup. The words, badges and branding of that screen are edited in **UI customization**, with a live preview next to the form. ## What your shopper sees When a shopper taps **Buy it now** (or **Buy with COD**) on a product, the COD King popup opens on the **Pay via** screen. Every partial payment rule that applies to the cart is listed as one row, with the amount due now on the right. ![Storefront Pay via screen showing Full Payment, Pay 100 now rest on delivery and Cash on Delivery](https://mintcdn.com/codking/MIAdwRjgvA7ZK7tO/images/pp-70-storefront-pay-via.png?fit=max\&auto=format\&n=MIAdwRjgvA7ZK7tO\&q=85\&s=4a031ed8d0e4685a3d107c5efcc4d38f) In this example (a Rs. 885.95 product on the test store) the shopper sees three options: * **Full Payment**: pay Rs. 797.36 now and save 10%. The original price is struck through and a green **Save 10%** badge is shown. * **Pay 100 now, rest on delivery**: pay Rs. 100 now and the remaining Rs. 785.95 on delivery. * **Cash on Delivery**: pay Rs. 885.95 on delivery. The logo at the top is the **Brand Logo URL** from **Logo and colours** in UI customization, so changing it there changes it on this screen. > [!TIP] > > A percentage or fixed partial rule needs a product with a price. On a Rs. 0 product, the rule has nothing to split and no partial option appears. ## Open UI customization **1. Go to Settings → UI customization** ![UI customization landing page](https://mintcdn.com/codking/3AT9vvckoZ2DkeHY/images/pp-60-uicust-landing.png?fit=max\&auto=format\&n=3AT9vvckoZ2DkeHY\&q=85\&s=3053ab71cc40a1cda33ed9ae14800f32) **2. Click Customize** A full-screen editor opens with tabs: **Logo and colours**, **Order summary**, **Delivery address**, **Coupons**, **Pop-up messages**, **Phone number screen**, **Verify code screen**, **Payment screen**, **Where it runs** and **Advanced**. **3. Open the Payment screen tab** Partial Payment text lives here. > [!NOTE] > > The text boxes in the editor become editable once OTP verification is switched on for your store. While it is off, they show the default text greyed out. Blank boxes keep the default wording, and `{{curly braces}}` fill in automatically. ## The live preview The right-hand **Live preview** shows exactly what a shopper sees. It is a safe sandbox: nothing is sent to customers, and no discounts or orders are created. The test OTP is `1234`. ![Payment screen editor and the live preview of the Pay via list](https://mintcdn.com/codking/3AT9vvckoZ2DkeHY/images/pp-64-uicust-payment-wide.png?fit=max\&auto=format\&n=3AT9vvckoZ2DkeHY\&q=85\&s=2b9b44112e6de8fa6af18a6228d1533d) In this example the shopper sees three rules from top to bottom: **Full Payment** (pay ₹1,079.1 now with a green *Save 10%* badge), **pay 100 now, rest on delivery** (₹100 now, ₹1,099 on delivery) and **Cash on Delivery** (₹1,199 on delivery). ## Show partial payments At the top of the Payment screen tab is a switch called **Show partial payments**. It adds the payment options card to the popup. *The options themselves come from your partial payment rules.* A **Go to Partial payments** link takes you back to the rules. > [!WARNING] > > If you switch **Show partial payments** off, shoppers do not see the payment options card at all, even though your rules are still saved. ## Payment list text ![Payment list heading and messages](https://mintcdn.com/codking/3AT9vvckoZ2DkeHY/images/pp-61-uicust-payment-list.png?fit=max\&auto=format\&n=3AT9vvckoZ2DkeHY\&q=85\&s=417fa1a142846e789f4fde25fc560211) | Field | Default | When the shopper sees it | | :- | :- | :- | | **Heading** | Pay via | Above the list of ways to pay. | | **Line under the heading** | Enjoy fast delivery on all prepaid orders | A selling line under the heading. Change it to push your deposit option. | | **No options available** | No payment options available at the moment | No payment options exist at all. | | **No option fits this cart** | No payment option applies to your cart. You can close this window and try again. | The cart matches none of your payment rules (see [Who sees a rule](https://codking.tech/documentation/partial-payment/rule-conditions.md)). | ## Badges Small labels on each payment option. ![Fee badges section](https://mintcdn.com/codking/3AT9vvckoZ2DkeHY/images/pp-62-uicust-fee-badges.png?fit=max\&auto=format\&n=3AT9vvckoZ2DkeHY\&q=85\&s=921f70a02d2692a582a0b2b3e9fa7b3c) ![Shipping charge and tax badges](https://mintcdn.com/codking/3AT9vvckoZ2DkeHY/images/pp-63-uicust-badges2.png?fit=max\&auto=format\&n=3AT9vvckoZ2DkeHY\&q=85\&s=106c590997c72563f49c629d3c29d1fb) | Badge | Default text | Shown when | | :- | :- | :- | | **Cash on delivery fee** | `+{{amount}} COD fee` | A COD rule has a COD charge. `{{amount}}` is the fee. | | **Free delivery** | Free Delivery | A rule has **Offer free delivery** ticked. | | **Returning customer offer** | Returning customer offer | A returning customer gets the [extra discount](https://codking.tech/documentation/partial-payment/rule-pricing-and-display.md#extra-discount-for-returning-customers). | | **Shipping charge** | `+{{amount}} Shipping` | A rule has a shipping charge. | | **Tax** | `+ tax {{amount}}` | Tax is shown separately. | There are also **Discount badges** (for example `Flat {{percent}}% Off` for a percentage discount) below these. ## Branding Under **Logo and colours** you can add your logo and store name so the popup looks like your store. You can also add a promotional banner (for example *Get 50% OFF on Your 2nd Order*) and match its colours to your brand. ## Test as a shopper **1. Open your store** If your store is password-protected, enter the password first. **2. Use a product that fits your rules** Choose a product that is in stock and passes the product and cart-value conditions of the rule you are testing. **3. Press the buy button and fill the popup** Enter a delivery address (and a phone number and OTP if verification is on). **4. Check the Pay via screen** You should see one line per qualifying rule, in the same order as your rules list, with the amounts and badges you set. **5. Place a small test order if you need to** Choose the deposit option and pay the upfront amount. Then open the order in Shopify and the COD King analytics to confirm it was recorded (see [Analytics](https://codking.tech/documentation/partial-payment/analytics.md)). > [!TIP] > > Test **each** rule at least once, and test a cart that matches no rule so you see your *No option fits this cart* message. This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.