BACK

parallax how to shopify brooklyn theme

Create A Stunning Parallax Section In Your Shopify Store - 2022 Free Tutorial my name is andrew from

Andrew from EcomExperts

Updated on Mar 13,2023

Create A Stunning Parallax Section In Your Shopify Store - 2022 Free Tutorial

The above is a brief introduction to parallax how to shopify brooklyn theme

Let's move on to the first section of parallax how to shopify brooklyn theme

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.

Create A Stunning Parallax Section In Your Shopify Store - 2022 Free Tutorial

my name is andrew from ecom experts dot,io,as always the green hoodie is on that,means we're going to code,and we're going to add a parallax slider,to your fee right this is a nice little,design feature that's always useful if,you want in the description down below,there is a link,if you click on that link it will have,the exact pieces of code,i'm going to copy and paste with you on,screen in just,a moment so you can just copy and paste,that in just like i'm doing while you're,following along,by the way next to that link there is a,subscribe button and it would mean the,world to me if you would subscribe,and maybe even like or share with a,friend or check out the other videos,i'm really doing my best here or give,any feedback okay enough about that,let's just jump straight into,our store let's do a quick little,preview as we always do to see what it,currently looks like,and as you can see there is no parallax,nowhere near to be,found okay so we're going to change that,we're going to go to,online store right here and before we do,anything else and i say this in every,video but in every video people miss it,we're going to create a duplicate so,click on actions,and click on duplicate if you do not do,this,and you make a mistake it's going to be,very expensive,this exact step right here don't skip it,it can save you,a lot of money if you make a mistake in,the code you can always just go back to,the previous version,if you don't have a previous version,you're going to need to hire someone to,fix your mistake,you don't want to do that well that's,not true you do want to hire someone for,just in general but not not in this,specific case it would be unfortunate,all right now that we have copied it we,can click,right here on actions and we can click,on edit code once we're here we're going,to scroll all the way down,to the asset directory right here and,we're going to be looking for,team dot scss as always this is a huge,file like 8 000 lines i believe,um so we're going to be scrolling all,the way down,all the way down right here 8 700 lines,of code that's pretty impressive,and we're going to paste the first block,of codes that,we have in the document down below,now little side note it is very,important that you paste,and that you copy and paste every single,thing,so you see that final bracket here super,important,if you forget that bracket it's not,going to work and it will break your,site,so make sure you copy the entire thing,until the last comma bracket everything,all right,uh now we can just hit save right here,and once that is done we're going to go,back here to the left we're going to be,clicking on,sections and add a new section it's,going to ask us the name of the new,section,and for you know just make it easy and,copy paste the exact name that we,provide you in,the link below we're going to create,that section and here again as a little,side note if you,don't have sections right here on the,left that means you're working with a,really really really old shopify store,slash,theme and it's really time for you to,update your shopify theme,for that it's really best to contact,your team developer or,developer of your choice we actually do,team updates as well,all right cool so once you have done,that um,there is a whole bunch of whole bunch 12,lines of code that should appear,you can take all of that and delete it,once that it is deleted you can replace,it by,the block of code in the description,below again,very important that you have everything,it should end,with this uh and schema and,it should start with the assign symbols,here,that's it once you do that you save and,now you have,everything you need to have so let's go,to the online store and see how this is,going to work,remember we have not worked on this,version we have worked on a copy right,here,and we can click customize and we will,be able to add our parallax,let me show you how we click add section,right here,it should be somewhere here featured,product,with parallax we can select,that it's going to ask us for an image,i'm going to use a free image right here,select,and then it's going to say well do you,want to change your text,do you want to add a product to it yeah,let's add a product,here we go the chakra bracelet,and this is how it will be,we can save that,and then one final little thing is we,have to put our theme,live so that's pretty simple we just go,click,actions we click publish are you sure,you want to publish this,yes we are sure that everyone wants to,see our new changes,and then if you just go to the live site,by clicking right here,um our parallax is right here,and how does it look on mobile right,click inspect,we refresh it we do it maybe on a,on an iphone x and this is how it looks,on the iphone x so it's perfectly,responsive,as well well i hope this has helped you,my name is andrew from ecom experts dot,io i do a whole bunch of shopify coding,videos i do shopify strategy videos to,make you more money like this one right,here,strongly recommend it and i also do app,reviews,really cool apps that can save you a lot,of time and make you money as well,so make sure to subscribe to our channel,let me know in the comments down below,what you want to see and i'll see you in,another video adios,you

Congratulation! You bave finally finished reading parallax how to shopify brooklyn theme and believe you bave enougb understending parallax how to shopify brooklyn theme

Come on and read the rest of the article!

Browse More Content