Prefilling shipping details on Shopify cart page

Other Questions Shopify
1

I’m having trouble with a Shopify project. My client wants customers to enter their shipping address on the cart page. I added input fields to the cart form with names like checkout[shipping_address][address1]. It worked fine when I tested it.

But my client says it’s not working right. The fields are getting filled with info from past orders on other Shopify sites. This isn’t what we want.

Has anyone run into this before? How can I make sure only the info entered on our cart page gets used? Any tips on fixing this would be great.

Here’s a basic example of what I’m trying:

<form action='/cart' method='post'>
  <input type='text' name='checkout[shipping_address][address1]' placeholder='Address'>
  <input type='text' name='checkout[shipping_address][city]' placeholder='City'>
  <!-- More fields here -->
  <button type='submit'>Proceed to checkout</button>
</form>

What am I missing? Thanks for any help!

2

I’ve dealt with this exact issue before. The problem isn’t just browser autofill - it’s Shopify’s customer information system kicking in. Here’s what worked for me:

  1. Use unique field names that don’t match Shopify’s standard checkout fields. Instead of ‘checkout[shipping_address][address1]’, try something like ‘cart_shipping_address1’.

  2. Add a hidden input with name=‘attributes[custom_shipping]’ and value=‘true’. This signals to Shopify that you’re handling shipping info differently.

  3. In your theme’s cart.liquid, add some JavaScript to grab these custom field values and pass them to the checkout when the form submits.

This approach keeps Shopify from auto-populating fields while still allowing you to capture and use the shipping info. It takes a bit more setup, but it gives you full control over the process. Let me know if you need more specifics on implementation!

3

I’ve encountered this issue before. It’s not just about browser autofill, but also Shopify’s built-in customer data management. Here’s a workaround that’s worked for me:

Use unique field names that don’t match Shopify’s standard checkout fields. For example, instead of ‘checkout[shipping_address][address1]’, use something like ‘custom_cart_address1’.

Then, in your cart.liquid file, add some JavaScript to capture these custom field values when the form is submitted. You can then pass this data to Shopify’s checkout process using their Cart API.

This method prevents Shopify from auto-populating fields with past order information while still allowing you to capture and use the shipping details entered on your cart page.

It requires a bit more setup, but it gives you full control over the process and solves the issue your client is experiencing.

4

hey swiftcoder, sounds like a browser autofill issue. try adding autocomplete=‘off’ to ur form tag. like this:

that should stop browsers from filling in old data. let me kno if it works for ya!