Custom field at checkout

Andre10
New Member
1 0 0

I need to add a custom field at checkout that is a requirement to continue with there order. i will also need to use the content of this field for monthly reporting i.e. export order then sort by the content filled into this field by customers

Replies 16 (16)
Nick
Community Moderator
Community Moderator
4503 431 974

Hi Andre, 

Nick here from Shopify. 

There is a way to add a custom field at checkout and make it a requirement to continue with an order. Shopify actually has an advanced tutorial on how to do this which you can see by clicking here. Just to note, this is an advanced tutorial which is not supported by Shopify and would be for someone who has very high developer skills. If this is something you don't feel comfortable with, your best bet would be to reach out to a Shopify Expert directly to implement this as a small task. 

Regarding the reporting side of things. The ability to add a custom report is available from the Shopify advanced plan or above, but adding a new custom field is something which is not possible at this time. I will definitely let our team know about this and add it as a feature request on your behalf. 

All the best. Nick

Nick | Community Moderator @ Shopify (OOO until June 14th)
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

Jonathan-HA
Shopify Partner
217 10 66

Hi Andre,

For the reporting part, our app EZ Exporter can help with this.  The custom fields at checkout are normally captured in Cart Attributes (also known as "Note Attributes") or Line Item Properties.

Our app supports exporiting of both Cart Attirubtes and Line Item Properties.  Each custom cart attribute or line item property can be placed in a separate column in the CSV generated by our app.

Please feel free to reach out if you have any questions on this.

Co-Founder / Developer at Highview Apps
Our Shopify Apps: EZ Exporter | EZ Inventory | EZ Importer | EZ Notify | EZ Fulfill
EliMash
New Member
2 0 6

But the tutorial you pointed out is for adding a field to the cart not to the checkout page.

Is there a way to add a field to the checkout-page?

gina-gregory
Shopify Expert
727 49 196

@EliMash There is, but only if your shop is on Plus and has access to the checkout.liquid file.

komalk
New Member
1 0 0

Yes, i have Shopify plus account and have access to checkut.liquid But in  my theme, checkout file is named with : elevar-checkout-end.liquid PLease let me know next steps how I can add 3 radio buttons on checkout. And Final selected radio button value will be visible somewhere to admin. Please help.
 

lunsay
Excursionist
20 0 1

BEST SOLUTION!

lunsay
Excursionist
20 0 1

@Nick wrote:

Hi Andre, 

Nick here from Shopify. 

There is a way to add a custom field at checkout and make it a requirement to continue with an order. Shopify actually has an advanced tutorial on how to do this which you can see by clicking here. Just to note, this is an advanced tutorial which is not supported by Shopify and would be for someone who has very high developer skills. If this is something you don't feel comfortable with, your best bet would be to reach out to a Shopify Expert directly to implement this as a small task. 

Regarding the reporting side of things. The ability to add a custom report is available from the Shopify advanced plan or above, but adding a new custom field is something which is not possible at this time. I will definitely let our team know about this and add it as a feature request on your behalf. 

All the best. Nick


BEST SOLUTION

smartmall
Tourist
24 0 0

Hi Andre 

Hope you are well 

 

Just would like to know if you have managed to find a solution to this issue regarding additional fields at checkout.

I also require exactly the same. Will appreciate any assistance.

 

ahxan07
Tourist
5 0 1

Hi @smartmall 
Hope you received this is good health.

just want to know that have you find a solution for this or not. Stucked with the same problem!
Any help will be appreciated!

smartmall
Tourist
24 0 0

Hi 

 

I bought a new theme that can be customized for about $50.00 . And the developers are adding custom fields at the cart section . So when a customer adds a particular type of product to the cart, At that stage they will be prompted to complete the relevant fields . Or else they cant continue with the purchase.

Still busy with it though. 

 

Thanks

Yusuf 

 

KristinL
New Member
2 0 0

Hi there,

is there any solution anything i can do, when I am not Shopify Plus yet.

I know liquid file option is only possible with plus.

Any app or other solution, when I am required to have a field or check box for tax ID (necessary for B2B).

Thanks in advance!

Kristin 

smartmall
Tourist
24 0 0

Hi Their !

 

I would recommend you request the developers of your theme to make the necessary changes. That's what I did , they charged about $30 for a few small fields that I needed to be added. 

 

Regards

Yusuf

ToledoX82
Excursionist
31 1 15

Hi @KristinL 

I can do it for you, I sent you a private message.

 

 

Shopify Expert, Problem Solver, Designer and Frontend Developer @ Toledo Interactive / Click2it Digital / Wise Pirates / Shopify Builders
[PT] Minha resposta foi útil? Clique em Curtir para eu saber!
[PT] Sua dúvida foi solucionada? Clique em Aceitar Solução na minha resposta.

[EN] Was my reply helpful? Click Like to let me know!
[EN] Was your question answered? Mark it as an Accepted Solution.
KristinL
New Member
2 0 0

Hi there. We were waiting too long to get help for this job. Before we did also not get proper answers as well. We will for sure need hlep in the future. But for the described topic we are done and I will delete that job. Have a good day!

TakiPets
New Member
2 0 0

HI, 

 

for those who are looking to looking for a sort of work around to this solution, one way is to tweak the flow of your customer's experience. 

 

This solution work for all tiers and do not require any additional add on or cost, just some basic tweaks to the codes. So if you have a basic understanding of how to edit the theme codes, here's what I did. 

 

First set up your form in the cart.

Depending on the theme you're using, the easiest way is to

  1. open up theme editor
  2. use Shopify's code generator
  3. create the fields you need
  4. locate main-cart-items.liquid or cart.liquid file
    1. This file should have the following </form>
    2. click within the code editing box and use CTRL F to look for it
  5. copy and paste the codes generated right before </form>
  6. save and preview

Next, we need to remove the steps where the customers might skip the cart and go straight into check out

  1. Remove dynamic check out button
    1. Once again, this depends on whether you're using a 2.0 theme or not. 
    2. For 2.0 themes
      1. go to online store
      2. customize
      3. select product page from the middle drop down menu found right at the top of the page
      4. in the left panel open up product information, look for buy button, uncheck dynamic checkout button.
      5. TakiPets_0-1644388201488.png

         

    3. Legacy theme
      1. go to online store
      2. customize
      3. select Product pages in the drop-down page menu, slightly left, to the top of the page. 

      4.  

        scroll to Sections > Product > Dynamic Checkout Button

      5. uncheck the "Show dynamic checkout button"

Editing the pop up cart menu

if your theme have a pop up/slide cart menu here what you need to do.

  1. in your theme editor locate either cart-notification or cart-drawer
  2. use ctrl F to locate checkout
  3. copy the class attributes here
  4. remove the sections between <form> & </form>
  5. replace the CC Class of routes.cart_url to "button button--primary button--full-width" or the one you copied earlier
  6. open up component-cart-notification.css
  7. locate .cart-notification__links
    1. change text-align:centre to text-align:left