Skip Navigation

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

Problem:
The client is trying to prevent the translation of specific links in the header of their webpage. Despite adding the 'notranslate' class to these links in the HTML, WPML continues to translate them, causing issues with language switching in a multilingual dropdown menu.

Solution:
We recommend implementing one of the following solutions:

1. Use Data Attributes or HTML Comments:
Wrap the anchor tags with an HTML comment or use a data attribute to indicate to WPML that these links should not be translated.

<!--:notranslate--><br /><a href="https://staging.totara.fortyapp.com/es/" class="notranslate">Spanish</a><br /><!--:notranslate-->

2. Custom WPML Filters:
Add custom filters to your theme's functions.php file to exclude specific HTML elements from translation.

function exclude_links_from_translation($content) {<br />    $content = preg_replace('/<a href="https:\/\/staging.totara.fortyapp.com\/es\/">(.*?)<\/a>/', '<a href="https://staging.totara.fortyapp.com/es/" class="notranslate">$1</a>', $content);<br />    return $content;<br />}<br />add_filter('the_content', 'exclude_links_from_translation');

3. JavaScript Workaround:
Use JavaScript to dynamically modify the links after the page has loaded to ensure they do not get translated.

document.addEventListener('DOMContentLoaded', function() {<br />    var links = document.querySelectorAll('a.notranslate');<br />    links.forEach(function(link) {<br />        link.href = 'https://staging.totara.fortyapp.com/es/';<br />    });<br />});

4. Custom Fields Exclusion:
Ensure that the ACF fields used for the links are set not to be translated in the WPML settings.

If these solutions do not resolve your issue or if the information becomes outdated, 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 the problem persists, 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: 

This topic contains 7 replies, has 3 voices.

Last updated by Mihai Apetrei 4 months, 2 weeks ago.

Assisted by: Mihai Apetrei.

Author Posts
July 9, 2024 at 8:26 pm #15923194

kateH-7

Background of the issue:
I am trying to manually prevent the translation of some links in the header of our page. I tried adding the class of notranslate to the links in the HTML, but that did not prevent the translation.

Symptoms:
Adding the class of notranslate to the links in the HTML did not prevent the translation.

Questions:
Is there a way to indicate in the HTML that I do not want a link to be translated?

July 9, 2024 at 9:14 pm #15923328

Mateus Getulio
Supporter

Languages: English (English ) Portuguese (Brazil) (Português )

Timezone: America/Sao_Paulo (GMT-03:00)

Hello,

Thanks for contacting us.

Before your ticket is assigned to one of my colleagues, please allow me to walk you through some initial debugging steps. This will help speed up the support process.

Can you please try to use the workaround described by my colleague here:

https://wpml.org/forums/topic/dont-translate-links/#post-7355595

In summary:

- Edit your theme's functions.php file and add the following code:

add_filter( 'wpml_sl_blocklist_requests', 'wpml_sl_blocklist_requests', 10, 2 );
  
function wpml_sl_blocklist_requests( $blocklist, $sitepress ) {
    $blocklist[] = 'SLUG';
    return $blacklist;
}

Where you can replace 'SLUG' with the slug of the page you don't want to redirect your users to the translated version.

Please give it a try and let us know your results.
Mateus

July 9, 2024 at 11:07 pm #15923640

kateH-7

Hello!

So I do not want to prevent the translation of an entire page. I have a dropdown of links in the header of every page. I only want that dropdown of links to not be translated, not the entire page nor the entire navigation bar. Is there a way to just target specific elements that I do not want to have translated?

July 10, 2024 at 11:04 am #15927800

Mihai Apetrei
Supporter

Languages: English (English )

Timezone: Europe/Bucharest (GMT+02:00)

Hi there.

Can you please share a URL where I can see the page format?

I tried to access your site but I get: 403 ERROR - The request could not be satisfied.

I am not sure if you are talking about the main menu or about a separate menu that you have created with the page builder (or with the help of a different plugin) for each of the pages.

Can you please elaborate a bit more on this?

Thank you!

Mihai Apetrei

July 10, 2024 at 1:24 pm #15928250

kateH-7

Hello,

The url is hidden link.

So in the main header I have that globe icon that once hovered on has a dropdown menu of languages. This menu is not made from the WordPress Menu section -- a ACF field populates that dropdown. This menu is supposed to switch the language of the page ex. /de/ or /es/. But when the user goes to the a language page like /de/, those links are being translated in the menu so that for example going to the Spanish view will show the url as /es/de/ because WPML is auto translating those links to match the current language of the page, which we do not want for that menu. Those links should not be translated as to accurately be able to switch between languages

July 10, 2024 at 1:59 pm #15928456

Mihai Apetrei
Supporter

Languages: English (English )

Timezone: Europe/Bucharest (GMT+02:00)

Thank you for the info.

Once again, I am not able to see the site.

1. Can you please remove any security limits that might not allow me to see it?

2. would like to request temporary access (wp-admin and FTP) to your site so I can better examine the issue. The needed fields are below the comment area. When you log in to leave your next reply, the information you enter is private, meaning only you and I can see and access it.

Our Debugging Procedures

I will check various settings in the backend to see if the issue can be resolved. Although I won't be making changes that affect the live site, it is still good practice to back up the site before providing us access. In the event that we do need to debug the site further, I will duplicate it and work in a separate, local development environment to avoid affecting the live site.

Privacy and Security Policy

We have strict policies regarding privacy and access to your information. Please see:
https://wpml.org/purchase/support-policy/privacy-and-security-when-providing-debug-information-for-support/

**IMPORTANT**

- Please back up the site files and database before providing us access.

If you do not see the wp-admin/FTP fields, your post and website login details will be made PUBLIC. DO NOT post your website details unless you see the required wp-admin/FTP fields. If you do not, please ask me to enable the private box.

The private box looks like this: hidden link

I will be waiting for your response.

Kind regards,
Mihai Apetrei

Screenshot 2024-07-10 at 16.58.17.png
July 10, 2024 at 2:15 pm #15928562

kateH-7

Unfortunately our site's security cannot be lowered at this time.

For the the sake of clarification, this is the issue:

Link i have hard coded in the HTML: hidden link (This is in an anchor tag)

The current URL: hidden link

The resulting link: hidden link.

As you can see, the hard coded link gets automatically translated to append the /de/ at the end based on the current language of the page. But i need it to remain /es/.

I hope this offers more clarification

July 15, 2024 at 11:03 am #15953892

Mihai Apetrei
Supporter

Languages: English (English )

Timezone: Europe/Bucharest (GMT+02:00)

Hi there,

Thank you for the additional clarification regarding your issue and also for your patience throughout the investigation process.

Based on the information you've provided, it seems that the hard-coded links in your HTML are being automatically translated by WPML, causing the URLs to append the current language path, which is not the desired behavior.

Without access to your site, it is challenging to provide a precise solution. However, I can suggest a few potential workarounds that you can try to implement:

1. Using Data Attributes or HTML Comments:
One method to prevent WPML from translating specific parts of your HTML is to use data attributes or HTML comments. You can try wrapping your anchor tags with an HTML comment or use a data attribute to indicate to WPML that these links should not be translated.

Example:

html
<!--:notranslate-->
<a href="<em><u>hidden link</u></em>" class="notranslate">Spanish</a>
<!--:notranslate-->

2. Custom WPML Filters:
Another approach is to use custom WPML filters to exclude specific HTML elements from translation. You can add custom filters to your theme's `functions.php` file to achieve this.

Example:

php
function exclude_links_from_translation($content) {
    $content = preg_replace('/<a href="https:\/\/staging.totara.fortyapp.com\/es\/">(.*?)<\/a>/', '<a href="<em><u>hidden link</u></em>" class="notranslate">$1</a>', $content);
    return $content;
}
add_filter('the_content', 'exclude_links_from_translation');

3. JavaScript Workaround:
You can also use JavaScript to dynamically modify the links after the page has loaded, ensuring they do not get translated.

Example:

javascript
document.addEventListener('DOMContentLoaded', function() {
    var links = document.querySelectorAll('a.notranslate');
    links.forEach(function(link) {
        link.href = '<em><u>hidden link</u></em>';
    });
});

4. Custom Fields Exclusion:
Since you mentioned using ACF (Advanced Custom Fields), ensure that the fields are set not to be translated. You can do this in the WPML settings under the ACF fields translation preferences.

Next Steps:
1. Please try implementing the above suggestions and see if they resolve the issue.
2. If possible, consider setting up a staging environment where security settings are more relaxed, allowing us to access and debug the issue directly.
3. Alternatively, provide detailed screenshots or a screen recording of the issue along with the relevant code snippets for further guidance.

While I understand that lowering your site's security is not an option, these steps might help you work around the limitations and find a solution.

I hope that you will find this information helpful.

Mihai