How to load script tag for checkout pages

muhammad_feroz
Shopify Partner
1 0 0

How to load script tag for checkout pages in version 2022-07

Replies 13 (13)

dwyckoff
Shopify Staff
15 1 3

Hey there Muhammed! Your question seems to be a Shopify Script question, could you provide more details about what you're trying to do on that forum?
https://community.shopify.com/c/shopify-scripts/bd-p/scripts
Have a great day,
Daniel.

To learn more visit the Shopify Help Center or the Community Blog.

1080
Shopify Partner
292 8 42

@dwyckoff  this question regarding the app js can load the  into the shopify checkout page.

EcomGraduates
Shopify Partner
588 48 79

Hello there  

 

To load a script tag for a checkout page on Shopify, you can use the following steps:

  1. Log in to your Shopify store's admin panel.

  2. Go to the Online Store > Themes section.

  3. Locate the theme that you want to edit, and click on the Actions button.

  4. Select Edit code.

  5. In the Layout section, locate the theme.liquid file and open it.

  6. Find the closing </head> tag in the file, and insert the script tag before it.

  7. An example script tag for loading a JavaScript file from a third-party service might look like this:

 

<script src="https://example.com/checkout.js"></script>

 

 

  1. Make sure to save the changes.

  2. Go to your checkout page and test if the script is loaded properly by checking the source code.

hope this helps

 

1080
Shopify Partner
292 8 42

@EcomGraduates  This is not works. and also theme app block not working.

Michel_Arteta
Shopify Partner
33 2 34

That's a wrong answer. This approach won't load the script on the checkout. you will need to access checkout.liquid but only PLUS users can edit it but this approach will be deprecated in August.  

EcomGraduates
Shopify Partner
588 48 79

hello there  

In Shopify, script tags are used to add JavaScript code to your store. However, script tags are not allowed on the checkout pages for security reasons. This means that you cannot use script tags on the Shopify checkout pages.

If you need to add custom functionality to your checkout pages, you can use the Shopify API to create an app that integrates with the checkout process. This will allow you to add custom functionality to the checkout process without the use of script tags.

 

1080
Shopify Partner
292 8 42

@EcomGraduates   can you please provide the more information. on the same  Shopify API to create an app that integrates with the checkout process

Anton98
Tourist
10 0 3

So does this mean that not even tracking with Google Tag Manager is allowed in the checkout session? Even if its only tracking and not modyfing any styling och functionallity of the page?

 

We currently have big issues trying to track when a user gets into the checkout, every other URL tracks perfectly fine via GTM, but as soon as they go into a checkout session, the GTM script wont load, with the error message in console "Refuse to load the script" "Beacause it violates the following Content Security Policy directive:" Screenshot: https://gyazo.com/f119548de0408cf99a84aea53397777b

BugMaker-Huang
Tourist
4 0 2

Same problem here, I can not even use Google Tag Manager in the checkout page!

This is the most **bleep** ridiculous thing I have ever seen in economic field!!!😫

@EcomGraduates @dwyckoff 

alexpriftuli
Shopify Partner
10 1 5

For plus stores you can use the customer events functionality

rsaberon
Shopify Partner
12 1 1

did you fix your issues? I want to know how you did it.

1080
Shopify Partner
292 8 42

@alexpriftuli  thank this was the good reference.