Home » WooCommerce: How to Add Scripts to the Checkout Page

WooCommerce: How to Add Scripts to the Checkout Page

by Tutor Aspire

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!

WooCommerce: how to add HTML/JS scripts to the checkout page

PHP Snippet: Add Script @ Checkout Page  – WooCommerce

/**
* @snippet       Print Script @ Checkout Footer - WooCommerce
* @how-to        Get tutoraspire.com FREE
* @author        Tutor Aspire
* @testedwith    WooCommerce 5
* @donate $9     https://tutoraspire.com
*/

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

function tutoraspire_add_jscript_checkout() {
   global $wp;
if ( is_checkout() && empty( $wp->query_vars['order-pay'] ) && ! isset( $wp->query_vars['order-received'] ) ) {
      echo '';
   }
}

You may also like