BACK

how to add to the top button shopify

How To Add Back To Top Button On Shopify - 2022 Easy Tutorial okay maybe you have a very long page o

Andrew from EcomExperts

Updated on Mar 04,2023

How To Add Back To Top Button On Shopify - 2022 Easy Tutorial

The above is a brief introduction to how to add to the top button shopify

Let's move on to the first section of how to add to the top button 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 to the top button shopify catalogs

How To Add Back To Top Button On Shopify - 2022 Easy Tutorial

okay maybe you have a very long page on,your shopify store and people keep,scrolling down but you want a little,button that says hey bring me back to,the top in order to avoid your clients,to scroll all the way back up in this,video i'm going to show you exactly how,to do that so let's jump in right now,we're here in our shopify store and,we're going to go to online store themes,the end result is going to look,something like this right here okay so,this is the theme we'll be working on uh,we're gonna click action because we're,not going to be working on that theme,we're gonna do a duplicate of it i see,this in every video but every video i,get comments saying hey i messed up my,team because i didn't do a duplicate if,you do duplicate and you make a mistake,in the code,you can simply remove that duplicate if,you do not do a duplicate and you make a,mistake in the code you are screwed and,it's going to cost you hundreds of,dollars so make the duplicate,all right great once the duplicate is,made we're going to go to actions and,we're going to click on edit code right,here on the left we're going to go to,snippets snippets are little pieces of,code you keep reusing kind of that,change of you know card icon we did in a,previous video there,pretty useful okay you're going to add a,new snippet right here you're going to,paste it you're going to call it back to,the top do it exactly like that make,sure there's no space here,exactly like that and you create the,snippets by the way throughout this,video i'm going to be pasting and,copying a whole bunch of code into it,you don't have to pause the screen and,retype the code at the end of the video,i'll tell you exactly where you can go,and get the code and copy paste it so,okay you don't have to go look or pause,the screen for it just wait until the,end of the video all right now that you,have this new snippet called back to the,top we're gonna paste a whole bunch of,code in there right here we're doing,control,paste,there we go and you should have about 77,lines of code that ends with forward,slash script and let's start with,comments,again i'll tell you at the end of the,video where you can get this right now,you're going to click save,because we're saving it,and then we're going to go right here to,the left to the layout folder at the,very top and we're going to click,theme.liquid,and we're going to go to the very bottom,and we're going to be looking for the,closing body tag which is this one this,is what the closing body tag looks like,forward slash body so we're going to go,right before that right here and we're,going to type enter a couple of times,spacings don't matter in code so you can,type enter as much as you want and then,we're gonna paste the final piece of,code here,render back to the top this is basically,saying hey show the back to the top,snippet code that we just created show,all that code right here,so we're going to save that,and we're going to see what it looks,like,online store,right connections a preview,that's our online store that's great,that's awesome that's featured i can,already see it but can you see it that's,the question because it is right here,back to the top,so it's gonna be there all the time and,i click and i'm back to the top let's,see if it works on the other pages as,well,start scrolling scrolling scrolling ooh,yes sir it works perfectly so if you,follow the link down below you'll have,the full article with the codes that you,can just copy paste and the link below,that is a master class that if you're,just starting out or if you're making,your first couple of bucks but you,believe you have good potential and you,don't have a mentor to help you out sign,up with these guys i had multiple stores,that you know went from pretty much zero,to ten fifty a hundred thousand dollars,a month because they were coached by,these guys month over month they're,really a good product and by signing up,to them you're also helping out the,channel it's gonna be a fantastic return,on investment for you i hope these types,of videos are useful to you good luck,selling out there with black friday,coming up in this video and,see you in another video ciao

Congratulation! You bave finally finished reading how to add to the top button shopify and believe you bave enougb understending how to add to the top button shopify

Come on and read the rest of the article!

Browse More Content