WooCommerce: How to Add Scripts to the Checkout Page

A client needed to add her SSL Logo Seal to the checkout page. The problem is that the code she was given had also a JS part, together with a bunch of HTML.

Unfortunately you can’t just copy and paste JavaScript in the checkout page… you need a workaround!

In this article, we will learn about wp_footer, a handy WordPress hook to print anything inside the footer, a bit of conditional logic to target the WooCommerce checkout page only (and therefore excluding the Thank You Page and Order Pay Page), and how to print HTML inside a PHP function. Enjoy!

PHP Snippet: Add Script @ Checkout Page  – WooCommerce

/**
* @snippet       Print Script @ Checkout Footer - WooCommerce
* @how-to        Get CustomizeWoo.com FREE
* @author        Rodolfo Melogli
* @testedwith    WooCommerce 5
* @donate $9     https://businessbloomer.com/bloomer-armada/
*/

add_action( 'wp_footer', 'bbloomer_add_jscript_checkout', 9999 );

function bbloomer_add_jscript_checkout() {
   global $wp;
	if ( is_checkout() && empty( $wp->query_vars['order-pay'] ) && ! isset( $wp->query_vars['order-received'] ) ) {
      echo '<script>paste your script here!</script>';
   }
}