Hide elements using Checkout UI Extensions

[Bonipher22]

Hi, I am trying this checkout extensibility for shopify checkout page. I just want to know if it's possible to edit the existing or default elements of shopify checkout page? I want to hide some elements, which are the "discount form" and the "estimated date" in the shipping method. But, I can't do it using reactJS because I have no access to the DOM components. Is there any other way to do this? Thank you for your answer in advance.

[nboliver-ventureweb]

No, there is no way to modify existing elements

[ShamiqTheDev]

Also please consider customization features such as modifying the city input field on the checkout information step.

I intend to make the city input field a dropdown through the Shopify extension, however, according to my research it isn't possible to hide the input field and overwrite it, or customize it in any way.

[jarthorn]

@ShamiqTheDev we would love to learn more about why you want to convert the city field into a drop down. Is this a requirement in particular geographic regions? Is it because the merchant wants to restrict buyer destinations, or because of conversion or fulfillment concerns if the field is free-form?

[swshamiq]

@jarthorn Yes because of fulfillment automation concerns, as the field is free-form, some customers enter the cities in their language or make typos in this case the customer support team has to work on it manually and then proceed with the order.

We have the bulk of orders each day and to handle mistaken customer cities a lot of workforce will be required which is not an ideal solution.

Do you have any alternative solution for it?

[jarthorn]

The alternative available today is to do validation on the input to make sure it is correct, and block the buyer from progressing with an incorrect city value. We have both client and server-side solutions for doing this kind of validation (details). I realize the dropdown approach is preferable in some cases because it reduces friction for buyers, especially in regions with many buyer languages.

[tomamihaiadrian]

any news on this one?

[UmarWafer]

any updates on this one?

[amoyano]

I need to hide product images on checkout, is it possible?

[jarthorn]

Converting city and neighbourhood fields into drop-downs is now on our public roadmap, but we are still exploring solution approaches. If you are waiting for this one, please continue to add here any explanation why you find this solution necessary rather than relying on auto-complete and validation (I know some of the reasons but it helps to hear this directly from you to confirm it).

[nboliver-ventureweb]

@jarthorn Certain types of product such as frozen foods have a very specific ship window where they will stay fresh. In cases like that, a merchant may have a specific list of cities they ship to, based on where the shipping company can deliver to within the specified timeframe. If you are validating against a city name, validation logic becomes complex once you have cities that have multiple ways of being spelled. Many towns in Quebec fall into this category; for example: Sainte-Agathe-des-Monts can also be written St. Agathe des Monts, etc. From both a user experience, and shop administration experience perspective, selecting the city from a predefined list is preferable.