Skip to content

Instantly share code, notes, and snippets.

@bxmas13
Created January 17, 2017 20:09
Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save bxmas13/e0a5b3ebd16912b9ca76b7844605a10f to your computer and use it in GitHub Desktop.
Save bxmas13/e0a5b3ebd16912b9ca76b7844605a10f to your computer and use it in GitHub Desktop.
Shopify Plus Checkout.liquid template. Can be used with Timber
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="{{ locale }}" dir="{{ direction }}" class="{{ checkout_html_classes }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, height=device-height, minimum-scale=1.0, user-scalable=0">
<title>{{ shop.name }} - {{ page_title }}</title>
{{ content_for_header }}
{{ checkout_stylesheets }}
{{ checkout_scripts }}
</head>
<body>
<div class="banner" data-header>
<div class="wrap">
{{ content_for_logo }}
</div>
</div>
{{ order_summary_toggle }}
<div class="content" data-content>
<div class="wrap">
<div class="sidebar" role="complementary">
<div class="sidebar__header">
{{ content_for_logo }}
</div>
<div class="sidebar__content">
{{ content_for_order_summary }}
</div>
</div>
<div class="main" role="main">
<div class="main__header">
{{ content_for_logo }}
{{ breadcrumb }}
{{ alternative_payment_methods }}
</div>
<div class="main__content">
{{ content_for_layout }}
</div>
<div class="main__footer">
{{ content_for_footer }}
</div>
</div>
</div>
</div>
{{ tracking_code }}
</body>
</html>
@RavishPatel-ICFNext
Copy link

Where do we add this file in the theme package and do we have to do anything special to get this rendered. We are using Shopify Plus account.

@bxmas13
Copy link
Author

bxmas13 commented Jun 24, 2019

are using S

As a Shopify Plus account you should have access to the checkout.liquid file.
You can access the file by:

  1. Login to your admin account
  2. Click 'Online Store' in the left hand menu
  3. The Themes page should now be loaded, click the Actions drop down and select Edit Code
  4. Once the Edit Code page loads navigate to the Layout folder and click on the checkout.liquid file.
  5. Now you can replace the code in checkout.liquid with the code from my gist.

**Note: I would suggest backing up your theme before editing the file. You can do this by duplicating your live theme and renaming it.
Shopify Plus allows you to add or backup as many themes as you would like.

If you have any questions please feel free to contact me.

@RavishPatel-ICFNext
Copy link

Hi Brian,
Thank you for the response. We have edited the code and are updating it with simple HTML block like a

but the note do not get rendered in the checkout page nor do we see it as part of generated sourcecode.

We did check with Shopify and they confirmed some issue with our account. Shopify is working to fix that issue.

Thank you
Ravish Patel

@bxmas13
Copy link
Author

bxmas13 commented Jun 24, 2019

Excellent!
I have had a similar issue with a couple of my client's accounts. Shopify has been quick to fix the issues.

Good luck with your site!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment