I'm having a hard time to translate to WPML using Cornerstone

Hey folks, I’m having a hard time to translate to WPML using Cornerstone.

I’ve made all the steps to make it work (duplicated, set to translate independendly, etcetera) but I’m having really bad issues with m headers.

The first image is the original English contact form page:

Then, the translated version in Brazilian Portuguese:

Despite the different color, it seems that the header is being superimposed on top.

I kindly ask you folks to have some interaction with the WPML people, it looks like you or they need to update something on your integration, to have it working as supposed.

I’ll keep looking forward from you on that. Need to translate the site to 3 other languages (Brazilian Portuguese, Spanish and French) to be able to launch the site in September.

Thank you very much once more, best regards!

Hello @fabiofava,

Thank you for the inquiry.

Did you create a custom header for each language? The header in the default language looks different compared to the Brazilian Portuguese version. We may need to inspect the site to better understand the issue. Please create a test page, then provide the login details in the secure note.

We’ll check the issue as soon as access is available.

Best regards,

Hey @Ismael,

I still have the Staging Site there. I’ll push the latest changes (as the other issue at https://theme.co/forum/t/white-footer-on-no-header-no-footer-page-and-double-scrollbar-on-cornerstone/ wasn’t yeat replied.

I’ll add the credentials on a secure note.

Thank you very much and best regards

Thank you for the info. Looks like you’ve created a custom header for the BR language called “Header BR” (see secure note). Have you tried editing the header elements there?

Hey @ismael thanks for your fast reply

I’ve done the steps I was told to for translating CS-created pages:

  1. Select Edit on the original English page and set it to use the WordPress Editor, save & back to WP-Admin > Pages;
  2. Change WP-Admin to translated language, and again use the WordPress Editor to edit translated, change Title and Slug, re-set Category, etcetera, then save and get back to WP-Admin > Pages;
  3. Click on Edit with Cornerstone and edit the translated page.

I have doubts on how to define the translated Header & Footer to the translated pages, wo when site loads flynet.me/en/ all pages under /en/ should load with the original English Pages, Header & Footer. And when site loads flynet.me/br/ all pages under /br/ should load with the translated Portuguese Pages, Header & Footer.

Thank you once more for dedicating the time and support to my case. Cheers brother!

Hey @fabiofava,
Is the WPML Media Translation pulgin active? If yes make sure to deactivate it.
The pulgin causes issues with custom code. Hope that helps.

Dear @sarveshwarge

WPML is a crucial part of the site. Deactivating it causes real trouble on the site, as later it will try to reconnect things and much likely will break it again.

Cornerstone is listed at the WPML website as compatible. I kindly ask ThemeCo to work cooperatively with the WPML people so this can be rapidly tracked and fixed.

I’ll keep looking forward from you on that. I’ll make the entire site in english, with the WPML suite enabled (as it only breaks things on the translated files, wich doesn’t even load the Preview at Cornerstone). Please let me know if I can help in any possible way.

Thank you once more for your help and support on this case.

Best regards

Hey @sarveshwarge

I assume I can disable WPML Media Translation for editing the pages, then re-activate it afterward, is that correct?

P.S. - WPML Support Staff may also be accesing the Staging Server to debug this issue

I’ll keep looking forward from you on that, thank you very much!

Hey @sarveshwarge

I’ve deleted the translated version of the Contact page, emptied the trash, disabled all caches just in case. Then I’ve disabled WPML Media Translation plugin, and edited the original Contact page in English with the WordPress Editor, to make sure it’s set to be translated with the WordPress Editor and not with the WPML Editor. Saved.

Got back to the pages screen, selected Portuguese and edited the page also with the WordPress Editor. Clicked to Translate Independently and saved and closed. Back to the pages screen, clicked to Edit wiht Cornerstone the translated page. The Social Shares and Info Bar indeed aren’t appearing now (wich brings the question: if I later activate WPML Media Translation and do not edit back ion Cornerstone, will the pages keep working?).

On the other hand, the header problem is still there. The brown area above the site logo (wich is on the header) shouldn’t be there. And the contents doesn’t show on the Cornerstone preview, only header (with the artifact) and the footer). Also, the WP Toolbar appears, despite being set not to show (only happens on the duplicated pages):

I’m affraid the WPML and ThemeCo compatibility is in some way messing-up things. I assume both companies would need to take a few dev hours to track and fix this, so the sites show properly on all languages.

I’ll keep looking forward from you folks on that. It’s really important to keep updated the compatibility with WPML, it’s the world leader on WordPress Translation Systems.

Thank you very much once more for your patience and support, cheers!

Thank you for the update.

It sounds like you’re using a rather complicated method to translate the pages. If possible, let’s start from scratch. The recommended approach for translating pages in Cornerstone using WPML is outlined in the following documentation: https://theme.co/docs/wpml#translating-content-with-wpml

There are two supported methods: one using WPML > Translation Management, and the other using the built-in language switcher directly in Cornerstone.

To give an example of the Pro method. We created a new page in English (EN) called “Test EN”, then selected “Header EN” and “Footer EN” under the Layout and Assignments section. As described in the documentation, to translate the page into another language (e.g., Brazilian Portuguese), we clicked the BR language flag, copied the content from the EN version, then edited it as needed. We also selected the appropriate header and footer for the BR version. We followed the same process for Spanish (ES) and French (FR) languages.

If you prefer using WPML > Translation Management, start by creating the EN page (or the base language of your choice), assign the relevant headers and footers, then save it.

Then go to WPML > Translation Management, find the new page in the Pages tab, select it, and proceed to Step 2. You can choose to translate automatically or select “Translate Myself”. This sends the translation to the queue, which you can manage under WPML > Translations: https://site.com/wp-admin/admin.php?page=tm%2Fmenu%2Ftranslations-queue.php

You can find the examples or test pages in the secure note.

Translating directly in Cornerstone is faster and more straightforward. If you prefer managing everything from a central interface or want to avoid creating separate pages for each language, WPML’s Translation Management is a better option.

Hope this helps clear things up a bit.

Hey @fabiofava unfortunatly if you activate the WPML Media Translation plugin again, the issue will return and page won’t work the way you want to. You can keep the rest of the WPML pulgins activate, just keep the WPML Media Traslation pulgin deactivated.

Hey @sarveshwarge thank you for the information.

Will I be able to keep translating manually the media changing the language at the Media Gallery and translating manually?

Cheers brohter

Hello @fabiofava,

Yes, you can manually translate your media or assign separate media files per language without the Media Translation add-on.

Hope it helps
Thanks

Hello @prakash_s thank you for all the informations!

I confirm you that I’ve done as you’ve said (like I’ve already done for Components, Headers and Footers), and I confirm that it’s working just fine. I’ve marked this page (on the proper post) on my Bookmarks, so to never fall again on the same mistake.

On the Media Translation, I use WP Media Folder (WPMF), wich allows me to store media in virtual “folders” to keep my media more organized. I go to each virtual folder, change the language on the WP-Admin Top Menu, and it works perfectly.

So I got rid of WPML Media Translation for good, I’ll even let all my clients of the FlyNet Cloud Hosting to know that and never install that plugin. Thank you for that advise!

I’ll keep the post for automatic closing, it will be very relevant to others. Please make sure that the Cornerstone and Pro tags are added to this Topic, so more people will benefit from the solution on post #113085/10 of this page.

Thank you very much again to all the amazing ThemeCo Support Staf. You rock!

Hello @fabiofava,

Glad that we were able to help you. We appreciate you marking the solution in your bookmarks and being proactive about sharing with the community!

Thanks

Thank you brother, all my best wishes

You are most welcome, @fabiofava