Skip Navigation

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

Problem:
The client is experiencing an issue where custom ACF fields in the primary menu are not translating correctly on a multilingual site. While the menu items themselves translate correctly, the custom ACF fields return null when viewed in Chinese, despite displaying data correctly in English.
Solution:
We recommend following the steps outlined in the ACF documentation for adding and displaying fields in menus. Specifically, you can modify the

functions.php

file in your theme folder to include the following code:

add_filter('wp_nav_menu_items', 'my_wp_nav_menu_items', 10, 2);
function my_wp_nav_menu_items( $items, $args ) {  
    // get menu
    $menu = wp_get_nav_menu_object($args->menu);            
    // vars
    $menu_text = get_field('test_menu_field', $menu);               
    // append html
    $items = $menu_text . $items;                  
    // return
    return $items;
}

For further guidance, refer to the ACF documentation on adding fields to menus and displaying fields. If this solution does not resolve your issue, or if the documentation links are outdated, we recommend opening a new support ticket. Additionally, please check related known issues at https://wpml.org/known-issues/, verify the version of the permanent fix, and confirm that you have installed the latest versions of themes and plugins. If further assistance is needed, please contact our 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 3 replies, has 2 voices.

Last updated by Long Nguyen 1 year ago.

Assisted by: Long Nguyen.

Author Posts
May 28, 2024 at 8:41 pm #15680941

Andrew Von Haden

Background of the issue:
I am working on a site under development and trying to translate custom ACF fields in the primary menu using WPML. The primary menu has been synced to Chinese, and while the menu items themselves translate correctly, the custom ACF fields do not.

Symptoms:
When viewing the page in Chinese, the custom ACF fields return null, despite working correctly and displaying data on the English (default) page.

Questions:
Why are the custom ACF fields returning null when viewing the page in Chinese, despite being correctly displayed in English?
How can I ensure that the custom ACF fields are translated and returned correctly for the Chinese menu?

May 29, 2024 at 4:05 am #15681567

Long Nguyen
WPML Supporter since 02/2022

Languages: English (English )

Timezone: Asia/Ho_Chi_Minh (GMT+07:00)

Hi Andrew,

Thank you for contacting WPML support, I’m happy to help you with this issue.

I try to replicate the issue on my local site by following the ACF documentation to create and output menu fields
hidden link

but don't see that issue. The translation menu field value is displayed correctly in the frontend, please check the attached screenshots.

Can you please try to replicate the issue on a clean installation of WordPress? You can access the admin area directly with this link
hidden link

Kindly follow the steps below:

- Don’t restore your site there.
- Try to replicate the issue with minimal steps.
- Then let me know the steps to replicate it.

Looking forward to your reply.
Thanks

Menus ‹ WPML — WordPress 2024-05-29 10-54-07.png
WPML 2024-05-29 10-53-52.png
May 29, 2024 at 2:31 pm #15684524

Andrew Von Haden

I was able to set up the same system on that sandbox environment with the same result.

For simplicity, I just edited the theme file. You can find my modifications in:
Appearance > Theme File Editor > Global Templates > navbar-collapse-bootstrap5.php

I added a field to the menu called Test Menu Field in ACF. This field is attached to the Primary Menu. I then added a primary menu to the site with two placeholder links and test content in that ACF field. the then used the menu sync feature to create a French menu.

With in the theme file I called both of these fields with:
$test_fields_en = get_fields("menu_9");
$test_fields_fr = get_fields("menu_10");

I am then outputting those fields at the bottom of that file:
<h4>
Test Fields EN
</h4>
<pre>
<?php print_r($test_fields_en) ?>
</pre>

<h4>
Test Fields FR
</h4>
<pre>
<?php print_r($test_fields_fr) ?>
</pre>

On the english version of that site, I am able to output both the English and French using their menu IDs. On the French site, I get nothing:
hidden link
hidden link

This behavior is exactly what I am experiencing on my staging site.

May 30, 2024 at 2:15 am #15685701

Long Nguyen
WPML Supporter since 02/2022

Languages: English (English )

Timezone: Asia/Ho_Chi_Minh (GMT+07:00)

Hi,

I'm not sure why it doesn't work on the template file of the theme. But I just follow the sample code in the ACF documentation
hidden link

to output the menu field value and it works correctly on the sandbox site. The code is added to the file functions.php in the theme folder.

add_filter('wp_nav_menu_items', 'my_wp_nav_menu_items', 10, 2);
function my_wp_nav_menu_items( $items, $args ) {  
    // get menu
    $menu = wp_get_nav_menu_object($args->menu);            
	// vars
	$menu_text = get_field('test_menu_field', $menu);               
	// append html
	$items = $menu_text . $items;                  
    // return
    return $items;
}

Note: it is out of the scope of WPML. If you are not able to accomplish this, I would recommend you contact one of our certified partners who will be more than happy to help you with this. In this link, you will find a list of our certified partners: https://wpml.org/contractors/

Thanks.

Sandbox – Just another WordPress site 2024-05-30 08-54-57.png
Sandbox – Just another WordPress site 2024-05-30 08-54-43.png
May 30, 2024 at 8:14 pm #15690102

Andrew Von Haden

Thank you, this gave me enough to go on to get this to work for me. For whatever reason, using get_field() with the menu ID wasn't working, but using the menu object instead does!