how to add products to blog post on shopify

we are looking at a,an article right now and what we're,going to show you how to do is how do,you add,a product to the bottom of,your blog post or to your article so i,am using the debut theme,and what we'll want to do is go into,our themes here and then,in our debut theme i'm going to,click on actions edit code,now in here where we want to go is our,sections,and article template this is what we,want,because this is showing us what is,what we're seeing when we're looking at,an article,and you can test that out if you want to,test that out and say,h1 hello,save it refresh,there you go so we know we're editing,this page,now i'm going to show you how to do it,one way initially,so first off,how do you get to a particular product,i'm going to do an assign,blog prod just to say that's the blog,product,all products so the shopify liquid,objects you have access to this what's,called a global variable called all,products,and let's just look for sundress control,s,so now when i save that let's go ahead,and create,our our product or show our product on,the page,so i'm going to say,if blog prod so if there is,a sundress product,i need to end my if statement,and in here this is where i can say,maybe i just do double space,let's put in here hr for,a horizontal,and let's do image source let's just do,let's just output the,let's just output the image so we can,say,blog prod featured,image and this is where you have to pass,in that image url parameter,and let's just put 100 x it's going to,be 100,x for the size all right,now this isn't going to look the,greatest because i'm not going to,to show you how to do a nice,styled product that you see right here,so i'm just going to do simple,paragraph tags right here simple image,tag,so,blog prod,let's grab the url of that so what we,want is what we're creating here,is we are,creating a link so that when you click,on it,it will link you to that product,all right and we need to,so this should be good i feel like i'm,missing something here oh yeah,there we go and then,let's just let's just do the blog,prod price,this is going to give us how much that,that product costs and i think that,should be fine,ctrl s all right so we added just this,additional piece of code right here,and that's going to show us let me show,you what that shows us if i refresh,this is what we get right here so again,it might not look the best,you'll want to certainly style it to,your liking but we have,a product here if i click on sundress,perfect it takes me to my sundress,product,now the problem with this is if we go to,our blog right here,is that it'll show sundress for every,single,article right which is something that,you may not want,let's make this a little bit more,dynamic let me show you how you can,build and show a particular product,for that specific article so that if you,click on this,best books about photography article,you'll get one product,whichever product you want and then on,this post article right here you'll get,a different product,so the first thing we're going to do is,let's go into,our shopify admin panel here let's go,into blog posts,on the left hand side and,click on best books about photography,if we scroll down we're going to have a,tag right here let's add a tag,now what we're going to do is product,sundress now where is this let's just,add that first,where is this coming from this little,sundress right here well that is what's,called a handle,on your product let's just go to our,products real quick let's leave page,that's fine,and if we scroll all the way down to,sundress really any one of these,products,you have what's called a handle this is,how you identify,that product we scroll all the way down,to the bottom edit website seo on a,product,this is where you find the handle so,this is unique,for every single product,if we click on just anchor for example,scroll all the way down,here goes the handle right here,so every one of these every single,product has a unique,what's called a handle how you identify,that product,so let's go into our blog post,and let's tag,this article by calling it let's just,say,product so we're just defining that,this is the the tag the beginning of it,is called product,underscore we're gonna name it product,underscore and then,again let's just click on sundress right,here,and save it now what we're going to do,in our code here,is we're going to find your product,tags and grab,that sundress out of it so that we can,do,if we look at our code now let's go back,and look at our code,click on themes here go and edit our,debut theme,instead of having our every single,product be the sundress it's going to be,based on that tag so we're going to get,this value,out of that tag now how do we do that,let me show you,i'm just going to leave that there for,now and i'm going to do,write some some code right here now,that's how you do it anything between,this right here in the middle that's,code,you can write your liquid code so i'm,going to say,for tag and article dot tag so if you,look at the article object we have,access to that,it's going to list out it has this dot,tags method that you can call,this will return every single tag of,that article,now what we're doing here is a for loop,so we're going to iterate over each one,of those tags,as we iterate over each tag we're,assigning it to this value right here in,our case we're calling it tag,let me end my my for statement first,now we're going to say assign prod let's,just get a handle let's just give that,let's go and extract that handle,what this does right here this piece of,code right here,this split what it does is it,essentially golden finds,a tag and oh and i should actually say,one more thing,i forgot a piece of code here,here's what we want if tag contains,product underscore,there you go then i'm going to do this,so if that tag contains that product,underscore in the front of it,or really not just in the front of it,but if it contains this product,underscore exactly as that,what we're going to do is we're going to,take that tag and split it on,underscore meaning that it should,generate,something that looks like this think of,it as an array here,product and that's what it's going to,give us in our case let's just it's,sundress,and that's going to go off the screen,let me just show it right here,make this a bit smaller,it's going to give us return something,like this,so when you do a split it returns it in,what's called an array here,you'll have product and then sundress so,our job,is to how do we grab sundress out of an,array,very simple i'm going to create another,assign and this is going to be our blog,plot,right this variable right here so we're,going to say all products just like what,we did down below here,or up above now we're going to do that,prod,handle and then i'm going to have,another,square bracket so this square bracket,we're going to,put in here one,this is how you grab that sundress out,of there that array right here,all right now let's go ahead and remove,this other block prod since we don't,need that anymore,save it,now what we're doing is we've assigned,this all products,right here or we've retrieved that,product handle,based on the tag we've assigned it to,this blog prod right here,now let's refresh and let's go into our,best books about photography,oh i have to preview this again,and actually let's preview it let's,preview it on the the other page,here we go that way it actually opens up,a new tab here we go,so now if we click on best books about,photography there goes our sundress,it still goes to the sundress product,if we go back to our post right here we,do not have that,right we have some comments but we do,not have that so,let's go into that blog post the post,right here,let's just do product anchor,right because the anchor we know the,anchor is the handle of,the anchor product so you have to,select and make sure you're using an,anchor when you are tagging it,now shopify is taking some time right,here hopefully,it makes that change soon here we go,product save,product anchor now if we refresh,there you have it at the very bottom,here you have anchor if we click on that,it goes to our anchor product so we are,on,the post article and let's go back to,the,best books about photography we now see,the sundress,so this is just a more dynamic solution,right instead of having sunrest be shown,across all of your articles,you can determine which product is shown,here,per article,which is really useful and that's how,you add products,to your articles,hello everyone if you've enjoyed this,video and are interested in learning,more,head on over to universateem.com,it's a full-blown course that teaches,you how to customize your shopify themes,whether you're a store owner or a,developer,we'll show you how to build in,navigation menus,how to filter your collection pages how,to customize your cart page,and so much more you'll see you have a,full-blown curriculum,shown right here of what lessons are,already there so sign up today,to become a shopify theme pro

Congratulation! You bave finally finished reading how to add products to blog post on shopify and believe you bave enougb understending how to add products to blog post on shopify

Come on and read the rest of the article!