ACF and WPML

This tutorial explains how to translate sites that are built with the Advanced Custom Fields (ACF) plugin and WPML. All you need to do is configure WPML to translate the related custom fields groups. Then, you will be able to translate ACF’s fields, including the repeater fields.

One of the most important features of WPML’s integration with Advanced Custom Fields plugin is the ability to translate the repeater fields. The following image displays how this is easily done using WPML’s Translation Editor.

Translating a page with ACF repeater field using WPML Translation Editor

Translating a page with ACF repeater field using WPML Translation Editor

On this page

Requirements and installation

You will need the following plugins installed and activated in your site:

  • The ACF plugin (latest free or pro version)
  • A recent version of WPML (version 3.5.3 or above), including the String Translation and Translation Management add-ons.
  • The Advanced Custom Fields Multilingual (ACFML) plugin. ACFML is a bridge plugin that makes WPML and Advanced Custom Fields plugin compatible.

WPML’s Getting Started Guide will help you in setting up WPML in a few minutes. You might want to refer to some of its subtopics later on, such as Theme and Plugin Localization and String Translation. We recommend that you keep this guide open while following this tutorial.

The setup of the ACFML plugin is simple. You can download the plugin on the WPML site, from the Download section of your Account page. There is no user interface or any specific settings – the plugin works in the background.

The ACF documentation will provide you with all the information needed to set it up and use it.

Making the ACF fields translatable

Before translating any custom fields using WPML, including the ones created with ACF, you need to select appropriate translation options for them.

You can do this in two ways:

  • Use the Multilingual Content Setup box when editing posts and pages.
  • Go to the WPML -> Translation Management page, click the Multilingual Content Setup and set the options in the Custom Field Translation section.

There are three translation options  for custom fields translation:

  • Don’t translate – the field is ignored and no translation is performed or available for it.
  • Copy (from original to translation) – the value of the field is copied from the one in the original language.
  • Translate – allows you to manually translate the field values.

 

For simple fields, there is one option per field, as displayed in the following image.

Translation options for simple ACF fields

Translation options for simple ACF fields

For the repeater fields, you need to set the translation option for each instance of the field inside the repeater, as displayed in the following image.

Translation options for repeater field

Translation options for repeater field

For the example displayed in the above image, we have a repeater field with three fields: “Title”, “Speaker”, and “Description”. Because we have three rows of the repeater fields in our page, this means we have to set translation options for three instances of each field – nine options altogether.

Please note that once you set the translation options for instances of a given repeater field, they will be used across other posts and pages (if they use this repeater field).

If you add another extra row to the repeater – you need to set the translation options for its instances, as displayed in the following image.

Setting the translation options for additional repeater rows

Setting the translation options for additional repeater rows

Translating ACF Fields

WPML offers two ways of translating your contents, using WPML Translation Management or using the standard WordPress editor.

Using WPML Translation Management is highly recommended because it allows you to send content to be translated by other translators and also features WPML’s Translation Editor. It makes translating ACF fields very easy, as displayed in the following image.

Translating a page with ACF repeater field using WPML Translation Editor

Using WPML Translation Editor to translate a page featuring ACF fields

As you can see, Translation Editor displays all contents in the original language, including ACF fields, on the left side of the screen. The right side presents the same but empty fields where the translation is entered.

To learn how to send the content to be translated by others, visit our page about Translation Management.

To use the Translation Editor for manually translating the content, go to the WPML -> Translation Management page and click the Multilingual Content Setup tab. There, select the Use the translation editor option under the How to translate posts and pages section.

As mentioned, you can also use the standard WordPress editor for manually translating your content and ACF fields.

Translating ACF user interface

Besides being able to translate the values of ACF fields that are shown on the front-end, WPML allows you to also translate the ACF user interface. This means that when translators are translating posts and pages that feature ACF fields, the labels and options for those fields will appear in that specific language. This can help to make the translator’s work easier and more convenient.

The following steps should guide you on how to do this.

1. Checking translation options

We need to be sure that the translation options are correct.

Go to: WPML -> Translation Management -> Multilingual Content Setup

ACF - Multilingual Content Setup

ACF – Multilingual Content Setup

Scroll down to the “Custom Posts” section and select the options in the following:

  • Field Groups is selected as Translate.
  • Fields is selected as Do nothing (this is an addition in Advanced Custom Fields Pro).
Set "Translate" for "Field Groups" and "Do nothing" for "Fields".

Set “Translate” for “Field Groups” and “Do nothing” for “Fields”.

2. Creating Field Groups and Fields

Start by creating the field groups and fields, as you would normally do with ACF. Notice the new Language box at the top-right. You are creating the field groups and fields in this language. When you are done, you can translate the groups and fields into other languages.

Adding Field Groups & Groups

Adding Field Groups & Groups

3. Translating field groups and fields

Once you have created the field groups and fields, you need them to appear in other languages of the site.

Start by duplicating the group to the other languages by selecting the Duplicate checkbox and then clicking the Duplicate button.

Duplicate ACF Field Groups

Duplicate ACF Field Groups

After duplicating, we have the exact same field groups and fields for all the site’s languages.

Click on the pencil icon to edit text in the fields for different languages.

Editing ACF Field Groups

Editing ACF Field Groups

The editor shows you a duplicate of the field group in your translation language. Click on the Translate independently button to disconnect the edits done to the translation from the ones in the original language.

Translating ACF Field Groups

Translating ACF Field Groups

Now we can edit the text in this group. To keep your field groups consistent for all the languages of the site, you should only edit the label and descriptions of the fields and not add new fields or change their Field Name values. If you do any changes like this to the fields, you should do so for all your site’s languages.

Translating ACF Field Groups

Translating ACF Field Groups

Once you are done with your edits, remember to click Update to save your changes.

The field group editing page includes several options that don’t require translation. They are normally synchronized with the field group in the default language, but you can change them in the translations if you want.

Multilingual Content Setup for ACF

Multilingual Content Setup for ACF

Now we can go and create a new post and see what we have achieved…

English

Field Groups in English

Serbian ACF Field Groups

Serbian

Serbian ACF Field Groups

Serbian ACF Field Groups

Translating other parts of the interface

So far, we talked about translating the field groups and fields. Like any other WordPress plugin, ACF has its own user interface which includes text. To have a fully localized WordPress admin, you can also translate the ACF’s interface.

Like many other WordPress plugins, ACF comes with its own translations. Before you translate ACF’s interface, check with the author to see if translation in your language is already available.

Still need to translate ACF’s interface? Go to the WPML -> Theme and plugins localization page.

You will see a list of plugins. Find Advanced Custom Fields and click the Scan the selected plugins for strings button. WPML will scan ACF’s code and locate all translatable strings.

After the scan is complete, click the button to View all the plugin’s texts, which will take you to the String Translation page displaying the ACF’s strings.

Translating AVF admin Strings

Translating AVF admin Strings

Translating ACF Admin Strings

Translating ACF Admin Strings

Translate the strings that you want using WPML’s String Translation interface. When you are done, the field groups, fields and ACF’s user interface will all appear fully localized.

Translated ACF admin strings

Translated ACF admin strings

Known Issues

There is currently one known issue you might encounter when translating ACF with WPML:

  • Inability to translate the backend, user interface labels of ACF fields.

We are investigating this issue and will fix it in the upcoming releases.

F.A.Q

  • Why are my custom fields not showing on the translated post/page?
    You probably did not translate the fields to the language you are editing in. To fix this, refer to step 3 – Translating field groups and fields.
  • Untranslated post object and page link fields do not show on the back-end of the duplicated post despite the fact that the post is associated with the correct value for the post object and page link custom fields in the database.
    Please note that this is not a bug and it does not affect the functionality. Read more about this scenario on our dedicated FAQ page.
  • The texts in the field groups are the same for all languages
    To select the desired translation option for a custom field value, be sure to check the “Multilingual Content Setup” box that appears below editor on your Post/Page edit screen. Make sure you select one of the available options for the desired fields.
    The available options are:
    1. Don’t translate – Do not translating value for other languages
    2. Copy – Duplicate the same value from default language
    3. Translate – Translate value for other languages

Getting help

If you need help using WPML with Advanced Custom Fields, please head over to our technical forum.