Background of the issue:
We have been having horrendous issues in our production Woo shop lately, with customers using the translated version (German) of our Checkout page. This has led to gaps in our invoicing numbers, customers being charged multiple times and us having to refund them and us having to remedy all the accounting gaps!
The checkout page (shop-wcb-checkout) is intentionally kept super minimal, with just a title, the Woo Block Checkout block, and some Rank Math SEO metadata.
When the page is translated on our production site, it looks like it has been correctly translated and saved, but when you go back in to the German version of the page, we see the block elements are all corrupted (see screenshots)
Symptoms:
The translated version of the WooCommerce Block Checkout page in German is corrupted, causing issues like gaps in invoicing numbers, customers being charged multiple times, and accounting gaps. The class 'wp-block-woocommerce-checkout-actions-block' is replaced with incorrect code, leading to multiple concurrent requests. The 'Attempt Recovery' feature does not resolve the issue permanently, and the page remains unstable.
I have been in close contact with Woo Support, who stated this:
=============================
The standard code added by the block checkout is replaced with incorrect code:
Note how the class `wp-block-woocommerce-checkout-actions-block` got completely replaced with something else.
The problem here is that the simple presence of a CSS class wp-block-woocommerce-checkout causes an additional request. (This is what Woo needs to fix) If WPML ends up corrupting 15 elements - that means 15 concurrent requests!
You can reach out to WPML support for the corruption issue.
=============================
When I translate the page, I am simply copying the original code from the Woo Checkout Block from the English to the German version. As you can see in the screenshots, the orignally copied over code is not always being maintained correctly and is being replaced with wrong code entirely!
When the page is corrupted, and I open the German version of the page (hidden link) in the back end I see several blocks with "Attempt Recovery". I clicked “Attempt Recovery” on all the blocks and saved, which visually looked good. Then went back in to the German version of the page and the “Attempt Recovery” blocks were all appearing again. However this time I click the ellipsis to the right of the Attempt Recovery button and got a “Resolve” option which showed this, again an extra br break tag.
I have also tried editing the original en page. I deleted the Checkout block completely and saved.
Then I re-added the checkout block and saved.
Then sent it through WPML to translate, making sure to copy the code exactly.
I went in to the German page again and clicked Attempt Recovery on all the buttons and saved, now it seems to be correct. But it is very unstable and not translating reliably with WPML.
I have created a user for you to examine on our production site. Not sure if the (annoying) new AI ticket process will allow me to enter it.
Requesting urgent help, before the next customer buys from German version of checkout, potentially creating more technical, accounting, and financial havoc for us!
Kind regards
Simon
Questions:
How can I ensure the WooCommerce Block Checkout is translated correctly without corruption?
What steps can I take to prevent the replacement of the correct code with incorrect code in the German version?
Just because we are (still) using the "legacy" Classic Translation Editor doesn't mean that WPML shouldn't support it. I don't believe that we should be forced to go to Advanced Translation Editor.
When I click on the WordPress Editor option mentioned in the link, it states
"Translate with the WordPress Editor when you want to create different designs for translations, or if you're translating content that's incompatible with WPML's Translation Editor."
I do not want to have a different design for my translation. The WooCommerce standard Checkout Block should be compatible with the WPML Translation Editor, whether using Legacy Classic Translation Editor or not.
Can you please follow up and double check what it is that is not compatible with the WooCommerce standard Checkout Block in combination with the WPML Translation Editor?
Also, take note that it is not recommended to edit translation directly inside the WordPress Editor if on the original content the "WPML Translation Editor" is set as the translation method.
In this case, you will need to open the original page and switch the translation method inside the right sidebar to "WordPress Editor".
Best regards
Andreas
The topic ‘[Closed] Incorrect translation of Woo Checkout Block causing Woo shop to fail in German’ is closed to new replies.