Add a Note Field To Products in Shopify 2.0 - Gifts, Engravings, Customizable Products...
all right what's up guys today i'm going,to show you how to accomplish a very,common task in shopify this is for,stores that sell gifts like maybe it's,something with an engraving maybe it's a,bouquet of flowers maybe it's a gift box,like this either way customers need to,input some kind of,message some kind of note attached to,the gift or the text that's used for the,engraving whatever and this is another,one of those things that you can use an,app for but you can also just do it,easily enough,by writing just a little bit of code you,can copy and paste my code and you can,totally avoid having to install and pay,for an app and it's gotten even easier,with shopify 2.0 okay so we're just,going to be using the custom liquid,block type and we won't even have to,edit the theme or template code in that,case now one more thing that i want to,clarify is that the advantage of having,this message field this note field on,the product page is that the note gets,attached to each individual product so,you know you might already have a note,field on the cart page right but this,attaches the note to the entire order,and what happens if a person orders like,companies often do this they order a,gift for like 10 of their employees,and each gift needs to have a different,message right so in that case that's why,we need to put the message field on the,product and not on the entire order and,it will come through in your shopify,admin like this as you can see under,each product we have,a note and there it will be different,for each product so this works well for,large,uh company orders this tutorial is going,to be using dawn theme,and any variants of dawn so all of the,shopify,free themes that are,for os 2.0,uh they're all actually just dawn theme,as well with different presets okay so,this tutorial is going to work for them,if you're not using dawn it's going to,be a little bit more difficult for you,but i'm still going to explain what you,need to do and i think that you should,be able to figure it out it'll be almost,the same except there will be a few,differences in,the classes that you use for,the,look of the field and also the id of the,form almost everything else is going to,be the same and i'm going to walk you,through that as well on one last thing,if you want to copy and paste any of the,code that i use in this tutorial,you will find it all on my website,ed.codes under the tutorials link and,here i share the entire finished code,and just a quick summary of the steps,that we take and yeah that's all let's,get started i'm just going to hide the,field that i've already built okay so,we're going to start from scratch you,can code along with me we're going to,add a block,custom liquid block,and here it is,let's just type test so that we can see,where it appears on the page,and we can drag it to where we want it,to be so i want mine to be under the,quantity selector but above the buy,buttons and the first thing we're going,to do is to add a text area okay this is,a
Let's move on to the first section of curly-glory theme shopify
HOW TO CUSTOMIZE CRAVE SHOPIFY THEME | SHOPIFY CRAVE THEME
HOW TO CUSTOMIZE CRAVE SHOPIFY THEME | SHOPIFY CRAVE THEME
hey guys welcome back to my channel and,in today's video I am going to show you,how you can customize a creative Shopify,theme so crave is a pretty brand new,Shopify theme that has been released by,Shopify recently,and basically crave um it's a really,nice theme for food drinks a restaurant,different Services toys and games so uh,the setup is also nice it's really good,for visual storytelling and stuff like,that let's view the demo before I show,you how you can customize it as you can,see this is,um,it's a food stall,um so you can see here the images are,really good,products they're really nice the images,they're just amazing and you can have,this kind of feature where you can add,your images that pops up like some sort,of like a video-ish and stuff like that,so I'm going to show you how you can,customize the entire craft theme so,stick around until the end of this video,so you can know how to do that so,let's go um this is my Shopify,um my Shopify admin page and if I view,my store here you can see this is like a,plain,um you can see this is just an empty,um craft theme so we are going to fill,out everything in here and it is going,to look like something like this but on,this tutorial I am going to do um like a,coffee shop,so I'm going to fill out everything in,here so let's go back,so to start customizing I'm going to,click here customize,and this will take us on the,customization page,this is where we're going to,um start editing everything,so let's start on the top and this will,be an announcement tomorrow so I am,going to click that,um,and then I'm going to start editing so,if you want to live right welcome to,ours so,um or you can just say an announcement,you want to tell your customer maybe,like free shipping,free shipping on all products,on all products,okay and you can also put the color,um the color should be according to your,brand what is your brand color so this,you should be very very careful while,customizing your store because you don't,know because you don't want to mess up,all the colors,and you don't have to have like so so,many colors that you just don't want to,be attractive,um so I am going to leave accent one for,myself and then I'm gonna I'm gonna go,back so we just edited our Announcement,by section and now let's go to the,header section which is this section,um right here,let's click header so over here you can,um add your stock logo so you can click,here change and select an image and this,is where I am going to upload my logo,for my business for my computer so I'm,going to do so I'm going to click upload,an image and my logo is being uploading,and that is my logo will appear right,there and I'm going to click select and,you can also choose what is your logo,with that you want so if you want it to,be like on this uh size maybe like 80,pixel or maybe 110 100 so pick the size,that you think will be perfect for you,and you can pick where you want,um the position to be on your header,section so if you want it to be on at,the
After seeing the first section, I believe you have a general understanding of curly-glory theme shopify
Continue the next second section about curly-glory theme shopify
Shopify - Display VARIANT Inventory Count On Product Page - Dawn Theme, No App
Shopify - Display VARIANT Inventory Count On Product Page - Dawn Theme, No App
alright guys so i recently made this,tutorial where i showed you how to,display your stock level on your product,page this was like a simplified tutorial,for products that did not have variants,like size color and what you do is,simply add a custom liquid block and,then with just a few lines of code you,can display your stock count however,like i said it doesn't work when you,have variants so you see i'm switching,these variants,and this number does not switch and,that's because we need more code than,this we need to use javascript to,update this number every time when we,switch,similar to the price for example how it,changes every time when we switch so in,this tutorial i'm going to show you how,you can do that and i'm also going to,help you make it a little bit better,rather than using this custom liquid,where we add code in here we're going to,make it a whole new,block type okay so you'll be able to see,this new block called inventory count,under this drop down uh you don't see it,now because i'm already using it but,you'll be able to see inventory count,and when you add it it will appear like,so,you will be able to drag it around,you'll be able to add it to different,templates so it's more useful in that,way and i've also added some settings,for it so you can change the color you,can make it red for example if you want,a sense of urgency and you can also,change,the threshold at which this message,shows up so if you only want it to show,how many are left in stock when there,are maybe less than 10 in stock then you,can do that by inputting the number 10,so now you will see that i only have,five left in stock of the 200 mil but,when we change to 500 mil of which i,have 20 in stock it will disappear if,you want to show the stock at all times,regardless of how many are in stock so,you don't want any threshold just put,the number 0,and it will always show so here we have,20.,here we have five,now you will need to copy and paste code,for this tutorial and you can find all,of that on my site go to ed.codes and,then go to tutorials and then find this,tutorial called display variant,inventory count,okay,and i'm going to take you through the,steps so let's get started with the,tutorial i'm going to switch to a,different theme that does not have this,work done,we're going to go through it together,the theme i'm using is dawn if you do,have a little bit of coding experience,you probably will be able to take my,idea and apply it to any other theme but,if you don't,then i think you will probably need some,help from a developer feel free to,contact me and i may refer you to the,right person or company here i am on the,themes page and i'm going to go into the,customizer for the theme that i want to,edit so the first thing that you want to,do is open up the customizer and,navigate to any product page i'm going,to navigate to my test product here and,the second thing that you want to do is,open the code editor so click on these,three dots here and click on edit
After seeing the second section, I believe you have a general understanding of curly-glory theme shopify
Continue the next third section about curly-glory theme shopify
Customize your Shopify Email Notifications
Customize your Shopify Email Notifications
hi I'm Alma kin from curious themes web,development studio in Nashville,Tennessee and in this video tutorial I'm,going to show you how to customize your,order notifications in the Shopify,back-end,so I'm here under the notifications area,which you can get to by just going to,settings in this lower left-hand corner,and then choosing from there,notifications so as you can see here,there's a lot of different notifications,that you have both under order as well,as for shipping as well as of course the,customer in terms of inviting them,letting them create their password so,there's a lot of different options here,so they all have the default template as,well as the the design and the wording,that all of the Shopify notifications,have however if you want to have a,little bit more customized branding this,is my favorite way to do it so it's,actually using an app called klaviyo,and I think I'm saying that right but if,you go to their website it is que la vie,I y ou comm which you can see here and,I'll also put in a link in the,description below but you can sign up,for a free trial so they do have paid,email marketing options which would,actually have them be your email,marketing provider however and they you,know really connect in with your Shopify,store and do a lot of data stuff however,I don't really say that you have to do,that you can definitely use the free,trial here and customize your,notifications first and pull that into,Shopify without having to use one of,their paid plans so what you'll do first,is go into their website and sign up for,the free trial here and once you do that,once you log in I'm gonna go into my,dashboard area of klaviyo now or however,you say their name but you're going to,go to this left-hand menu called email,templates now I have a few already in,here as you can tell I really do like,using this software but what you're,going to do is you're going to click in,the top right hand corner to create,template now,the great thing about this is that it,connects directly with Shopify so you,can see here they have their basic,templates to let you stylize things but,they already have Shopify templates set,up so they have ones already set up for,order confirmation shipping confirmation,shipping update and order cancel so we,are going to just click on the order,confirmation and I'm just going to name,this test you can of course name it,whatever you want to and I'm gonna hit,create template so now it gives us this,overall design that you can see here of,you know setting up to put in an image,it's Auto populating the fields that are,coming in so anything that you see with,this dotted box around it like how you,see here the shipping name the date the,shipping address billing address all of,that is being Auto populated by Shopify,again this is for an order confirmation,so it'll pull in all of their order,information as well as you can see all,of the order details here and all of it,down here as well so you don't have to,really worry about a
After seeing the third section, I believe you have a general understanding of curly-glory theme shopify
Continue the next fourth section about curly-glory theme shopify
Design your Shopify Store in just ONE HOUR!
Design your Shopify Store in just ONE HOUR!
i've got a confession to make i found a,new shopify theme and i want to change,it like,today let me explain okay let me explain,i was recently recording a video all,about finding your perfect shopify theme,and then i found it i saw it and i,instantly thought it would be perfect,for my children's book company because,it is a very colorful design with fun,little animations and i was like okay,yeah i want to try this out right now,but,i don't really have a lot of time and,this really wasn't at all in my august,goals i realized shiny object syndrome,thank you but i thought hey this would,be a perfect opportunity to record a,video and show you step by step how to,set up different areas of your shopify,store so i'm only giving myself 30,minutes that's it we're gonna get a lot,done in this 30 minutes we're going to,be working on customizing the home page,collection page product page about page,oh my gosh i think that's it maybe,contact page oh a blog i want to,customize a blog okay so much to do i,don't know why i sit down in this chair,i need to get started in my computer,chair so let's get going,okay time to get going there's so much,to do,okay so this is the theme that we are,going to be customizing the shapes theme,if you want to,try out this theme or any other themes,in the shopify theme store you can just,click try theme and you can actually,customize it like how i'm doing today,before purchasing it which can be,helpful if you're trying to decide,between a few themes and you want to see,how your photos and your branding look,with each one,okay so let's go ahead i've got it,pulled up here in the back end of,shopify and i'm going to go ahead and,set a timer because again we want to,make sure that we are staying focused,and on track for what we're trying to,edit and edit so much during this time,period so let's turn on our timer here,just to keep us countable and we'll hit,start timer,okay so for the home page i've already,gone in and changed a little bit of the,colors and the logo you can go through,the theme settings everything was going,to be different this theme had tons of,settings like i don't even know if i've,seen a theme have this many options to,choose from um just based on all the,things you can customize so you can go,to theme settings and you can change all,of that i went through already and,changed the colors to match my branding,and put in some gradients as well so you,can go ahead and make all of those,changes for your colors your typography,all of that that'll showcase in each,page as well but what i want to do in,this video is actually be customizing,the different sections so for this home,page section here you can click on one,of the items on the left or you can just,click on this up here,or actually if it's already clicked how,it is now you can click wherever the,item is and it'll take you to it so i,can click here and it'll instantly take,me to what it is on the left hand side,it can be a little bit helpful to use,that when you'r
After seeing the fourth section, I believe you have a general understanding of curly-glory theme shopify
Continue the next fifth section about curly-glory theme shopify
How To Sync Amazon Affiliate Products With Your Shopify Store Using The Spreadr App
How To Sync Amazon Affiliate Products With Your Shopify Store Using The Spreadr App
hey guys Paul next lesson on our Shopify,store how to add Amazon products if you,want to run your Amazon affiliate and,you want to send people to buy on Amazon,and get paid the 10% commission or the,5% depends what product it is a lot of,people would have to grab the link and,grab this copy this code it mess about,well there is a way to do it where you,bulk transfer products in or you do one,at a time,but you basically turn your shop so this,is my shop into an Amazon affiliate,store where you can point people instead,of going to you know by now you wanted,to say buy on Amazon rise this actual,t-shirt is on Amazon so I may bring that,one in and show you what it does right,so it says Add to Cart we wondered that,we want this to say buy on Amazon and,point people that way right I also,wanted to search share some books that I,recommend reading some business books,some self-improvement books so just,importing the products even if I don't,get paid by Amazon would be a good idea,because it does save me time so I,googled Amazon affiliate Shopify and,this one years got six hundred to five,star reviews it's got five star rating,600 - this one's got three reviews but,only five stars but only three reviews,you'd think that doing themselves so,we're gonna use this spreader app right,so what I do is I go to this link I'll,put a link in the video description or,in the lesson and they're in the,training if you are you gonna get a,7-day free trial,five dollars a month but you're gonna do,one click products and commissions,expand your store and basically add,where the products you want so I'm just,gonna go ahead and click get it's gonna,add tell me that it's gonna manage,products minimize your on my store I'm,gonna install the app it's gonna tell me,there is a seven day free trial,five dollars a month after that so I'm,approving that charge and you know if,it's gonna make your money and save you,time then it's always gonna be worth it,so what you're gonna have to do is,integrate the code join Amazon and,import products right so let me pause so,what we first need to do is integrate,the curl so at the moment on any product,it's gonna say add to cart so we want to,say if this is a certain product we want,to say buy on Amazon instead right so,what it's saying is click follow this,guide to integrate spreader curl right,so I'm gonna come to this guide this,guy's a walkthrough open your Shopify,admin click on on know store go to,actions click Edit code click find,product template liquid and then find it,Add to Cart button and then underneath,the Add to Cart button I'm gonna add,this code right so I'm gonna find add to,cart and then add the code right okay so,what I do is I go to my admin so it's,whatever your site is admin I go to,online store I go to actions edit code,then it said find product liquid product,training not liquid insect least poly,sections right yeah so in sections go to,product or training and liquid sections,template product liquid find Add to Cart,so I
After seeing the fifth section, I believe you have a general understanding of curly-glory theme shopify
Continue the next sixth section about curly-glory theme shopify
Shopify CSS Intro - How to Overwrite Theme Colors and Fonts When You Really Need To
Shopify CSS Intro - How to Overwrite Theme Colors and Fonts When You Really Need To
what is up guys today you're going to,learn a few techniques to completely,overwrite the styling that is set by,your theme,and be able to go beyond what the theme,settings allow you to change,because as you probably know things like,colors and fonts they're under here,under theme settings and they're set,globally across your entire site right,so you set a few primary colors like,your brand colors you set your secondary,colors and then like all the buttons and,stuff they automatically get these,colors applied to them right so these,buttons this is like the primary this is,a secondary and you don't have specific,control over which button is what color,but what if for example you want to make,this specific this add to cart button,pink or maybe you want to change the,heading size of your product title or,this vendor or maybe you want to change,the heading size in your footer anything,anything across your site if you want to,change something specifically this video,is going to show you how you can kind of,surgically go in and change that,specific thing without affecting other,things because that's kind of the issue,right you're going to love this video,because it's going to give you a lot of,control,a lot of very fine control over your,design,however,with great power comes great,responsibility,and,it's going to be very easy to also break,your theme right not completely break,your theme but,you know effect more than what you,intended to affect right so you want to,make one button pink,and you end up making like all your,buttons pink across your store which is,not what you want probably so i'm gonna,teach you a few ways that you can like,really carefully go in and make those,changes the examples i'm going to show,you are focused on colors and fonts just,because these are the most common,things that people want to do and the,most simple things to to do to teach you,but really if you do have some more,advanced knowledge of css then,you have no limitations really and you,can use the concepts that i teach here,and combine that with your css knowledge,to just change anything you want across,your store so anyway with all that said,let's jump into my computer and get,started okay so the first thing you want,to do is look at the page that you want,to be editing and have that open in a,tab on your browser,and the second thing you want to do is,go to online store themes and then under,actions click edit code to enter the,code editor we're looking for,theme.liquid you can search it but it's,actually right here theme.liquid this is,the main file that contains your entire,store all the other like section files,templates they're kind of like being,included inside of theme.liquid in this,file there's always a css file which is,usually called base.css,right um but it might be called,global.css anyway it's your main like,your core css file in dawn and in all,the free shopify 2.0 themes it'll be,called base.css but yeah you want to,find the main css file for your theme,c
After seeing the sixth section, I believe you have a general understanding of curly-glory theme shopify
Continue the next seventh section about curly-glory theme shopify
Shopify Hydrogen Reactjs Tutorial 2: with drop-down menu and open the cart at product page.
Shopify Hydrogen Reactjs Tutorial 2: with drop-down menu and open the cart at product page.
again this is Phillip,and this video,we're gonna demonstrate how we are going,to add a drop down navigation over your,top navigation and the other thing is,the many card pop up,behavior when you're going to add an,item on the product page,so in my previous if you're following my,channeled then you find out the first,release of my video in deployment for,hydrogen apps so today I will going to,help you out how you are going to start,your hydrogen apps without a Shopify,Plus,so recently I just discovered how we are,going to work with hydrogen apps without,Shopify plus because you know should be,by plus is,uh it's not affordable as for us a,developer,then developer the one who really works,uh to,provide a services to the merchants that,is asking your work and your skills so,today we are going to apply it using a,different subscription,and in this video we are used to apply,the basic Shopify subscription to our,hydrogen store,all right so without any fighting delay,let's go ahead and,gonna check how we're going to configure,our hydrogen apps using our basic,Shopify store,so here I'm opening up my,uh,basic store for development if you are,new to Shopify,and then you are an inspired uh,front-end developer,knows about react then this is the time,that you can,uh look at it how you will,be more,achievable of your goals in doing the,side customization,using the hydrogen apps,okay so let's hear you click the,settings,then apps and sales Channel,click the develop,apps for store,then we're gonna create an app,so we just called it hydrogen or,whatever you want,so here we're gonna create a token for,storefront API,and it is required but I'm not sure how,it is limited compared with the Shopify,plus that is intended for hydrogen and,oxygen so as what I understood,most of these Goods that we are going to,work it will be deployed on the oxygen,server and I think this oxygen server,can handle this,uh,the instructions involved in your coding,and probably there might be a limitation,but I'm not sure but so far I did not,find anything yet but this is a good,thing that uh can be doable using the,basic but the problem is you don't have,an environment where you're going to,deploy your apps but for now as a,developer you're gonna start from your,local environment okay so now we're,gonna copy the token I think I did not,I did not uh configure it yet so I have,to check this,axis scopes,excuse me,products,products are including the variants and,collections sailing plans I just checked,that,just for this demo okay,save,install the apps in your store,so earlier I already added few products,look at here,there are,branded products from,my client,so,let's go back again,to that apps to copy again,the token,let's go here,copy,so now what we discussed previously,in the pre-added like this this is,pointing to hydrogen free view my,shopify.com,and I've seen here that there is no drop,down probably it's been setting up that,there's no drop down,but at the end in my store I wanted to,disp
After seeing the seventh section, I believe you have a general understanding of curly-glory theme shopify
Continue the next eighth section about curly-glory theme shopify
Beginners Guide To Shopify Liquid in 2022
Beginners Guide To Shopify Liquid in 2022
whether you are new to shopify or you're,already a shopify store owner you've,probably encountered a code that looks,something like this,this is shopify liquid a template,language created by shopify that serves,as a framework for all shopify themes in,today's video we'll take a closer look,at shopify liquid we'll start by,understanding shopify liquid further and,then we'll learn about its features,are you ready,let's begin,to recap shopify liquid is a template,language used for creating or modifying,shopify themes if you are familiar with,ruby you probably have heard about this,template language because it's written,in ruby or it's known to be written in,ruby but in terms of syntax it's very,different compared to other programming,languages we'll get back to this in a,minute in addition shopify liquid is,very limited like there's a lot that you,cannot do with liquid for example you,cannot retrieve a data from a,third-party server just from shopify now,what is it used for in web development,there are two contents that you can,render static content and dynamic,content static content is a content of a,page that stays the same and is usually,hard coded in html whereas dynamic,content is the content of a page that,changes depending on specific parameter,for example we have the following,product page,it specifically rendered this product,for cats because in the url we specify,that we want to render the specific,product in shopify this is called a url,handle and by changing this to a,different handle of a product the,product page will render a different,product this is how dynamic content is,being rendered in addition shopify uses,its own architecture or template files,to display these pages for example this,page is using product.json it's a json,template that uses sections to complete,the page taking a closer look at the,section files you will see that there's,a liquid code mixed with html css and,javascript so to put it simply shopify,liquid is like the middleman between,shopify stores and the server of shopify,where all the data about your shopify,store is stored and then when a shopify,store asks for a data through liquid,shopify liquid will ask the server of,shopify if that data that is being,requested is available if it's available,then the server will give it back to,liquid,then liquid will give that to the,shopify store's theme,otherwise if it's not available then the,server of shopify will just return a 404,error response shopify liquid is,categorized by three features,objects,tags and filters objects also known as,variables are wrapped in double curly,braces and it's used to output pieces of,data from a shopify store for example,this is a shop object inside of this,object there are properties or,attributes that you can use by using dot,notation let's say we use the name,attribute so you're going to type it,like this so shop dot symbol and then,name this will render the name of your,shopify store there are plenty of,attributes that you can use
After seeing the eighth section, I believe you have a general understanding of curly-glory theme shopify
Continue the next ninth section about curly-glory theme shopify
How to add a custom section in Shopify 2.0 Dawn Theme detailed guide
How to add a custom section in Shopify 2.0 Dawn Theme detailed guide
in this video i'm going to show you how,to make your very own custom section in,shopify 2.0 on the dawn theme here's,what i made um it's just an example you,could make something totally different i,review how you can add your own section,how you can make all the text and all,the photos completely customizable and,add however many as you want so if that,interests you,go ahead and continue to watch the rest,of this video this is a pretty technical,video so you're going to have to be,comfortable working with a little bit of,code,thanks for watching if you need help,with anything feel free to reach out to,me martin martinclayson.net and i can,help you with your shopify store,also please leave a like comment and,subscribe thanks so here i am in my,shopify store dashboard this is just a,brand new development store so nothing,has been changed in it at all and i have,the dawn theme so this is a shopify 2.0,theme it's just the default theme first,thing i'm going to want to do is go,ahead and make a copy of this,and so where this load is located is if,you just logged in you need to click,online store and then this sub menu will,appear in click themes and then you'll,see this,but i'm going to go ahead and duplicate,this,and this is what you'll always want to,do you're not going to want to work on,the live theme and mess with,people who might be on your page at the,time of editing code,duplicating it will allow you to,preview make whatever changes you need,without affecting any end users quick,note on that though if somebody makes,any changes to the live theme and then,you change themes then any changes that,the other person made are not going to,be applied so just keep that in mind,anyways so,if i preview this,i'm going to open this in a new tab,let's see,you can see that there is nothing there,and then if i go into customize,we have all the typical sections,but i'm limited to what shopify is,going to give me and,they have some great stuff right out of,the box,but a lot of times you're going to want,to make something for yourself or for a,customer so i'm going to show you how to,do that,so let's exit out of this and start,editing the code if we go to the top,right here i can exit,and then on my duplicate theme right,here copy of dawn i can click actions,and then i can click edit code,and i'm going to open that in a separate,tab just to keep moving back and forth a,little bit easier and now it is going to,load up all the liquid files and i'm,going to minimize templates because the,section we want to work on,is sections so i'm just going to click,add a new section and let's call this,slick,slider,and then it's going to automatically add,the dot liquid and it's going to give us,some boiler boiler plate settings right,here it's going to give us section name,and then settings so,if i give this a section name let's call,this slide slick slider,and then i'm going to add some text here,that's a markup actually,my very,first,custom,section,and i'm going to go ahead
Congratulation! You bave finally finished reading curly-glory theme shopify and believe you bave enougb understending curly-glory theme shopify
No difficulty
