BACK

how to add a note about a few products in cart shopify

[2022 FREE] How To Add a CUSTOM NOTE field on your Shopify cart page? my name is andrew from ecom ex

Andrew from EcomExperts

Updated on Mar 25,2023

[2022 FREE] How To Add a CUSTOM NOTE field on your Shopify cart page?

The above is a brief introduction to how to add a note about a few products in cart shopify

Let's move on to the first section of how to add a note about a few products in cart shopify

Let TThunt's experts help you find the best TikTok product on your Shopify business!

Find TikTok products (It's Free)
No difficulty
No complicated process
Find winning products
3.5K Ratings

WHY YOU SHOULD CHOOSE TTHUNT

TThunt has the world's largest selection of TikTok products to choose from, and each product has a large number of advertising materials, so you can choose advertising materials for TikTok ads or Facebook ads without any hassle.

how to add a note about a few products in cart shopify catalogs

[2022 FREE] How To Add a CUSTOM NOTE field on your Shopify cart page?

my name is andrew from ecom experts dot,io and in this,video we're gonna make it so that you,can add some forms,into your cart and ask your clients,additional information like gift,messaging,or just extra like notes for the,delivery maybe,or just packaging notes in general we,already made a video on how to code in,your own,gift wrapping uh to your cart and you,can check that video over here,this video is going to be really more,focused on the actual,message so that your clients can,communicate to you all right enough,about that let's just jump straight into,it and then you'll see,what we can do so uh we're here,in the back end of the store and maybe,first let's look at how the store,currently looks um,there is a bit of loading here we go to,a,product we add it to cart we,view the cart and as you can see there,is,no room for adding any messages uh,there isn't any room in the checkout,either as long as you're not shopify,plus you can't,modify the checkout so this is,definitely not a shopify plus store,considering it's a demo store,so if it's not here you can't really add,it so,that beautiful camera film if i wanted,to add a note say,please um ship it,in with toilet paper i don't know i'm,running out of ideas here,then i can't communicate that to the,store owner but we're about to change,that,so um for that you are actually going to,go into the link in the description,below you click on it,and you're going to get the step-by-step,overview of what you need to do,we're going to walk through the same,step-by-step overview,right now so the full code and,instructions is below,and if you follow those instructions you,will see that we will give you a link,that looks like this one you go there,and this basically generates the code,for you so you don't have to,reinvent the wheel every time you can,select the type of your field that you,want here so let's say,we want to add a long text field so it,will look something like this,that the client so a long text field or,a very short text field it's up to you,or we can maybe do a radio button that,the client chooses,where it's gifts,is it use radio button,gifts not a gift i'm really running out,of ideas it's the end of the day here,so then people can choose oh this is a,gift or this is not a gift,um or what else do we have your drop,down so there's a bunch of things you,can choose from this,we're just going to keep it to the,classic text,actually we're going to do the long one,we're going to make it required and,we're going to name it right here,please give us instructions,um there you go then the code is,basically generated for,us right here so we're just going to,copy it to the clipboard,and then we're going to actually put,that into our store,now we go to online store right here and,as i say in all my coding videos this,is super important that you make a,duplicate of your theme,if you don't make a duplicate and you,make an error you are stuck,so step number one is back up and make a,duplicate don't work on a live version,to do that you click on actions right,here,and you click on duplicates,it's going to be creating a duplicate,by the way if you're worried about this,team score i made a video explaining,this report right here and what you can,do about it to change that,so check that out while this is,duplicating um,and it should be ready any moment oh,here we go,our duplication is ready so then what,we're going to do,is we're going to go in the code again,we're going to work on this,version not on the live version so click,on,actions right here and we go to edit,code,okay so once that is done we're now in,the code and we're going to go to the,search bar right here and we're going to,look,for the cards dot dash,template liquid file it should be in the,sections,so right here cart dash template when we,click on it,all the code appears and you will see,that normally if you scroll,through it you will find,form tags so the form should start with,this means that we're opening the tag,and it says form,and then the actions in the method so,this is the start of your form tag and,normally if your code is clean,at the exact same height so at this,height there should be the end at some,points,keep scrolling the edge should be,here and but that's the end of the table,oh there is the end of my form so right,here,so that's the end of my form so we want,to,paste it somewhere in between here you,can do a little bit of trial and error,because depending on where you're going,to post,paste it in here it's going to change,location on your cart page i am just,going,to post it at the very end so i'm going,to go right in front of the closing tag,of the form i'm going to press,enter a couple of times so there is a,couple of spaces created,and then i'm going to paste what we,copied from this,site right here so remember we clicked,copy,clip clipboard i can't talk for some,reason and we're going to paste,that in here now,i just like to make the spacing a bit,better,so that's just me,like that but don't worry too much,that's just the spacing for the styling,so it's a bit cleaner and then i'm also,going to do this,for a,the reason why i'm doing this is that,if another developer walks into this,they can,they understand what that piece of code,is for,because that's always good practice it's,not mandatory,what i'm doing here when it's grayed out,like that it means it's actually doesn't,count,it's counting as a comment in the code,so it's not really code it's just,as an instruction for anyone reading,this code,and this way when an another developer,after me walks into the code,they can kind of see it and be like oh,there is the start of,the code oh no that's not what i want to,do there is a start of the code for the,messaging card that's,this little code bit so if they want to,play with it they can easily remove it,or identify it and they immediately know,what,this is for that's why you always,comment your code it's just,you're keeping it clean that way but no,need to do it you can just,paste it right in just make sure that,when you paste it,so when you when you paste this whatever,you create here,when you paste it just make sure that it,is between this,and the beginning of the form right here,which,is this just make sure it's between,those,form tags by the way when you open,a tag it looks like this see this is a,tag that's being opened,and then when there is a uh forward,slash that means that the tag is being,closed,um so here you can see the form is being,opened the table,is being opened and at the very end,right here the,table is being closed and we keep on,going we're going to see that the form,is being closed right here anyway,what matters is that you put the code,that you copied between the form tags,once that is done you can save it right,here and then it's time to check out if,it worked,so for that we're going to go to the,online store,make sure remember we just worked on,this version right here because the last,save just now we have not touched this,one,so uh we're going to go into actions,we're going to close,all of this we're going to go into,actions,preview and normally our message,option should be available here in the,cart so we go into vintage camera,or whatever product we added to the cart,um oh we view in the cart right here,and there we go give us and please give,us instructions,and i can write whatever,i want here and the shop,owner will get the message,and then i can check out so it clearly,works now,our code is not alive just yet,so for our code to be live we actually,need to put,our theme life so for that once we,checked it we make sure it works the way,we want it we click on actions right,here,and we're going to go to publish it's,gonna ask us are you sure you want to,put,this version of your code alive so that,clients of yours can see it,yes i'm absolutely sure let's publish it,right now,and there we go that should be it now,on our live version so if we remove this,on our live,version uh we're going to see that the,message is accessible in the card,and so everyone oh my card is empty,and so everyone can uh can add a little,message to their,their order so there you go i hope that,helped,um i'm andrew again i do a whole bunch,of shopify video five videos my mission,is to,teach you teach my youtube subscribers,everything i know about shopify,when i'm wearing the green hoodie i'm,doing coding otherwise i do app reviews,i talk about shopify strategy and,marketing i talk about a whole bunch of,stuff shopify related so make sure to,like and subscribe,if you enjoyed this content it really,really makes the world to me,means the world to me these videos take,a long time to make,anyway my name is andrew from e-com,experts dot io i hope you enjoyed it and,i see you in another video i just

Congratulation! You bave finally finished reading how to add a note about a few products in cart shopify and believe you bave enougb understending how to add a note about a few products in cart shopify

Come on and read the rest of the article!

Browse More Content