Updating translated pages with new content and design

This thread is resolved. Here is a description of the problem and solution.

Problem:
You are experiencing issues where the design elements such as background and font colors do not match between the original English page and its Norwegian translation after editing the original with Beaver Builder.
Solution:
We have addressed this issue in our latest updates of WPML. We recommend updating your WPML plugins to the latest version to ensure compatibility and correct synchronization of design elements across translations. If after updating, the problem persists or if this solution does not apply to your case, we highly recommend checking related known issues at https://wpml.org/known-issues/, verifying the version of the permanent fix, and confirming that you have installed the latest versions of themes and plugins. If you still need assistance, please open a new support ticket at WPML support forum.

This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

Tagged: Compatibility

This topic contains 2 replies, has 0 voices.

Last updated by Paola Mendiburu 10 months, 3 weeks ago.

Assisted by: Paola Mendiburu.

Author	Posts
February 18, 2025 at 12:38 pm #16718614
cimpleA	Background of the issue: I'm currently trying to learn how this plugin works on staging, before beginning work on our live site. I've made a translation of the original English page (hidden link) to Norwegian (hidden link). I then edited the English original using Beaver Builder page builder, where I added a new row with a new header, followed by updating the translation of the new content. Symptoms: The new translated text is added to the translated page, but design does not follow the original. Background color of the rows is not the same, and the font color is not the same, so I can't even read it because it is blending into the background (same color). Questions: Why is the design not following the original after updating the translation? How can I ensure the background and font colors match the original design?
February 18, 2025 at 1:59 pm #16719321
Bruno Kos WPML Supporter since 12/2018 Languages: English (English ) German (Deutsch ) French (Français ) Timezone: Europe/Zagreb (GMT+02:00)	Could you please import one of these pages here: hidden link You can use the import/export tool if needed: hidden link After importing, check if the CSS issue still occurs (by changing something in the original and updating the translation). If the issue doesn't happen there, please test the following on your site: 1. Deactivate Other Plugins - Keep only WPML plugins and Beaver Builder active. - This will help identify if there's a conflict with another plugin. 2. Switch to a Default Theme - Activate a default WordPress theme like Twenty Twenty. - This will determine if the theme is causing the issue. 3. Disable All Caching - Turn off any caching plugins. - Clear the cache via Beaver Builder’s troubleshooting tool and your caching plugins. 4. Check File Permissions and Server Logs - CSS files should be stored here: wp-content/uploads/bb-plugin/cache. - Please check that the server has permission to write to this directory. - If needed, check the server logs for any permission-related errors that might explain why manual input is required to update these files. Let me know what you find after running these tests.
February 19, 2025 at 1:35 pm #16724711
cimpleA	Hi Bruno, I imported a page and repeated the process from yesterday: 1. Add translated version 2. Added new content to the page using beaver builder on original (english). 3. Updated the translation (german) 4. Visited the updated translated page. This added the new content, but again the styling such as background color, font color etc. don't follow. See comparison here, last section with the button is the new one: English original: hidden link German translation: hidden link I have note cleared any cache yet, in case you want to look into it first. Regards, Mattias
February 19, 2025 at 2:34 pm #16725278
Bruno Kos WPML Supporter since 12/2018 Languages: English (English ) German (Deutsch ) French (Français ) Timezone: Europe/Zagreb (GMT+02:00)	Thank you very much for performing the test! I can see that only after clearing the CSS cache it works properly: hidden link In my opinion as well, this should happen automatically. This has been escalated to our Compatibility team and may take some debugging time, I'll get back to you as soon as I have any news or questions for you
February 24, 2025 at 7:13 am #16739042
Bruno Kos WPML Supporter since 12/2018 Languages: English (English ) German (Deutsch ) French (Français ) Timezone: Europe/Zagreb (GMT+02:00)	Can you please try the following: 1. Add the following code to your `functions.php` file to clear all caches when a translation is completed: if ( class_exists('FLBuilder') ) { add_action( 'wpml_pro_translation_completed', function( $post_id ) { if ( is_numeric( $post_id ) ) { \FLBuilderModel::delete_all_asset_cache( $post_id ); } else { \FLBuilderModel::delete_asset_cache_for_all_posts(); } // delete partials \FLBuilderModel::delete_asset_cache_for_all_posts( 'layout-partial' ); }); } 2. Note that if you make a small CSS change on the original, you will need to resave the translation for the changes to be applied. Does it work? We will implement this change in our page builders core.
February 25, 2025 at 11:24 am #16745266
cimpleA	I added a slightly adjusted version of your code to my code snippets, instead of adding the above in the functions.php. This seem to work for now, as long as i resave translation as you mention. Do I understand it correctly that this is a temporary fix, and will be resolved in the next wpml update? If so, do you have a estimate for when the update will be pushed live?
February 26, 2025 at 7:04 am #16749160
Bruno Kos WPML Supporter since 12/2018 Languages: English (English ) German (Deutsch ) French (Français ) Timezone: Europe/Zagreb (GMT+02:00)	Yes, you understand correctly. This is a temporary workaround, and the issue is already being worked on. While I don't have an exact release date, I believe it could be resolved in the next minor WPML update. I can keep you updated once there's more concrete information on the release timeline.
February 26, 2025 at 11:42 am #16750758
cimpleA	Thank you for confirming. Looking forward to the update, thanks! 🙂
February 26, 2025 at 12:50 pm #16751017
Bruno Kos WPML Supporter since 12/2018 Languages: English (English ) German (Deutsch ) French (Français ) Timezone: Europe/Zagreb (GMT+02:00)	This issue has been escalated to WPML developers. I will keep this thread updated as soon as I get any new information from them!
June 19, 2025 at 11:46 am #17150373
cimpleA	Hi Bruno, I just noticed in the release notes for update 4.7.4 that this was mentiond: https://wpml.org/version/wpml-4-7-4/ "Beaver Builder: When translations are updated, the CSS cache is now flushed." Does this mean that the problem we discovered as discussed above is solved?
June 24, 2025 at 8:11 am #17163490
Paola Mendiburu WPML Supporter since 11/2020 Languages: English (English ) Spanish (Español ) Italian (Italiano ) Timezone: Europe/Madrid (GMT+02:00)	Hi there! This is Paola and I will continue with the ticket as Bruno is on holidays. Yes the issue has been fixed in our latest updates of WPML. Please let me know if you have any problem.