shopify slideshow code

how to add slideshows in a page to,shopify hey guys welcome back to the,youtube channel in this video i'm going,to be showing you how you can add a,slideshow page on your shopify store so,let's get into it now the first thing,that you might be wondering is how do,you create your shopify store so all you,have to do is go on to shopify.com and,you can just click on get started or,input your email address over here and,then you can get started with your,online ecommerce store now this is the,shopify home page so once you create,your little ecommerce store once you set,up like the basic parts this is going to,be your actual home page where you can,begin managing your shopify store and if,you want to create a new product slider,or a new slideshow on your shopify store,there are two basic ways that you can do,it now the first way that you know most,tech savvy people prefer is that if you,click on online store you're gonna go,into your themes and from here what,you're going to do is you're going to,click on actions and from here you're,going to click on edit code now if,you're a beginner i would recommend that,before you click on edit code you click,on duplicate and what this does is it,makes a copy of the code of your website,and then if you mess up anything you can,just paste up the copy that you had and,you don't have to worry about anything,but if you're pretty tech savvy and if,you're following this video step by step,then i don't think you're going to run,into any issues but do remember that,different shopify themes work,differently so if you're running a,different shopify theme,it might be that you might have some,issues with the code that you're going,to add but in most cases you're just,going to click on edit code and once you,click on edit code what you're going to,do is you're going to go and see on your,left you have these sections and on your,right you're going to have the previews,so from here you can see these are all,your sections and you're just going to,click on templates you're going to click,on add a new template and then you just,leave it at that don't change anything,you're going to click on create template,and you're going to remove all of this,text,and then you're just going to paste this,section over here so uh this is like,totally up to you on how to copy and,paste it i just typed this on my notepad,and pasted it but this is section,slideshow and then you're just going to,save if there are any errors you can,just click on over here,and create a liquid one and then you can,just paste over here and then save and,now you can see if it doesn't work on,the json version you are just going to,remove it and then you can just add it,onto the alternate liquid version and,then just like that you can create,slideshows on your shopify store so if,you click on view over here what you can,do is once you click on view you can,click on edit homepage and once you,click on edit home page you're going to,find your slideshow on your left bar,over here you see all of these different,sections you're probably going to click,on add section and then you can find,your slideshows over here so i have it,in collages and you can see over here,this is the slideshow and just like that,i have added the image slideshow so this,is how easy it is to add an image slide,now once you have added the slideshow,section you're going to click on image,slide you're going to select your image,so i'm just going to use this image and,after that what i'm going to do is i'm,going to add another image like this i,just have these random reference images,they're not in any particular order but,just like that i've added this simple,little slideshow so it takes you less,than five minutes to edit the code and,add your slideshows via this method but,iffy about code and you don't want to,use this method i'll just show you guys,how it looks like,so these were the images that i added i,didn't remove this button but this is,like the image slideshow over here and,you know it's like a very nice little,cute little section that you can add,especially to the top of your website i,would actually recommend to add it to,the top instead of adding it to the,bottom but you can see over here i have,one and two two images like that and,obviously you can resize it and fit it,in different grades if you want to now,it's a simple and easy method and i'll,show you guys the code again it's only,two curly brackets a percentage section,slideshow and that is it that's all you,have to do to add a slideshow onto your,shopify store now if you want more,abilities to customize and you just want,to do it in a different manner you don't,want to edit the code of your web or if,this method does not work for you you,never know some shopify teams have evers,and some shopify themes are very,difficult to customize so in that,situation what you're going to do is,you're going to go into your app section,over here and then once you click on,your app section you're just going to,click on view more apps in this,collection and then you have these two,apps over here so first is smart bn,banner slider or the second is product,image slider carousel so you can,integrate these two iterations onto your,shopify store for you to be able to add,these image sliders so you can choose,any one of these and if you are still,looking for more you can just go on to,your actual search button over here and,you can search for image slider as you,can see there are quite a few different,options that you have in terms of,galleries but i do recommend smart b and,and the product image slider carousel by,p o w r dot io these two are pretty,simple and easy to use all you have to,do to add these is click on add app over,here,and once you click on add app they are,going to integrate your application onto,your shopify store so you're just going,to click on install app over here and,once you click on install app and we're,just waiting for our application so you,can see over here just like that our,banner slider has been added now what,you're going to do is you're going to,click on add slider and then you can,choose the height and width so let's say,i only want a 100 by 100 pixel,like this and maybe i want this to be a,vertical side so you can see there are,different variations for sliders as well,so maybe i wanted to be a jump slideshow,or if i wanted to be a banner slider or,let's just say i wanted to be a list,slider and then you can see the interval,over here as well so i want this to be,at 8 000 milliseconds and then you have,the mode so i just wanted to be a,contain so put all of the image in the,actual center of the slide area and then,you can choose to allow pads if you want,now once you do that you're going to,click on save slide over here just like,so,and then you can click on over here so,you can just add the name,sample slide,when i click on save slider so once i,click on save slider and all the,information has been saved i'm just,going to click on next and now i'm going,to just add the images for the slider,that i want so you can upload any images,so i'm just going to click on add image,and i'm going to select the image and,i'm just going to go into my downloads,over here and i'm just going to use the,this image i'm going to open this up and,i'm just going to enter this information,like so,and now i'm going to click on add image,and i'm going to select another image,this one,and i'm going to open this up as well,and i'm going to save it just like that,so i have added these two images now i'm,going to click on next,i'm going to click on next over here and,then you can see all of the embedded,code has been provided to you so what,you're just going to do,is you're just going to follow these,instructions so you have step-by-step,instructions on how to insert the script,code into your shopify store now you can,see over here that you still do have to,edit code and that's going to be like,the essential part in most sliders but,for more customization and for more,control over the kind of slider that you,want over the kind of aesthetic that you,want your shopify store to follow it is,better to use a application because if,you're not familiar with writing complex,code then this kind of copy paste code,is going to be a lot more helpful for,you so once you do that all you have to,do is publish your shopify store with,any of the code that you receive from,any of your image sliders over here now,hold up shopify is a great application,for you to get started with your,ecommerce business i do recommend it to,most people because it allows you a lot,of customization but for people that are,not familiar with web development and,e-commerce store development it keeps it,simple as well and you're able to find,what you need where you should put it,without having you know a mumbo-jumbo of,extra features that you are never going,to use however shopify is not available,for free so shopify starts at the basic,version of 29 per month and then they go,up to 299 for the advanced version and,the mid version is starting at 79 and i,do think for most people the basic,version is good enough with the amount,of features that it has it's pretty good,for most people to get started and you,also receive a 14 day free trial on,shopify for you to set up your store and,then,take a look at shopify and see if it,really suits you so that was it for,today i hope you guys found this video,helpful if you have any questions make,sure to leave them in the comment box,down below and i will help you through,with how to set up your own product,sliders or image sliders in your shopify,theme if you run into any issues with,the theme that you're using and make,sure to leave a like and subscribe to,the youtube channel and i will catch you,guys in the next video

Congratulation! You bave finally finished reading shopify slideshow code and believe you bave enougb understending shopify slideshow code

Come on and read the rest of the article!