Converting exisitng checkout custom code to app using Checkout UI Extensions

Retired Boards Appdev Extensions

Topic summary

A merchant needs to migrate two custom checkout features from the deprecated checkout.liquid to Checkout Extensibility:

Feature 1: Character Limit on Shipping Fields

  • Currently uses jQuery to restrict address fields to 35 characters maximum
  • Exploring three migration options:
    1. Shopify Functions
    2. Checkout UI Extensions
    3. Third-party address validator
  • Seeking guidance on which approach is most suitable long-term

Feature 2: Display Compare-at Prices

  • Shows original prices alongside sale prices for line items in checkout
  • Currently implemented via custom JavaScript in checkout.liquid
  • Needs conversion to app-based solution using Checkout UI Extensions

Status: The discussion remains open with no responses yet. The merchant is actively researching migration paths but requires expert direction on best practices for implementing these features under the new Checkout Extensibility framework.

Summarized with AI on November 13. AI used: claude-sonnet-4-5-20250929.
1

We are looking to move to Checkout Extensibility upgrade. Currently we have 2 features custom coded into the checkout which I believe when upgraded will need to be added as apps via Checkout UI Extensions.

Can anyone advise ‘exactly’ how to do this?

Details as follows -

Feature 1 - reduce characters in checkout shipping fields to max 35.

This is currently powered by the custom snippet in checkout-custom.liquid file

$(‘#checkout_shipping_address_address1, #checkout_billing_address_address1’).attr(‘maxlength’, 35);
$(‘#checkout_shipping_address_address1, #checkout_billing_address_address1’).on(‘input propertychange’, function() {
if ($(this).val().length > 35) {
$(input).val($(input).val().substring(0, 35));
}
});

Feature 2 - Show c’ompare at prices’ in checkout.
This is currently powered by the custom snippet in checkout-custom.liquid file

2

Still looking into the best way to do this - in particular reducing characters in shipping fields to 35.

Seems there are 3 options

  1. Do via Shopify functions

  2. Do via Extensions UI

  3. Use a third party adress validator.

Looking for direction on what would be the best option long term?