WooCommerce themes setting and customization

Why do I need to do something?

The plugin "scalexpert" override the natives WooCommerce templates to display the scalexpert financing on the following pages: - product - shopping cart - order details (returned page after financing customer journey

What do I need if something is wrong!

You have encountered issued when rendering these pages, don't panic 😟 let us guide you in the diagnosis to solve your issue.

First, identify the theme you are using on your back-office "themes" menu:

Second, verify your in "WooCommerce" menu "setting/advanced" that all pages used are filled

And also in the "WooCommerce" status menu:

Once, your theme identified you must found your "theme type": "classic" or "block". According that "type" the method to customize your theme will be different.

Customize a "Block" type theme

Customization of "block" type theme can be done in the wordpress back office menu "Appearance/editor"

We will demonstrate the setting with the standard "Twenty-twenty-four" theme. This theme use directly "woocommerce blocks" and therefore bypass the customization done by scalexpert plugin. We will correct this by overidden some part of the coding.

Open the editor from "appearance/editor" menu

Once opened, navigate into "template" menu to open the templates that need to be customized:

• single product

• cart

• check-out

• my account

Select the template, open it then go to the "code editor" menu to access the code of the template.

Then replace existing code by the following:

<!-- wp:template-part {"slug":"header","theme":"twentytwentyfour"} /-->
<div class="wp-block-group woocommerce product is-layout-flow wp-block-group-
is-layout-flow">
<div class="wp-block-group has-global-padding is-layout-constrained wp-
block-group-is-layout-constrained">
<!-- wp:woocommerce/legacy-template {"template":"single-product"}
/-->
</div>
</div>
<!-- wp:template-part {"slug":"footer","theme":"twentytwentyfour"} /-->

After recording, you should see appear the "financing" options in the product page:

Repeat the same operation for the other templates:

[woocommerce_checkout]

[woocommerce_cart]

[woocommerce_my_account]

Customize a "Classic" type theme

The WooCommerce template that have been overridden are present in the wordpress directory "/wp-content/plugins/woo-scalexpert/woocommerce"

Code overridden are marked with a commentaire "SG Paiement en plusieurs fois".

	...
	<?php else : ?>
	<!--  SG Paiement en plusieurs fois -->
	<p class="woocommerce-notice woocommerce-notice--<?= $classNotice ?> woocommerce-thankyou-order-received">
		<?php
			/**  SG Paiement en plusieurs fois */
			if ( $orderData['payment_method'] == "scalexpert" ) {
				echo apply_filters(
					'woocommerce_thankyou_order_received_text',
					$API_CALL['TextStatus'],
					$order );
			} else {
				echo apply_filters(
					'woocommerce_thankyou_order_received_text',
					esc_html__( 'Thank you. Your order has been received.',
						'woocommerce' ),
					$order );
			}
			/**  SG Paiement en plusieurs fois */
		?>
	</p>
	<!--  SG Paiement en plusieurs fois -->
	...

For more information on woocommerce templates structure directory see the related documentation.

Do that resolve your issue?

We hope this tutorial will help you on the resolution of issues you may encountered in the customization of your theme.