The WooCommerce Checkout Template is located in the /wp-content/plugins/woocommerce/templates/checkout folder. The Checkout template controls the layout and display of the checkout page.
What to do if you need to customize the WooCommerce Checkout Page?
If you need to customize the WooCommerce Checkout Page, you can do so by creating a child theme. By creating a child theme, you will not lose any changes when the WooCommerce plugin is updated.
PRO TIP: If you are looking for the WooCommerce Checkout Template, it is important to note that it is not actually a template. The WooCommerce Checkout page is generated by a PHP function called wc_get_checkout_url. This function is located in the WC_Cart class.
How to Create a Child Theme for WooCommerce
- Create a new folder in your WordPress installation directory. For example, /wp-content/themes/my-theme/.
- In your child theme folder, create two new files: style.css and functions.php.
- In your child theme’s style.css file, add the following:
.post-title { color: red; }
/* This will make all post titles red */ - Copy the contents of the WooCommerce plugin’s /templates/checkout folder into your child theme folder.
(For example, if you are using a custom WooCommerce
template named my_template.php,
copy it to /wp-content/themes/my-theme/my_template.) - In your child theme’s functions.php file, add the following code:
<?php function my_theme_enqueue_styles() {
$parent_style = 'parent-style';
// This is 'twentyfifteen-style' for the Twenty Fifteen theme.
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( $parent_style ),
wp_get_theme()->get('Version') ); }
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' ); ?>
/* This code enqueues the parent and child theme stylesheets */ - (Optional) In your child theme folder, create a file named WooCommerce.css.
.post-title { color: red; }
/* This will make all post titles red */
/* Add your own custom CSS here */ - (Optional) If you want to use a different template for your checkout page, copy the WooCommerce plugin’s /templates/checkout folder into your child theme folder.
(For example, if you are using a custom WooCommerce template
named my _template.php, copy it to / wp - content / themes / my -
theme / my _template.)
/* This code enqueues the parent and child theme stylesheets */
/* Add your own custom CSS here */