Shopify checkout pages have a simple design and layout that helps with User Experience and keeping your site safe. The majority of the design cannot be changed, there are a few things you can customize. 

What you can control on Shopify Checkout pages

• Banner Images: This is a great place for an abstract photo or your brands pattern if you have one. Shopify recommends a 1000 by 500 pixel image. However, it’s important to mention that this image could be cropped depending on the size of your customers device. So, make sure you choose a picture that doesn’t contain any text and won’t look awkward if any of it is cut off.  
• Logo & Logo Size: A great way to include your brand’s primary element! Make sure you choose a size that looks good on multiple screens.
• Main content area background image: This is the area behind the main content on the left. This image should be simple, since your form fields appear on top of this.
• Background color: Another great chance to integrate the look and feel of your brand is by adding a solid color or subtle pattern.
• Typography: Just like the rest of your site, Shopify allows you to pick the headings and body content in the checkout pages.
• Accent color: This color is used for links, highlights, and checkmarks in the checkout area. This is a great way to add in more of your branding!
• Button color: Make sure to use a prominent brand color that contrasts with any background images.
• Error colors: Used for warnings and invalid field errors. Red is most commonly used for this, but this might need to be changed depending on your background.
• Extra form options: Under Settings > Checkout, you can add extra forms to your checkout.

Here's a link to get the directions for these changes.

‍

What you can't control on Shopify Checkout pages

• The layout of the page for both desktop and mobile views.
• The primary fields that are required to complete a checkout. (You can add more fields though!)
• The location for the gift card and discount code boxes
• The header and navigation that's on the rest of your site pages

‍

Why do they make checkout so limited?

To keep things simple and short, it's because they are trying to protect themselves and you. Shopify has legal and compliance requirements since they are dealing with personal information.

‍

Why locking down the checkout page is actually good for you

Like I said earlier, they are trying to protect you. Things like third party apps and malicious code can get into your site and compromise the security of your site - AKA they can steal your customers private information. This could lead to substantial liability and is definitely something you want to avoid! If your checkout page limits the changes that can be made, your chances of keeping your customers information secure is higher.

It's also beneficial because all of the companies using Shopify for their sites have the same checkout layout. In another post, I talk about the importance of making your site familiar to help with User Experience. This is extremely important for the checkout page because it gives a sense of credibility and security for the customer. Shopify designs the carefully to minimize distractions and make the customer focus on completing their purchase. Speaking of completing the purchase...let's chat Shop Pay!

‍

Shop Pay

Ever gone to checkout on a site that you've never been to before but somehow they know all of your information?

It's magic.

Actually, it's not. It's Shop Pay.

Shop Pay helps you check out faster when you’re shopping by automatically filling in your saved payment information and shipping information when you enter your email address at check out. 

By eliminating the need to go find your wallet for your credit card information, users have a faster and more seamless experience. Ultimately, this feature leads to more sales! 

‍

How Shop Pay works

When a customer is checking out and they’ve entered their shipping, billing, and credit card, they can save all of their information by entering the phone number and opting in. The next time that customer goes to check out, they will receive a unique 6-digit code. 

How to enable Shop Pay

1. From your Shopify admin account, go to Settings > Payment
2. In the Shopify Payments section, click manage
3. In the Accelerated Checkouts Section, check Shop Pay
4. Click Save

But wait, Shop Pay isn't the only way to autofill information!

In fact, with Shopify, you can enable checkout buttons for Apple Pay, Google Pay, Amazon Pay, and Paypal.

‍

As always, if you need help creating your Shopify site, send me a note!