How To Customize Checkout Page In Shopify
2K views
May 9, 2024
Customizing the checkout page in Shopify is a valuable way to enhance the customer experience and boost conversions. In this video, you'll learn how to personalize the checkout process to align with your brand, improve user satisfaction, and reduce cart abandonment. The tutorial will guide you through the Shopify settings that allow for basic customization, such as adding your logo, choosing color schemes, and editing text fields. You'll also discover advanced techniques for customizing the checkout with Shopify Plus, including modifying the layout and integrating custom scripts. This guide is ideal for Shopify store owners who want to create a seamless and branded checkout experience that encourages customers to complete their purchases.
View Video Transcript
0:00
How to customize checkout page in Shopify
0:02
Hi guys, welcome back to another video. And in this video, I'm going to be telling you how you can customize your Shopify page
0:09
So having said that, let's just jump into the video. So first things, first, what we're going to do is we're going to come over here and
0:15
we're going to click on customize, right? It's going to open it up right here. Let me open it up in another tab
0:20
Here we go. So this is the store right here. So what we're going to do is we're going to click over here at the top bar
0:25
And we're going to come down over here. We're going to click on checkout. Right
0:29
This is going to open up. the checkout page right here, which we have right here, as you can see
0:33
So it says right here you can't edit using these sections. All right, so to customize it, go to theme settings, all right, which is right here
0:40
Click on theme settings and we scroll down and we have checkout option right here
0:45
We click on checkout and we get a bunch of different options that we can see right here
0:49
So let's go ahead and start, you know, editing it out. So first thing, search, we can add a background image if we want
0:56
So let's go ahead and select a background image. Let's see if we can edit this
1:00
It's going to add a background image over here, but we can also go to free images and we can pick out some of these images that are available right here
1:07
Let's go to staff favorites and pick out a staff favorite image that we can find
1:12
So if you scroll down here, we get a bunch of different images, but I don't really like all of them
1:18
So let's try to find something that's similar to a checkout page, right
1:23
Maybe we can find some image where someone's giving it the money to another person or a cash
1:28
year or just buying an outfit or something like that or a credit card type of image
1:33
So let's see if we can find it or what we could do is we could come back over here and go
1:40
into shop local. Yes, right here. Okay, so we can find some images over here. So something like
1:47
this, right? I think this would look pretty cool. Let's go ahead and select this image. Let's see if it
1:52
pops up at the top Let go ahead and select there we go Now we do want to select the focal point right Okay so this should be the focal point Let see Wait for a couple of seconds Yeah I think that looks
2:05
Okay, we don't really see anything. So let's go ahead and change it
2:09
Let's go back into shop local or local shop, whatever we're going to call it
2:13
Okay, here we go. We have some more options right here. So free shipping, we could go with that, a message at the top
2:20
Okay, we could select some of these. This would look good. Yeah, this would look good
2:25
So we'll just select that. There we go. I think that looks much better. Although it's a little bit unclear, but that's because we have a thousand our, you know, pixel setting is off a little bit. We can even increase the logo size over here as well. If we want to go over the small, it depends on you. We can position it to the left or the right. We can even select the background image over here. There's going to be the main content area. What does that mean? Which this is the image right here. We could actually go ahead and
2:55
select an image right here and maybe we could get like a background image or something shopping and sale
3:00
i think these types of images would look good right here so something like this yes this looks actually
3:06
really nice with the background plus it highlights all the text that we have as well we could go with
3:13
something like this or we could go with a completely different image like this one has a little bit more
3:19
texture to it but yeah or we can go with this one just find something that
3:25
complements the background as well. Like Shopify doesn't give you a whole bunch of customization options
3:31
So keep that in mind. You could change some of the text elements as well, but for that you would have to go to
3:37
the settings, which I will show you in a little bit. All right
3:41
Now we have the topography, right? We could even set the background image as well
3:45
What would this be? This would be this image right here. It depends on you
3:50
You could upload just a simple color palette if you want to
3:54
it depends on you but i just showing you that you know these are some of the things that you could do I mean it does not look good at all but you know yeah We actually keep it like it was you know the default one
4:08
We don't actually need it. I think that, I think that looks good. We could even change the color as well, like, you know, something like this
4:15
it depends on you or with a little bit of pinkish color, you know, like something like here
4:21
It's a little bit darker like that. Yeah. we could actually go with that and what we could do is we could actually just give everyone this
4:31
exact same background you know what i mean we'll just remove the image there you go think that looks
4:36
good and at the top as well can we go no we cannot do that at the top but yeah it looks really good
4:43
then we have the buttons right and the headings in the typography so we could change some of the
4:50
fonts right here. You know, give it a little bit of more bolder color if we want. Oswald is always good
4:56
Yeah, see. And for the system, we could go with a loto color, a lot of text. Yeah, I think that
5:02
looks much better. And error, if there's an error, there would be a red message, right? And the
5:08
buttons and accents, they're a little bit bluish color. Maybe we could change that to a different
5:13
color that, you know, compliments it, like a grayish type color. Let's see. It depends. It depends
5:20
on us. We could go with a completely different color like that or this. A little bit darker
5:27
I would say, yeah, something. Oh, that's a little bit more. There we go. That's much better
5:32
Could copy that code and paste it right here as well, much better. So these are some of the things
5:38
that we could do. And if you want to change the checkout settings, we'd have to go to the admin. We'll
5:44
have to visit the admin. We'll click over here on the admin. Before we do that, let me just save it right
5:49
here and now we go into the admin and here we go we have the checkout style all right we can
5:54
upload logos change color fonts and more and we have the customer methods and all of that customer info we could add some of these types of options and it depends on you like you know shipping addresses and phone numbers don include
6:08
or optional address line two it is recommended to have that i think we would leave it as it is but
6:14
if you want to add a specific like you know specific options and you can over here so let's go
6:21
ahead and click on Customize Checkout to have more customization options. Sorry about that
6:26
We actually don't need to come over here because it just redirects us back there. What we could need to do is actually we need to go into, scroll down to languages, right
6:36
And over here, you have your default language. This is called English right here
6:42
You could click on change default, right? We already have that. It's already set there
6:48
And, okay, I think they actually change that. First, we could go into there and we could actually change some of the things
6:56
Let me actually see if we can find it right here. Okay, sorry about that
7:00
So we actually can't do that. At first, what we would do is we would go into the main settings and change some of the text that we can find over here in the checkout section. Right
7:12
Like we can change this and this. We can change the button over here and, you know, call it something else
7:18
But I think now we can't. So I guess those are all the things that you could actually do, you know, if you come over here
7:26
And just, you know, only these things. You could change the background color and stuff like that
7:31
But you can't change anything else, unfortunately. But yeah. So pretty simple
7:37
I guess those are all the things that you could do. You could add the background image
7:40
You could change the fonts. You can add the background colors. Add like different images
7:46
And those are all the things that you could do in the checkout section
7:49
so that is it for this video guys hope you guys enjoy this video if you did be sure to the like button subscribe to the channel and turn on post notifications now we'll catch you guys in the
7:56
next video and also then take care and goodbye
#Custom & Personalized Items
#E-Commerce Services